summaryrefslogtreecommitdiff
path: root/addons/web_editor/static/src
diff options
context:
space:
mode:
Diffstat (limited to 'addons/web_editor/static/src')
-rw-r--r--addons/web_editor/static/src/scss/web_editor.common.bootstrap.scss28
-rw-r--r--addons/web_editor/static/src/scss/web_editor.common.scss42
-rw-r--r--addons/web_editor/static/src/scss/web_editor.variables.scss18
3 files changed, 33 insertions, 55 deletions
diff --git a/addons/web_editor/static/src/scss/web_editor.common.bootstrap.scss b/addons/web_editor/static/src/scss/web_editor.common.bootstrap.scss
new file mode 100644
index 00000000000..b7ad30b1bc4
--- /dev/null
+++ b/addons/web_editor/static/src/scss/web_editor.common.bootstrap.scss
@@ -0,0 +1,28 @@
+
+// Automatically extend bootstrap to create theme background/text/button classes
+$theme-colors: () !default;
+$theme-colors: map-merge((
+ 'alpha': $color-alpha,
+ 'beta': $color-beta,
+ 'gamma': $color-gamma,
+ 'delta': $color-delta,
+ 'epsilon': $color-epsilon,
+), $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 add black
+// and white ones too as they were also not added by BS4...
+$grays: () !default;
+$grays: map-merge((
+ 'black-25': $color-black-25,
+ 'black-50': $color-black-50,
+ 'black-75': $color-black-75,
+ 'white-25': $color-white-25,
+ 'white-50': $color-white-50,
+ 'white-75': $color-white-75,
+
+ // Note: those two needs to be redefined before bootstrap, otherwise they
+ // do not exist yet
+ 'black': $black,
+ 'white': $white,
+), $grays);
diff --git a/addons/web_editor/static/src/scss/web_editor.common.scss b/addons/web_editor/static/src/scss/web_editor.common.scss
index 31ae70b766c..11fa94cd010 100644
--- a/addons/web_editor/static/src/scss/web_editor.common.scss
+++ b/addons/web_editor/static/src/scss/web_editor.common.scss
@@ -229,40 +229,8 @@ a.o_underline {
}
}
-// Create classes for theme colors...
-@include o-create-color-classes(alpha, $color-alpha);
-@include o-create-color-classes(beta, $color-beta);
-@include o-create-color-classes(gamma, $color-gamma);
-@include o-create-color-classes(delta, $color-delta);
-@include o-create-color-classes(epsilon, $color-epsilon);
-
-// ... and button classes
-@include o-create-color-btn-classes(alpha, $color-alpha);
-@include o-create-color-btn-classes(beta, $color-beta);
-@include o-create-color-btn-classes(gamma, $color-gamma);
-@include o-create-color-btn-classes(delta, $color-delta);
-@include o-create-color-btn-classes(epsilon, $color-epsilon);
-
-// Create classes for UI colors // FIXME
-@include o-create-color-classes(primary, theme-color('primary'));
-// @include o-create-color-classes(success, $state-success-bg, $content-color: $state-success-text);
-// @include o-create-color-classes(info, $state-info-bg, $content-color: $state-info-text);
-// @include o-create-color-classes(warning, $state-warning-bg, $content-color: $state-warning-text);
-// @include o-create-color-classes(danger, $state-danger-bg, $content-color: $state-danger-text);
-
-// Create classes for greyscale colors
-@include o-create-color-classes('black', $black);
-@include o-create-color-classes('gray-darker', gray('900')); // FIXME
-@include o-create-color-classes('gray-dark', gray('900'));
-@include o-create-color-classes('gray', gray('700'));
-@include o-create-color-classes('gray-light', gray('600'));
-@include o-create-color-classes('gray-lighter', gray('200'));
-@include o-create-color-classes('white', $white);
-
-// Create classes for greyscale transparent colours
-@include o-create-color-classes('black-25', $color-black-25);
-@include o-create-color-classes('black-50', $color-black-50);
-@include o-create-color-classes('black-75', $color-black-75);
-@include o-create-color-classes('white-25', $color-white-25);
-@include o-create-color-classes('white-50', $color-white-50);
-@include o-create-color-classes('white-75', $color-white-75);
+// Extend bootstrap to create background and text utilities for gray colors too
+@each $color, $value in $grays {
+ @include bg-variant(".bg-#{$color}", $value);
+ @include text-emphasis-variant(".text-#{$color}", $value);
+}
diff --git a/addons/web_editor/static/src/scss/web_editor.variables.scss b/addons/web_editor/static/src/scss/web_editor.variables.scss
index 552e4dfe262..203b27fc886 100644
--- a/addons/web_editor/static/src/scss/web_editor.variables.scss
+++ b/addons/web_editor/static/src/scss/web_editor.variables.scss
@@ -234,24 +234,6 @@ $color-white-25: rgba(white, 0.25) !default;
$color-white-50: rgba(white, 0.5) !default;
$color-white-75: rgba(white, 0.75) !default;
-@mixin o-create-color-classes($name, $color, $complementary: o-get-most-contrast($color, $body-color, #FFF), $content-color: $color) {
- .bg-#{$name} {
- background-color: $color;
- color: $complementary;
- .text-muted {
- color: rgba($complementary, 0.4);
- }
- }
- body .text-#{$name} { // body to make the rules more important that bg-* ones
- color: $content-color;
- }
-}
-@mixin o-create-color-btn-classes($name, $color, $complementary: o-get-most-contrast($color, $body-color, #FFF), $border-color: darken($color, 5%)) {
- .btn-#{$name} {
- @include button-variant($complementary, $color, $border-color);
- }
-}
-
// Translations
$o-we-content-to-translate-color: rgb(255, 255, 90) !default;
$o-we-translated-content-color: rgb(120, 215, 110) !default;