[FIX] website_blog: restore latest posts snippet's styles
When the snippet was moved from the theme repository to the community repository, some scss mixins were badly refactored, making the theme specific styles not work anymore. This commit removes the bg color which was added to latest posts snippet's post elements as it made no sense, appeared broken and was not possible to remove. It also adds some padding to the snippet by default. This commit also reviews the snippet options which seemed to allow post color edition while it is in fact not possible. opw-1964485 closes odoo/odoo#33016 Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
This commit is contained in:
@@ -1,5 +1,3 @@
|
||||
|
||||
$s-latest-posts-big-picture-figure-bg: null;
|
||||
|
||||
@mixin s-latest-posts-js-get-posts-hook {};
|
||||
@mixin s-latest-posts-figure-hook {};
|
||||
|
||||
@@ -262,13 +262,10 @@
|
||||
}
|
||||
}
|
||||
|
||||
$s-latest-posts-big-picture-figure-bg: $white !default;
|
||||
|
||||
.s_latest_posts_big_picture {
|
||||
.s_latest_posts_post {
|
||||
position: relative;
|
||||
height: 250px;
|
||||
background: $s-latest-posts-big-picture-figure-bg;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
transition: all 300ms;
|
||||
@@ -281,9 +278,11 @@ $s-latest-posts-big-picture-figure-bg: $white !default;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 100%;
|
||||
max-width: 100% !important;
|
||||
height: 100%;
|
||||
padding: 0;
|
||||
opacity: 0.8;
|
||||
overflow: hidden;
|
||||
|
||||
> .o_blog_cover_component {
|
||||
@include o-position-absolute(0, 0, 0, 0);
|
||||
@@ -293,15 +292,17 @@ $s-latest-posts-big-picture-figure-bg: $white !default;
|
||||
background-position: center;
|
||||
}
|
||||
}
|
||||
> div, > div > a {
|
||||
@include o-position-absolute(0, 0, 0, 0);
|
||||
padding: 2em;
|
||||
color: $white;
|
||||
text-transform: uppercase;
|
||||
font-size: 1.25em;
|
||||
backface-visibility: hidden;
|
||||
&::after, &::before {
|
||||
pointer-events: none;
|
||||
> div:not(.o_blog_cover_container):not(.js-loading) {
|
||||
&, & > a {
|
||||
@include o-position-absolute(0, $grid-gutter-width/2, 0, $grid-gutter-width/2);
|
||||
padding: 2em;
|
||||
color: $white;
|
||||
text-transform: uppercase;
|
||||
font-size: 1.25em;
|
||||
backface-visibility: hidden;
|
||||
&::after, &::before {
|
||||
pointer-events: none;
|
||||
}
|
||||
}
|
||||
|
||||
> a {
|
||||
@@ -328,7 +329,9 @@ $s-latest-posts-big-picture-figure-bg: $white !default;
|
||||
@include s-latest-posts-figure-hook;
|
||||
}
|
||||
|
||||
@include s-latest-posts-js-get-posts-hook;
|
||||
.js_get_posts {
|
||||
@include s-latest-posts-js-get-posts-hook;
|
||||
}
|
||||
}
|
||||
|
||||
.s_latest_posts, .s_latest_posts_big_picture {
|
||||
|
||||
@@ -589,10 +589,10 @@
|
||||
</template>
|
||||
|
||||
<template id="s_latest_posts" name="Latest Posts - List">
|
||||
<section class="s_latest_posts">
|
||||
<section class="s_latest_posts pt16 pb16">
|
||||
<div class="container">
|
||||
<h2 class="text-center">Latest Posts</h2>
|
||||
<div class="row js_get_posts"
|
||||
<div class="row s_col_no_bgcolor js_get_posts"
|
||||
data-loading="true"
|
||||
data-template="website_blog.s_latest_posts_list_template"/>
|
||||
</div>
|
||||
@@ -600,10 +600,10 @@
|
||||
</template>
|
||||
|
||||
<template id="s_latest_posts_big_picture" name="Latest Posts - Big Images">
|
||||
<section class="s_latest_posts_big_picture">
|
||||
<section class="s_latest_posts_big_picture pt16 pb16">
|
||||
<div class="container-fluid">
|
||||
<h2 class="text-center">Latest Posts</h2>
|
||||
<div class="row js_get_posts"
|
||||
<div class="row s_col_no_bgcolor js_get_posts"
|
||||
data-loading="true"
|
||||
data-template="website_blog.s_latest_posts_big_picture_template"/>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user