[IMP] website: review "boxed" layout

Part of https://github.com/odoo/odoo/pull/56427
task-2264627

X-original-commit: 6eab56a150dec8a40cf7064e9d4d2dfe172e189a
Co-authored-by: qsm-odoo <qsm@odoo.com>
This commit is contained in:
stefanorigano (SRI)
2020-08-28 08:19:33 +00:00
committed by Xavier-Do
co-authored by qsm-odoo
parent e0011d883d
commit d9bdaf7d90
6 changed files with 39 additions and 18 deletions
+1 -1
View File
@@ -14,7 +14,7 @@ $yiq-text-light: o-color('white') !default;
//
// Settings for the `<body>` element.
$body-bg: if($o-theme-layout == 'full', o-color('o-cc1-bg'), o-color('body')) !default;
$body-bg: if(o-website-value('layout') != 'full', o-color('body'), o-color('o-cc1-bg')) !default;
$body-color: o-color('o-cc1-text') or color-yiq(o-color('o-cc1-bg')) !default;
// Links
@@ -1 +0,0 @@
$o-theme-layout: 'boxed';
@@ -1,4 +1,3 @@
$o-theme-layout: 'full';
//------------------------------------------------------------------------------
// Colors
@@ -247,6 +246,7 @@ $o-base-website-values-palette: (
'body-image': null,
'body-image-type': 'image', // 'image' or 'pattern'
'layout': 'full', // 'full' / 'boxed'
'color-palettes-number': null, // Default to the individual variables for each color palette type
'btn-primary-outline': false,
+34 -5
View File
@@ -72,13 +72,42 @@ $-seen-urls: ();
}
}
@if ($o-theme-layout == 'boxed') {
@include media-breakpoint-up(md) {
padding: 0 7.5%;
@if o-website-value('layout') == 'boxed' {
> main {
background-color: o-color('o-cc1-bg');
}
#wrap {
background-color: o-color('o-cc1-bg');
@include media-breakpoint-up(sm) {
padding-right: $grid-gutter-width * 2;
padding-left: $grid-gutter-width * 2;
> * {
// When the website is visually acting like a container (eg.
// boxed layout), increase its maximum size to handle bigger
// horizontal paddings.
$-max-widths: ();
@each $key, $value in $container-max-widths {
$-max-widths: map-merge($-max-widths, (
#{$key}: $value + $grid-gutter-width * 2,
));
}
@include make-container(0);
@include make-container-max-widths($-max-widths);
}
> header .container {
max-width: 100% !important;
}
// Vertical alignment when top-menu has visually "no background"
@if o-color('menu') == o-color('body') {
> header {
.navbar, .container {
padding-left: 0;
padding-right: 0;
}
}
}
}
}
}
+3 -3
View File
@@ -891,9 +891,9 @@
<we-checkbox string="Show Header"
data-customize-website-views="website.option_layout_hide_header|"
data-reload="/"/>
<we-select string="Layout">
<we-button data-customize-website-views="" data-name="layout_full_opt">Full</we-button>
<we-button data-customize-website-views="website.option_layout_boxed_variables" id="option_layout_boxed">Boxed</we-button>
<we-select string="Layout" data-variable="layout">
<we-button data-customize-website-variable="'full'" data-name="layout_full_opt">Full</we-button>
<we-button data-customize-website-variable="'boxed'">Boxed</we-button>
</we-select>
<we-row string="⌙ Background" data-no-preview="true">
<we-colorpicker data-dependencies="!layout_full_opt"
@@ -745,13 +745,6 @@
</xpath>
</template>
<!-- Layout options -->
<template id="option_layout_boxed_variables" inherit_id="website._assets_primary_variables" active="False">
<xpath expr="//link[last()]" position="after">
<link rel="stylesheet" type="text/scss" href="/website/static/src/scss/options/layout/option_layout_boxed_variables.scss"/>
</xpath>
</template>
<template id="kanban">
<t t-set="step"><t t-esc="step or 0"/></t>
<t t-set="scope"><t t-esc="scope or 0"/></t>