pengyuthon/odoo_source
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[IMP] website, *: make cover options always available

Browse Source 
*: website_blog, website_event

It would make sense to be able to change the height of a cover or to
change the text alignment even if there's no backgroung-image.
Therefore, we're removing the background-image restriction for the
options of the cover snippet.

Part of https://github.com/odoo/odoo/pull/47933
task-2210733

closes odoo/odoo#47933

Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
This commit is contained in:
DramixDw
2020-07-15 11:36:56 +00:00
committed by qsm-odoo
parent 188c338ab2
commit da32bdb88a
4 changed files with 32 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/website/static/src/js/editor/snippets.options.js
+2 -3
View File
@@ -2020,6 +2020,7 @@ options.registry.CoverProperties = options.Class.extend({
this.$target.removeClass('o_record_has_cover');
} else {
this.$image.css('background-image', `url('${widgetValue}')`);
this.$target.addClass('o_record_has_cover');
const $defaultSizeBtn = this.$el.find('.o_record_cover_opt_size_default');
$defaultSizeBtn.click();
$defaultSizeBtn.closest('we-select').click();
@@ -2084,10 +2085,8 @@ options.registry.CoverProperties = options.Class.extend({
* @override
*/
_computeWidgetVisibility: function (widgetName, params) {
const hasCover = this.$target.hasClass('o_record_has_cover');
if (params.coverOptName) {
var notAllowed = (this.$target.data(`use_${params.coverOptName}`) !== 'True');
return (hasCover && !notAllowed);
return this.$target.data(`use_${params.coverOptName}`) === 'True';
}
return this._super(...arguments);
},
addons/website/views/snippets/snippets.xml
+3 -3
View File
@@ -614,9 +614,9 @@
<t t-set="with_color_combinations" t-value="True"/>
</t>
<we-select string="Size" data-cover-opt-name="size">
<we-button data-select-class="o_record_has_cover o_full_screen_height">Full Screen</we-button>
<we-button class="o_record_cover_opt_size_default" data-select-class="o_record_has_cover o_half_screen_height">Half Screen</we-button>
<we-button data-select-class="o_record_has_cover cover_auto">Fit text</we-button>
<we-button data-select-class="o_full_screen_height">Full Screen</we-button>
<we-button class="o_record_cover_opt_size_default" data-select-class="o_half_screen_height">Half Screen</we-button>
<we-button data-select-class="cover_auto">Fit text</we-button>
</we-select>
<we-select string="Filter Intensity" data-cover-opt-name="filters">
<we-button data-filter-value="0.0">None</we-button>
addons/website_blog/static/src/scss/website_blog.scss
+26 -31
View File
@@ -138,12 +138,34 @@ $o-wblog-loader-size: 50px;
// Blog Post Page Cover
// ==============================================
.o_wblog_post_page_cover {
// By default (no image defined), inner filters elements are hidden.
.o_record_cover_component {
display: none;
// Cover sizes
// ==============================================
&.cover_auto {
padding: 3rem 0;
// The actual height will always be 'auto'. The following
// min-height rule is set to trigger the page transition only.
min-height: 1px;
}
// If a cover image is defined, show filters + adapt inner typography
// "Regular Cover" design sizes
// ==============================================
&.o_wblog_post_page_cover_regular {
&.o_full_screen_height {
min-height: 350px;
}
&.o_half_screen_height {
min-height: 250px;
}
&.cover_auto {
min-height: 150px;
padding: 0;
}
}
// If a cover image is defined, adapt inner typography
&.o_record_has_cover {
.o_record_cover_image:after {
content: "";
@@ -151,42 +173,15 @@ $o-wblog-loader-size: 50px;
@include o-position-absolute(0,0,50%,0);
@include o-wbblog-scrim-gradient(rgba(black, 0.5), transparent);
}
.o_record_cover_component {
display: block;
}
.o_wblog_post_title {
color: white;
}
// Cover sizes
// ==============================================
&.cover_auto {
padding: 3rem 0;
// The actual height will always be 'auto'. The following
// min-height rule is set to trigger the page transition only.
min-height: 1px;
}
// "Regular Cover" design sizes
// ==============================================
&.o_wblog_post_page_cover_regular {
.o_record_cover_image:after {
visibility: hidden;
}
&.o_full_screen_height {
min-height: 350px;
}
&.o_half_screen_height {
min-height: 250px;
}
&.cover_auto {
min-height: 150px;
padding: 0;
}
}
}
addons/website_event/static/src/scss/website_event.scss
+1 -5
View File
@@ -205,7 +205,7 @@
z-index: 0;
.o_record_cover_component {
display: none;
z-index: -1;
}
&.o_record_has_cover {
.o_record_cover_image {
@@ -217,10 +217,6 @@
@include o-position-absolute(0,0,50%,0);
}
}
.o_record_cover_component {
display: block;
z-index: -1;
}
.o_wevent_event_title {
color: white;
}