diff --git a/addons/portal/__manifest__.py b/addons/portal/__manifest__.py
index e9fe1e36151..1fb78f87335 100644
--- a/addons/portal/__manifest__.py
+++ b/addons/portal/__manifest__.py
@@ -15,7 +15,7 @@ portal.
This module contains most code coming from odoo v10 website_portal. Purpose
of this module is to allow the display of a customer portal without having
a dependency towards website edition and customization capabilities.""",
- 'depends': ['http_routing', 'mail'],
+ 'depends': ['web', 'web_editor', 'http_routing', 'mail'],
'data': [
'data/portal_data.xml',
'views/assets.xml',
diff --git a/addons/portal/static/src/scss/bootstrap_overridden.scss b/addons/portal/static/src/scss/bootstrap_overridden.scss
index 8f129e7bee4..b1eb608633b 100644
--- a/addons/portal/static/src/scss/bootstrap_overridden.scss
+++ b/addons/portal/static/src/scss/bootstrap_overridden.scss
@@ -1,23 +1,24 @@
// This variable affects the `.h-*` and `.w-*` classes.
-$sizes: (
+$sizes: () !default;
+$sizes: map-merge((
0: 0,
-);
+), $sizes);
// Body
//
// Settings for the `` element.
-$body-bg: $o-portal-default-body-bg;
+$body-bg: $o-portal-default-body-bg !default;
// Fonts
//
// Font, line-height, and color for body text, headings, and more.
-$font-size-sm: (12 / 16) * 1rem;
+$font-size-sm: (12 / 16) * 1rem !default;
// Buttons
//
// For each of Bootstrap's buttons, define text, background, and border color.
-$btn-padding-y-sm: (1 / 16) * 1rem;
-$btn-padding-x-sm: (5 / 16) * 1rem;
+$btn-padding-y-sm: (1 / 16) * 1rem !default;
+$btn-padding-x-sm: (5 / 16) * 1rem !default;
diff --git a/addons/portal/views/assets.xml b/addons/portal/views/assets.xml
index d83de5c4898..da71821fa9a 100644
--- a/addons/portal/views/assets.xml
+++ b/addons/portal/views/assets.xml
@@ -5,13 +5,13 @@
-
-
+
+
-
+
diff --git a/addons/theme_bootswatch/views/theme_bootswatch_templates.xml b/addons/theme_bootswatch/views/theme_bootswatch_templates.xml
index 44e061ea406..d59134c4a9c 100644
--- a/addons/theme_bootswatch/views/theme_bootswatch_templates.xml
+++ b/addons/theme_bootswatch/views/theme_bootswatch_templates.xml
@@ -1,7 +1,7 @@
-
+
@@ -25,8 +25,8 @@
-
-
+
+
@@ -37,8 +37,8 @@
-
-
+
+
@@ -49,8 +49,8 @@
-
-
+
+
@@ -61,8 +61,8 @@
-
-
+
+
@@ -73,8 +73,8 @@
-
-
+
+
@@ -85,8 +85,8 @@
-
-
+
+
@@ -97,8 +97,8 @@
-
-
+
+
@@ -109,8 +109,8 @@
-
-
+
+
@@ -121,8 +121,8 @@
-
-
+
+
diff --git a/addons/web/static/src/scss/bootstrap_overridden.scss b/addons/web/static/src/scss/bootstrap_overridden.scss
index 09dd5ddbfd4..edff888acbf 100644
--- a/addons/web/static/src/scss/bootstrap_overridden.scss
+++ b/addons/web/static/src/scss/bootstrap_overridden.scss
@@ -20,21 +20,21 @@ $gray-800: #343a40 !default;
$gray-900: #212529 !default;
$black: #000 !default;
-$primary: $o-brand-primary;
-$secondary: $white;
+$primary: $o-brand-primary !default;
+$secondary: $white !default;
// Body
//
// Settings for the `` element.
-$body-bg: $o-brand-secondary;
-$body-color: $o-main-text-color;
+$body-bg: $o-brand-secondary !default;
+$body-color: $o-main-text-color !default;
// Links
//
// Style anchor elements.
-$link-hover-decoration: none;
+$link-hover-decoration: none !default;
// Muted
//
@@ -46,53 +46,53 @@ $text-muted: $gray-500 !default;
//
// Set the number of columns and specify the width of the gutters.
-$grid-gutter-width: $o-horizontal-padding * 2;
+$grid-gutter-width: $o-horizontal-padding * 2 !default;
// Components
//
// Define common padding and border radius sizes and more.
-$border-radius: 3px;
+$border-radius: 3px !default;
-$component-active-color: $o-brand-primary;
-$component-active-bg: $gray-200;
+$component-active-color: $o-brand-primary !default;
+$component-active-bg: $gray-200 !default;
// Fonts
//
// Font, line-height, and color for body text, headings, and more.
-$font-family-sans-serif: "Lucida Grande", Helvetica, Verdana, Arial, sans-serif;
+$font-family-sans-serif: "Lucida Grande", Helvetica, Verdana, Arial, sans-serif !default;
-$font-size-base: $o-font-size-base;
-$line-height-base: $o-line-height-base;
+$font-size-base: $o-font-size-base !default;
+$line-height-base: $o-line-height-base !default;
-$h1-font-size: $o-font-size-base * 2.0;
-$h2-font-size: $o-font-size-base * 1.5;
-$h3-font-size: $o-font-size-base * 1.3;
-$h4-font-size: $o-font-size-base * 1.2;
-$h5-font-size: $o-font-size-base * 1.1;
+$h1-font-size: $o-font-size-base * 2.0 !default;
+$h2-font-size: $o-font-size-base * 1.5 !default;
+$h3-font-size: $o-font-size-base * 1.3 !default;
+$h4-font-size: $o-font-size-base * 1.2 !default;
+$h5-font-size: $o-font-size-base * 1.1 !default;
-$headings-font-weight: bold;
+$headings-font-weight: bold !default;
// Tables
//
// Customizes the `.table` component with basic values, each used across all table variations.
-$table-accent-bg: rgba($black, .01);
-$table-hover-bg: rgba($black, .04);
+$table-accent-bg: rgba($black, .01) !default;
+$table-hover-bg: rgba($black, .04) !default;
// Dropdowns
//
// Dropdown menu container and contents.
-$dropdown-border-color: $gray-300;
+$dropdown-border-color: $gray-300 !default;
-$dropdown-link-color: $o-main-text-color;
-$dropdown-link-hover-color: $gray-900;
-$dropdown-link-hover-bg: $gray-200;
+$dropdown-link-color: $o-main-text-color !default;
+$dropdown-link-hover-color: $gray-900 !default;
+$dropdown-link-hover-bg: $gray-200 !default;
-$dropdown-link-active-color: $gray-900;
-$dropdown-link-active-bg: $gray-300;
+$dropdown-link-active-color: $gray-900 !default;
+$dropdown-link-active-bg: $gray-300 !default;
// Z-index master list
@@ -111,39 +111,29 @@ $dropdown-link-active-bg: $gray-300;
// Navs
-$nav-tabs-link-active-bg: $white;
+$nav-tabs-link-active-bg: $white !default;
-$nav-pills-border-radius: 0;
-$nav-pills-link-active-color: $white;
-$nav-pills-link-active-bg: $o-brand-primary;
-
-// Navbar
-
-// FIXME $navbar-height ? $navbar-margin-bottom ? $navbar-inverse-* ? $navbar-border-radius ?
+$nav-pills-border-radius: 0 !default;
+$nav-pills-link-active-color: $white !default;
+$nav-pills-link-active-bg: $o-brand-primary !default;
// Badges
-// FIXME $badge-bg, $badge-color, $badge-line-height ?
-$badge-font-weight: normal;
+$badge-font-weight: normal !default;
// Modals
// Padding applied to the modal body
-$modal-inner-padding: $o-horizontal-padding;
+$modal-inner-padding: $o-horizontal-padding !default;
-// FIXME $modal-title-padding ?
-
-$modal-lg: 980px;
-$modal-md: 650px;
+$modal-lg: 980px !default;
+$modal-md: 650px !default;
// Breadcrumbs
-$breadcrumb-padding-y: 0;
-$breadcrumb-padding-x: 0;
-$breadcrumb-margin-bottom: 0;
+$breadcrumb-padding-y: 0 !default;
+$breadcrumb-padding-x: 0 !default;
+$breadcrumb-margin-bottom: 0 !default;
-$breadcrumb-bg: $o-control-panel-background-color;
-// FIXME $breadcrumb-color ?
-$breadcrumb-active-color: #777777;
-
-// FIXME $icon-font-path ?
+$breadcrumb-bg: $o-control-panel-background-color !default;
+$breadcrumb-active-color: #777777 !default;
diff --git a/addons/web/static/src/scss/bootstrap_overridden_frontend.scss b/addons/web/static/src/scss/bootstrap_overridden_frontend.scss
index f803cf3e72d..b36ccc0ae24 100644
--- a/addons/web/static/src/scss/bootstrap_overridden_frontend.scss
+++ b/addons/web/static/src/scss/bootstrap_overridden_frontend.scss
@@ -2,4 +2,4 @@
//
// Font, line-height, and color for body text, headings, and more.
-$font-size-base: $o-theme-font-size-base;
+$font-size-base: $o-theme-font-size-base !default;
diff --git a/addons/web/static/src/scss/secondary_variables.scss b/addons/web/static/src/scss/secondary_variables.scss
index c612c17dcb1..5b9d6ab239d 100644
--- a/addons/web/static/src/scss/secondary_variables.scss
+++ b/addons/web/static/src/scss/secondary_variables.scss
@@ -1,34 +1,34 @@
-$o-webclient-background-color: desaturate($o-gray-100, 100%);
-$o-control-panel-background-color: $o-view-background-color;
+$o-webclient-background-color: desaturate($o-gray-100, 100%) !default;
+$o-control-panel-background-color: $o-view-background-color !default;
-$o-list-footer-color: $o-main-text-color;
-$o-list-group-header-color: lighten($o-brand-lightsecondary, 10%);
+$o-list-footer-color: $o-main-text-color !default;
+$o-list-group-header-color: lighten($o-brand-lightsecondary, 10%) !default;
// UI custom colors for tags, kanban records' colors, ...)
// Note: the first value is the old BS3 gray-light value
$o-colors: lighten(#000, 46.7%), #F06050, #F4A460, #F7CD1F, #6CC1ED, #814968,
- #EB7E7F, #2C8397, #475577, #D6145F, #30C381, #9365B8;
+ #EB7E7F, #2C8397, #475577, #D6145F, #30C381, #9365B8 !default;
-$o-sheet-cancel-hpadding: $o-horizontal-padding;
-$o-sheet-cancel-bpadding: $o-horizontal-padding;
+$o-sheet-cancel-hpadding: $o-horizontal-padding !default;
+$o-sheet-cancel-bpadding: $o-horizontal-padding !default;
-$o-statusbar-arrow-width: $o-statusbar-height / 3;
-$o-statusbar-disabled-bg: lighten($o-brand-lightsecondary, 7%);
+$o-statusbar-arrow-width: $o-statusbar-height / 3 !default;
+$o-statusbar-disabled-bg: lighten($o-brand-lightsecondary, 7%) !default;
-$o-navbar-inverse-link-hover-bg: darken($o-brand-odoo, 10%);
+$o-navbar-inverse-link-hover-bg: darken($o-brand-odoo, 10%) !default;
-$o-datepicker-week-bg-color: lighten($o-datepicker-week-color, 30%);
+$o-datepicker-week-bg-color: lighten($o-datepicker-week-color, 30%) !default;
// Kanban
-$o-kanban-record-margin: $o-horizontal-padding / 2;
-$o-kanban-group-padding: $o-horizontal-padding; // Cannot be higher than this
+$o-kanban-record-margin: $o-horizontal-padding / 2 !default;
+$o-kanban-group-padding: $o-horizontal-padding !default; // Cannot be higher than this
-$o-kanban-inside-hgutter-mobile: $o-horizontal-padding;
+$o-kanban-inside-hgutter-mobile: $o-horizontal-padding !default;
// ------- Kanban dashboard variables -------
// Since rows and containers are used inside cards, we're
// forced to set the padding relative to the grid system.
-$o-kanban-dashboard-hpadding: $o-horizontal-padding;
-$o-kanban-dashboard-vpadding: $o-horizontal-padding / 2;
+$o-kanban-dashboard-hpadding: $o-horizontal-padding !default;
+$o-kanban-dashboard-vpadding: $o-horizontal-padding / 2 !default;
diff --git a/addons/web_editor/static/src/scss/bootstrap_overridden.scss b/addons/web_editor/static/src/scss/bootstrap_overridden.scss
index 5c64d275d56..0bfc53c5091 100644
--- a/addons/web_editor/static/src/scss/bootstrap_overridden.scss
+++ b/addons/web_editor/static/src/scss/bootstrap_overridden.scss
@@ -2,29 +2,14 @@
$-is-backend: variable-exists('primary');
// Use auto threshold for yiq colors
-$yiq-contrasted-threshold: false;
+$yiq-contrasted-threshold: false !default;
// Automatically update bootstrap colors map (unused by BS itself)
-$-palette: nth($o-color-palettes, $o-color-palette-number);
$colors: () !default;
-$colors: map-merge($-palette, $colors);
+$colors: map-merge($o-color-palette, $colors);
// Automatically extend bootstrap to create theme background/text/button classes
-$-palette: nth($o-theme-color-palettes, $o-theme-color-palette-number);
-$-main-color: map-get($-palette, 'alpha');
-$-main-color-lightness: lightness($-main-color);
-$-palette: map-merge((
- // alpha and beta colors are used to override primary and secondary BS4
- // colors by default, so that theme colors affect the default Odoo layouts
- 'primary': $-main-color,
- 'secondary': map-get($-palette, 'beta'),
-
- // BS light and dark colors are not used for any BS component, just
- // for color utilities. By default, we set them to a very light and
- // very dark version of a desaturate version of the main color
- 'light': lighten(desaturate($-main-color, 80%), min(70%, max(0%, 97% - $-main-color-lightness))), // Does not increase over 97% lightness
- 'dark': darken(desaturate($-main-color, 80%), min(70%, max(0%, $-main-color-lightness - 10%))), // Does not lower under 10% lightness
-), o-map-omit($-palette));
+$-palette: $o-theme-color-palette;
@if $-is-backend {
$-palette: map-remove($-palette, 'primary', 'secondary', 'success', 'info', 'warning', 'danger', 'light', 'dark');
}
@@ -34,8 +19,7 @@ $theme-colors: map-merge($-palette, $theme-colors);
// Extend grays with transparent ones (for some reason, BS4 create black-50 and
// white-50 but does not allow overridding that with variables), also use the
// theme gray palette (which is supposed to at least declare white and black).
-$-palette: nth($o-gray-color-palettes, $o-gray-color-palette-number);
-$-palette: map-merge($o-transparent-grays, $-palette);
+$-palette: $o-gray-color-palette;
@if $-is-backend {
$-palette: map-remove($-palette, '100', '200', '300', '400', '500', '600', '700', '800', '900');
}
diff --git a/addons/web_editor/static/src/scss/secondary_variables.scss b/addons/web_editor/static/src/scss/secondary_variables.scss
new file mode 100644
index 00000000000..e1e4e62ca66
--- /dev/null
+++ b/addons/web_editor/static/src/scss/secondary_variables.scss
@@ -0,0 +1,37 @@
+
+//------------------------------------------------------------------------------
+// Colors
+//------------------------------------------------------------------------------
+
+// Colors
+$o-color-palette: nth($o-color-palettes, $o-color-palette-number) !default;
+@function palette-color($key) {
+ @return map-get($o-color-palette, $key);
+}
+
+// Theme colors
+$o-theme-color-palette: nth($o-theme-color-palettes, $o-theme-color-palette-number) !default;
+$-main-color: map-get($o-theme-color-palette, 'alpha');
+$-main-color-lightness: lightness($-main-color);
+$o-theme-color-palette: map-merge((
+ // alpha and beta colors are used to override primary and secondary BS4
+ // colors by default, so that theme colors affect the default Odoo layouts
+ 'primary': $-main-color,
+ 'secondary': map-get($o-theme-color-palette, 'beta'),
+
+ // BS light and dark colors are not used for any BS component, just
+ // for color utilities. By default, we set them to a very light and
+ // very dark version of a desaturate version of the main color
+ 'light': lighten(desaturate($-main-color, 80%), min(70%, max(0%, 97% - $-main-color-lightness))), // Does not increase over 97% lightness
+ 'dark': darken(desaturate($-main-color, 80%), min(70%, max(0%, $-main-color-lightness - 10%))), // Does not lower under 10% lightness
+), o-map-omit($o-theme-color-palette));
+@function palette-theme-color($key) {
+ @return map-get($o-theme-color-palette, $key);
+}
+
+// Gray colors
+$o-gray-color-palette: nth($o-gray-color-palettes, $o-gray-color-palette-number) !default;
+$o-gray-color-palette: map-merge($o-transparent-grays, $o-gray-color-palette);
+@function palette-gray($key) {
+ @return map-get($o-gray-color-palette, $key);
+}
diff --git a/addons/web_editor/views/editor.xml b/addons/web_editor/views/editor.xml
index d180831b616..ac8b3c396f3 100644
--- a/addons/web_editor/views/editor.xml
+++ b/addons/web_editor/views/editor.xml
@@ -58,6 +58,12 @@
+
+
+
+
+
+
@@ -67,7 +73,7 @@
-
+
@@ -83,7 +89,7 @@
-
+
diff --git a/addons/website/static/src/scss/bootstrap_overridden.scss b/addons/website/static/src/scss/bootstrap_overridden.scss
index 8c21c748fe1..fbf776ae283 100644
--- a/addons/website/static/src/scss/bootstrap_overridden.scss
+++ b/addons/website/static/src/scss/bootstrap_overridden.scss
@@ -7,27 +7,25 @@
// depending on its contrast. Themes should be careful if they decide to
// override those values. This would be simplified by giving the user the choice
// for its dark *and* light text colors.
-$-light: if($white != null, $white, #FFFFFF);
-$-dark: if($gray-900 != null, $gray-900, #212529);
-$-text: if(color('text') != null, color('text'), $-dark);
-$-is-light: (o-get-most-contrast($-text, $-light, $-dark, color('body'), $cross-mix: false) == $-dark);
-$yiq-text-light: if($-is-light, color('text'), null);
-$yiq-text-dark: if($-is-light, null, color('text'));
+$-light: if(palette-gray('white') != null, palette-gray('white'), #FFFFFF);
+$-dark: if(palette-gray('900') != null, palette-gray('900'), #212529);
+$-text: if(palette-color('text') != null, palette-color('text'), $-dark);
+$-is-light: (o-get-most-contrast($-text, $-light, $-dark, palette-color('body'), $cross-mix: false) == $-dark);
+$yiq-text-light: if($-is-light, palette-color('text'), null) !default;
+$yiq-text-dark: if($-is-light, null, palette-color('text')) !default;
// Body
//
// Settings for the `` element.
-@if color('body') { // Do not default to bootstrap but to the portal value
- $body-bg: color('body');
-}
-$body-color: color('text');
+$body-bg: palette-color('body') !default;
+$body-color: palette-color('text') !default;
// Fonts
//
// Font, line-height, and color for body text, headings, and more.
-$font-family-sans-serif: nth($o-theme-fonts, $o-theme-font-number);
+$font-family-sans-serif: nth($o-theme-fonts, $o-theme-font-number) !default;
-$headings-font-family: nth($o-theme-fonts, $o-theme-headings-font-number);
-$headings-color: color('h1');
+$headings-font-family: nth($o-theme-fonts, $o-theme-headings-font-number) !default;
+$headings-color: palette-color('h1') !default;
diff --git a/addons/website/views/website_templates.xml b/addons/website/views/website_templates.xml
index ad5e297a3a2..2228d742c46 100644
--- a/addons/website/views/website_templates.xml
+++ b/addons/website/views/website_templates.xml
@@ -1,15 +1,15 @@
-
+
-
-
+
+
@@ -31,13 +31,13 @@
-
-
+
+
-
+