From 0ca6d3977708c7f0203f042386115f24bcacf0aa Mon Sep 17 00:00:00 2001 From: qsm-odoo Date: Wed, 14 Mar 2018 15:54:12 +0100 Subject: [REF] *: BS4, adapt media queries MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit media queries that target a specific screen size handled by bootstrap have now a more convenient way to be defined: ``` @​media (min-width: $screen-sm-min) { ... } -> @​include media-breakpoint-up(sm) { ... } ``` ``` @​media (max-width: $screen-sm-max) { ... } -> @​include media-breakpoint-down(sm) { ... } ``` ``` @​media (min-width: $screen-sm-min) and (max-width: $screen-sm-max) { ... } -> @​include media-breakpoint-only(sm) { ... } ``` ``` @​media (min-width: $screen-sm-min) and (max-width: $screen-md-max) { ... } -> @​include media-breakpoint-between(sm, md) { ... } ``` Also, bootstrap has changed the values for its default screen sizes: ------------------ | BS3 | BS4 | ------------------ 0 | XS | XS | -> Portrait Mobile 576 | / | SM | -> Landscape Mobile 768 | SM | MD | -> Portrait Tablet 992 | MD | LG | -> Landscape Tablet / Small Desktop 1200 | LG | XL | -> Desktop ------------------ While it is possible to configure BS variables to behave as BS3, we took the decision to keep the BS4 variables untouched. BS4 system seems indeed better and having the purest bootstrap possible is better for Odoo to be used as a framework. --- addons/theme_default/static/src/scss/option_layout_boxed.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'addons/theme_default/static/src') diff --git a/addons/theme_default/static/src/scss/option_layout_boxed.scss b/addons/theme_default/static/src/scss/option_layout_boxed.scss index f6a428752bd..eda53e8a6c0 100644 --- a/addons/theme_default/static/src/scss/option_layout_boxed.scss +++ b/addons/theme_default/static/src/scss/option_layout_boxed.scss @@ -1,5 +1,5 @@ #wrapwrap { - @media (min-width: $screen-sm-min){ + @include media-breakpoint-up(md) { width: 85%; margin: 0 auto; } -- cgit v1.2.3 From c59380bac5bbd47bc7dcd92b38049af29a62c3d1 Mon Sep 17 00:00:00 2001 From: qsm-odoo Date: Mon, 16 Jul 2018 16:48:59 +0200 Subject: [REF] *: BS4, rename btn-default to btn-secondary BS4 "btn-default" class was replaced with "btn-secondary", which makes more sense. --- addons/theme_default/static/src/scss/option_color_amethyst.scss | 2 +- addons/theme_default/static/src/scss/option_color_cobalt.scss | 2 +- addons/theme_default/static/src/scss/option_color_emerald.scss | 2 +- addons/theme_default/static/src/scss/option_color_gold.scss | 2 +- addons/theme_default/static/src/scss/option_color_ruby.scss | 2 +- 5 files changed, 5 insertions(+), 5 deletions(-) (limited to 'addons/theme_default/static/src') diff --git a/addons/theme_default/static/src/scss/option_color_amethyst.scss b/addons/theme_default/static/src/scss/option_color_amethyst.scss index a0a7c914930..a5c9dbbac11 100644 --- a/addons/theme_default/static/src/scss/option_color_amethyst.scss +++ b/addons/theme_default/static/src/scss/option_color_amethyst.scss @@ -19,7 +19,7 @@ .btn .fa { color: white;} -.btn-default .fa { +.btn-secondary .fa { color: $gray-dark;} /* TRANSPARENT BG --------------------------------------------------- */ diff --git a/addons/theme_default/static/src/scss/option_color_cobalt.scss b/addons/theme_default/static/src/scss/option_color_cobalt.scss index ed3c6efb5c4..74d4f5cf00e 100644 --- a/addons/theme_default/static/src/scss/option_color_cobalt.scss +++ b/addons/theme_default/static/src/scss/option_color_cobalt.scss @@ -19,7 +19,7 @@ .btn .fa { color: white;} -.btn-default .fa { +.btn-secondary .fa { color: $gray-dark;} /* TRANSPARENT BG --------------------------------------------------- */ diff --git a/addons/theme_default/static/src/scss/option_color_emerald.scss b/addons/theme_default/static/src/scss/option_color_emerald.scss index d936425e1f2..0c9fc0b47db 100644 --- a/addons/theme_default/static/src/scss/option_color_emerald.scss +++ b/addons/theme_default/static/src/scss/option_color_emerald.scss @@ -19,7 +19,7 @@ .btn .fa { color: white;} -.btn-default .fa { +.btn-secondary .fa { color: $gray-dark;} /* TRANSPARENT BG --------------------------------------------------- */ diff --git a/addons/theme_default/static/src/scss/option_color_gold.scss b/addons/theme_default/static/src/scss/option_color_gold.scss index ba6fa843ec5..9f27adff25f 100644 --- a/addons/theme_default/static/src/scss/option_color_gold.scss +++ b/addons/theme_default/static/src/scss/option_color_gold.scss @@ -19,7 +19,7 @@ .btn .fa { color: white;} -.btn-default .fa { +.btn-secondary .fa { color: $gray-dark;} /* TRANSPARENT BG --------------------------------------------------- */ diff --git a/addons/theme_default/static/src/scss/option_color_ruby.scss b/addons/theme_default/static/src/scss/option_color_ruby.scss index e87f7168391..f1883a2e60f 100644 --- a/addons/theme_default/static/src/scss/option_color_ruby.scss +++ b/addons/theme_default/static/src/scss/option_color_ruby.scss @@ -19,7 +19,7 @@ .btn .fa { color: white;} -.btn-default .fa { +.btn-secondary .fa { color: $gray-dark;} /* TRANSPARENT BG --------------------------------------------------- */ -- cgit v1.2.3 From d8c217a67d9f5b371dd43b9cff8f04aa008c27b8 Mon Sep 17 00:00:00 2001 From: qsm-odoo Date: Wed, 25 Apr 2018 11:28:17 +0200 Subject: [REF] *: BS4, review color system Odoo used to declare two main colors: primary and optional (which are purple and turquoise in enterprise). Those were respectively assigned to the 'primary' bootstrap variable and the 'btn-primary' bootstrap variable. BS4, however, does not allow to have a different primary color for buttons. Instead, the 'primary' color is used for all 'primary' related components and utility classes, same as for all other colors. So, if we want to keep our enterprise buttons green, our 'optional' colors had to become our 'primary' color. The old odoo primary is then renamed to the 'odoo' color. The palette of grays is now larger by default and is numbered from 100 to 900 alongside the $black and $white variables. The equivalence for older variables and the way we used them is: $gray-darker -> gray 900 (unused before) $gray-dark -> gray 900 $gray -> gray 700 $gray-light -> gray 600 $gray-lighter-darker -> gray 400 (the old variable was created by us) $gray-lighter-dark -> gray 300 (the old variable was created by us) $gray-lighter -> gray 200 Fortunately, the 'lighter' variations we created fit well in the default BS4 system ! Unfortunately, our $gray-lighter which carried the same function as $gray-200 (see above) is very close to the new default $gray-100 and quite distant from the new $gray-200. This will be handled in the next commit. --- .../static/src/scss/bootstrap_overridden.scss | 12 ++- .../static/src/scss/option_color_amethyst.scss | 104 ++++++++++---------- .../scss/option_color_amethyst_bs_variables.scss | 26 ++--- .../static/src/scss/option_color_cobalt.scss | 106 +++++++++++---------- .../src/scss/option_color_cobalt_bs_variables.scss | 22 +++-- .../static/src/scss/option_color_emerald.scss | 104 ++++++++++---------- .../scss/option_color_emerald_bs_variables.scss | 22 +++-- .../static/src/scss/option_color_gold.scss | 104 ++++++++++---------- .../src/scss/option_color_gold_bs_variables.scss | 22 +++-- .../static/src/scss/option_color_ruby.scss | 104 ++++++++++---------- .../src/scss/option_color_ruby_bs_variables.scss | 26 ++--- 11 files changed, 337 insertions(+), 315 deletions(-) (limited to 'addons/theme_default/static/src') diff --git a/addons/theme_default/static/src/scss/bootstrap_overridden.scss b/addons/theme_default/static/src/scss/bootstrap_overridden.scss index b396442df02..172790fc0b7 100644 --- a/addons/theme_default/static/src/scss/bootstrap_overridden.scss +++ b/addons/theme_default/static/src/scss/bootstrap_overridden.scss @@ -1,5 +1,7 @@ -$gray-darker: lighten(#000, 20%); -$gray-dark: lighten(#000, 40%); -$gray: lighten(#000, 55%); -$gray-light: lighten(#000, 70%); -$gray-lighter: lighten(#000, 80%); + +// TODO review BS4 gray palette for theme default +// $gray-900: lighten(#000, 20%); +// $gray-800: lighten(#000, 40%); +// $gray-700: lighten(#000, 55%); +// $gray-600: lighten(#000, 70%); +// $gray-200: lighten(#000, 80%); diff --git a/addons/theme_default/static/src/scss/option_color_amethyst.scss b/addons/theme_default/static/src/scss/option_color_amethyst.scss index a5c9dbbac11..790d345ece7 100644 --- a/addons/theme_default/static/src/scss/option_color_amethyst.scss +++ b/addons/theme_default/static/src/scss/option_color_amethyst.scss @@ -1,51 +1,53 @@ -/* COLORED BG -------------------------------------------------------- */ - -.bg-primary { - background-color: $color-clouds; -} -.bg-success { - background-color: $color-purple; -} -.bg-info { - background-color: $color-twilight; -} -.bg-warning { - background-color: $color-purple-dark; -} -.bg-danger { - background-color: $color-midnight; -} - -.btn .fa { - color: white;} - -.btn-secondary .fa { - color: $gray-dark;} - -/* TRANSPARENT BG --------------------------------------------------- */ -/* Used in snippets Prx Image Color and Prx Image Shade ------------- */ - -.bg-transparent-color { background: $color-twilight; opacity: 0.85;} -.bg-transparent-shade { background: black; opacity: 0.5;} - -/* Footer ----------------------------------------------------------- */ - -#wrapwrap footer { - background-color: $color-concrete-dark; - color: $gray-light; - } -footer ul li a { - color: $color-clouds; - } -footer ul li a:hover { - color: white; - text-decoration: none; - } -footer h4 { - color: $gray-lighter; - padding-bottom: 12px; - text-transform: uppercase; - } -footer .fa { - color: $color-concrete; - } +// TODO review BS4 custo for theme default + +// /* COLORED BG -------------------------------------------------------- */ + +// .bg-primary { +// background-color: $color-clouds; +// } +// .bg-success { +// background-color: $color-purple; +// } +// .bg-info { +// background-color: $color-twilight; +// } +// .bg-warning { +// background-color: $color-purple-dark; +// } +// .bg-danger { +// background-color: $color-midnight; +// } + +// .btn .fa { +// color: white;} + +// .btn-secondary .fa { +// color: gray('900');} + +// /* TRANSPARENT BG --------------------------------------------------- */ +// Used in snippets Prx Image Color and Prx Image Shade ------------- + +// .bg-transparent-color { background: $color-twilight; opacity: 0.85;} +// .bg-transparent-shade { background: black; opacity: 0.5;} + +// /* Footer ----------------------------------------------------------- */ + +// #wrapwrap footer { +// background-color: $color-concrete-dark; +// color: gray('600'); +// } +// footer ul li a { +// color: $color-clouds; +// } +// footer ul li a:hover { +// color: white; +// text-decoration: none; +// } +// footer h4 { +// color: gray('200'); +// padding-bottom: 12px; +// text-transform: uppercase; +// } +// footer .fa { +// color: $color-concrete; +// } diff --git a/addons/theme_default/static/src/scss/option_color_amethyst_bs_variables.scss b/addons/theme_default/static/src/scss/option_color_amethyst_bs_variables.scss index a50fa8aaf78..5c35da75b02 100644 --- a/addons/theme_default/static/src/scss/option_color_amethyst_bs_variables.scss +++ b/addons/theme_default/static/src/scss/option_color_amethyst_bs_variables.scss @@ -1,17 +1,19 @@ -/* GRAYS --------------------------------------------------------- */ +// TODO review BS4 custo for theme default -$gray-darker: lighten(#000, 30%); +// /* GRAYS --------------------------------------------------------- */ -/* TEXTS & LINKS --------------------------------------------------- */ +// $gray-900: lighten(#000, 30%); -$text-muted: $color-primary; -$link-color: $color-primary; -$link-hover-color: $color-success; +// /* TEXTS & LINKS --------------------------------------------------- */ -/* BUTTONS --------------------------------------------------------- */ +// $text-muted: $color-primary; +// $link-color: $color-primary; +// $link-hover-color: $color-success; -$btn-primary-bg: $color-silver; -$btn-success-bg: $color-concrete; -$btn-info-bg: $color-purple; -$btn-warning-bg: $color-purple-light; -$btn-danger-bg: $color-red; +// /* BUTTONS --------------------------------------------------------- */ + +// $btn-primary-bg: $color-silver; +// $btn-success-bg: $color-concrete; +// $btn-info-bg: $color-purple; +// $btn-warning-bg: $color-purple-light; +// $btn-danger-bg: $color-red; diff --git a/addons/theme_default/static/src/scss/option_color_cobalt.scss b/addons/theme_default/static/src/scss/option_color_cobalt.scss index 74d4f5cf00e..25fda624a32 100644 --- a/addons/theme_default/static/src/scss/option_color_cobalt.scss +++ b/addons/theme_default/static/src/scss/option_color_cobalt.scss @@ -1,52 +1,54 @@ -/* COLORED BG -------------------------------------------------------- */ - -.bg-primary { - background-color: $color-wind; -} -.bg-success { - background-color: $color-silver; -} -.bg-info { - background-color: $color-blue; -} -.bg-warning { - background-color: $color-blue-dark; -} -.bg-danger { - background-color: $color-asphalt; -} - -.btn .fa { - color: white;} - -.btn-secondary .fa { - color: $gray-dark;} - -/* TRANSPARENT BG --------------------------------------------------- */ -/* Used in snippets Prx Image Color and Prx Image Shade ------------- */ - -.bg-transparent-color { background: $color-blue-dark; opacity: 0.9;} -.bg-transparent-shade { background: black; opacity: 0.5;} - -/* Footer ----------------------------------------------------------- */ - -#wrapwrap footer { - background-color: $color-midnight; - color: $gray; -} -footer ul li a { - color: $color-silver; -} - -footer ul li a:hover { - color: $color-clouds; - text-decoration: none; -} -footer h4 { - color: $color-stone; - padding-bottom: 12px; - text-transform: uppercase; -} -footer .fa { - color: $gray-light; -} +// TODO review BS4 custo for theme default + +// /* COLORED BG -------------------------------------------------------- */ + +// .bg-primary { +// background-color: $color-wind; +// } +// .bg-success { +// background-color: $color-silver; +// } +// .bg-info { +// background-color: $color-blue; +// } +// .bg-warning { +// background-color: $color-blue-dark; +// } +// .bg-danger { +// background-color: $color-asphalt; +// } + +// .btn .fa { +// color: white;} + +// .btn-secondary .fa { +// color: gray('900');} + +// /* TRANSPARENT BG --------------------------------------------------- */ +// Used in snippets Prx Image Color and Prx Image Shade ------------- + +// .bg-transparent-color { background: $color-blue-dark; opacity: 0.9;} +// .bg-transparent-shade { background: black; opacity: 0.5;} + +// /* Footer ----------------------------------------------------------- */ + +// #wrapwrap footer { +// background-color: $color-midnight; +// color: gray('700'); +// } +// footer ul li a { +// color: $color-silver; +// } + +// footer ul li a:hover { +// color: $color-clouds; +// text-decoration: none; +// } +// footer h4 { +// color: $color-stone; +// padding-bottom: 12px; +// text-transform: uppercase; +// } +// footer .fa { +// color: gray('600'); +// } diff --git a/addons/theme_default/static/src/scss/option_color_cobalt_bs_variables.scss b/addons/theme_default/static/src/scss/option_color_cobalt_bs_variables.scss index ab87820cddb..a5faaf2411c 100644 --- a/addons/theme_default/static/src/scss/option_color_cobalt_bs_variables.scss +++ b/addons/theme_default/static/src/scss/option_color_cobalt_bs_variables.scss @@ -1,13 +1,15 @@ -/* TEXTS & LINKS --------------------------------------------------- */ +// TODO review BS4 custo for theme default -$text-muted: $color-primary; -$link-color: $color-primary; -$link-hover-color: $color-info; +// /* TEXTS & LINKS --------------------------------------------------- */ -/* BUTTONS --------------------------------------------------------- */ +// $text-muted: $color-primary; +// $link-color: $color-primary; +// $link-hover-color: $color-info; -$btn-primary-bg: $color-blue; -$btn-success-bg: $color-turquoise; -$btn-info-bg: $color-green; -$btn-warning-bg: $color-orange; -$btn-danger-bg: $color-red; +// BUTTONS --------------------------------------------------------- + +// $btn-primary-bg: $color-blue; +// $btn-success-bg: $color-turquoise; +// $btn-info-bg: $color-green; +// $btn-warning-bg: $color-orange; +// $btn-danger-bg: $color-red; diff --git a/addons/theme_default/static/src/scss/option_color_emerald.scss b/addons/theme_default/static/src/scss/option_color_emerald.scss index 0c9fc0b47db..f1dba7d287f 100644 --- a/addons/theme_default/static/src/scss/option_color_emerald.scss +++ b/addons/theme_default/static/src/scss/option_color_emerald.scss @@ -1,51 +1,53 @@ -/* COLORED BG -------------------------------------------------------- */ - -.bg-primary { - background-color: $color-wind; -} -.bg-success { - background-color: $color-silver; -} -.bg-info { - background-color: $color-green-dark; -} -.bg-warning { - background-color: $color-green; -} -.bg-danger { - background-color: $color-forest; -} - -.btn .fa { - color: white;} - -.btn-secondary .fa { - color: $gray-dark;} - -/* TRANSPARENT BG --------------------------------------------------- */ -/* Used in snippets Prx Image Color and Prx Image Shade ------------- */ - -.bg-transparent-color { background: $color-green-dark; opacity: 0.9;} -.bg-transparent-shade { background: black; opacity: 0.5;} - -/* Footer ----------------------------------------------------------- */ - -#wrapwrap footer { - background-color: $color-concrete-dark; - color: $gray; - } -footer ul li a { - color: $color-clouds; - } -footer ul li a:hover { - color: white; - text-decoration: none; - } -footer h4 { - color: $color-silver; - padding-bottom: 12px; - text-transform: uppercase; - } -footer .fa { - color: $color-clouds; - } +// TODO review BS4 custo for theme default + +// /* COLORED BG -------------------------------------------------------- */ + +// .bg-primary { +// background-color: $color-wind; +// } +// .bg-success { +// background-color: $color-silver; +// } +// .bg-info { +// background-color: $color-green-dark; +// } +// .bg-warning { +// background-color: $color-green; +// } +// .bg-danger { +// background-color: $color-forest; +// } + +// .btn .fa { +// color: white;} + +// .btn-secondary .fa { +// color: gray('900');} + +// /* TRANSPARENT BG --------------------------------------------------- */ +// Used in snippets Prx Image Color and Prx Image Shade ------------- + +// .bg-transparent-color { background: $color-green-dark; opacity: 0.9;} +// .bg-transparent-shade { background: black; opacity: 0.5;} + +// /* Footer ----------------------------------------------------------- */ + +// #wrapwrap footer { +// background-color: $color-concrete-dark; +// color: gray('700'); +// } +// footer ul li a { +// color: $color-clouds; +// } +// footer ul li a:hover { +// color: white; +// text-decoration: none; +// } +// footer h4 { +// color: $color-silver; +// padding-bottom: 12px; +// text-transform: uppercase; +// } +// footer .fa { +// color: $color-clouds; +// } diff --git a/addons/theme_default/static/src/scss/option_color_emerald_bs_variables.scss b/addons/theme_default/static/src/scss/option_color_emerald_bs_variables.scss index 9b8dec0f38e..4ff78669b81 100644 --- a/addons/theme_default/static/src/scss/option_color_emerald_bs_variables.scss +++ b/addons/theme_default/static/src/scss/option_color_emerald_bs_variables.scss @@ -1,13 +1,15 @@ -/* TEXTS & LINKS --------------------------------------------------- */ +// TODO review BS4 custo for theme default -$text-muted: $color-success; -$link-color: $color-success; -$link-hover-color: $color-primary; +// /* TEXTS & LINKS --------------------------------------------------- */ -/* BUTTONS --------------------------------------------------------- */ +// $text-muted: $color-success; +// $link-color: $color-success; +// $link-hover-color: $color-primary; -$btn-primary-bg: $color-green; -$btn-success-bg: $color-turquoise; -$btn-info-bg: $color-blue; -$btn-warning-bg: $color-orange; -$btn-danger-bg: $color-red; +// BUTTONS --------------------------------------------------------- + +// $btn-primary-bg: $color-green; +// $btn-success-bg: $color-turquoise; +// $btn-info-bg: $color-blue; +// $btn-warning-bg: $color-orange; +// $btn-danger-bg: $color-red; diff --git a/addons/theme_default/static/src/scss/option_color_gold.scss b/addons/theme_default/static/src/scss/option_color_gold.scss index 9f27adff25f..ee3b64c3de5 100644 --- a/addons/theme_default/static/src/scss/option_color_gold.scss +++ b/addons/theme_default/static/src/scss/option_color_gold.scss @@ -1,51 +1,53 @@ -/* COLORED BG -------------------------------------------------------- */ - -.bg-primary { - background-color: $color-sand; -} -.bg-success { - background-color: $color-yellow; -} -.bg-info { - background-color: $color-orange; -} -.bg-warning { - background-color: $color-yellow-dark; -} -.bg-danger { - background-color: $color-orange-dark; -} - -.btn .fa { - color: white;} - -.btn-secondary .fa { - color: $gray-dark;} - -/* TRANSPARENT BG --------------------------------------------------- */ -/* Used in snippets Prx Image Color and Prx Image Shade ------------- */ - -.bg-transparent-color { background: $color-orange-dark; opacity: 0.85;} -.bg-transparent-shade { background: black; opacity: 0.5;} - -/* Footer ----------------------------------------------------------- */ - -#wrapwrap footer { - background-color: $color-orange-dark; - color: white; - } -footer ul li a { - color: $color-beach; - } -footer ul li a:hover { - color: $color-yellow; - text-decoration: none; - } -footer h4 { - color: $color-beach; - padding-bottom: 12px; - text-transform: uppercase; - } -footer .fa { - color: $color-beach; - } +// TODO review BS4 custo for theme default + +// /* COLORED BG -------------------------------------------------------- */ + +// .bg-primary { +// background-color: $color-sand; +// } +// .bg-success { +// background-color: $color-yellow; +// } +// .bg-info { +// background-color: $color-orange; +// } +// .bg-warning { +// background-color: $color-yellow-dark; +// } +// .bg-danger { +// background-color: $color-orange-dark; +// } + +// .btn .fa { +// color: white;} + +// .btn-secondary .fa { +// color: gray('900');} + +// /* TRANSPARENT BG --------------------------------------------------- */ +// Used in snippets Prx Image Color and Prx Image Shade ------------- + +// .bg-transparent-color { background: $color-orange-dark; opacity: 0.85;} +// .bg-transparent-shade { background: black; opacity: 0.5;} + +// /* Footer ----------------------------------------------------------- */ + +// #wrapwrap footer { +// background-color: $color-orange-dark; +// color: white; +// } +// footer ul li a { +// color: $color-beach; +// } +// footer ul li a:hover { +// color: $color-yellow; +// text-decoration: none; +// } +// footer h4 { +// color: $color-beach; +// padding-bottom: 12px; +// text-transform: uppercase; +// } +// footer .fa { +// color: $color-beach; +// } diff --git a/addons/theme_default/static/src/scss/option_color_gold_bs_variables.scss b/addons/theme_default/static/src/scss/option_color_gold_bs_variables.scss index eb10f308be8..21a94e8ffe1 100644 --- a/addons/theme_default/static/src/scss/option_color_gold_bs_variables.scss +++ b/addons/theme_default/static/src/scss/option_color_gold_bs_variables.scss @@ -1,13 +1,15 @@ -/* TEXTS & LINKS ------------------------------------------------------- */ +// TODO review BS4 custo for theme default -$text-muted: $gray; -$link-color: $color-info; -$link-hover-color: $color-primary; +// /* TEXTS & LINKS ------------------------------------------------------- */ -/* BUTTONS --------------------------------------------------------- */ +// $text-muted: gray('700'); +// $link-color: $color-info; +// $link-hover-color: $color-primary; -$btn-primary-bg: $color-yellow; -$btn-success-bg: $color-orange; -$btn-info-bg: $color-yellow-dark; -$btn-warning-bg: $color-orange-dark; -$btn-danger-bg: $color-red-dark; +// /* BUTTONS --------------------------------------------------------- */ + +// $btn-primary-bg: $color-yellow; +// $btn-success-bg: $color-orange; +// $btn-info-bg: $color-yellow-dark; +// $btn-warning-bg: $color-orange-dark; +// $btn-danger-bg: $color-red-dark; diff --git a/addons/theme_default/static/src/scss/option_color_ruby.scss b/addons/theme_default/static/src/scss/option_color_ruby.scss index f1883a2e60f..d652a80518e 100644 --- a/addons/theme_default/static/src/scss/option_color_ruby.scss +++ b/addons/theme_default/static/src/scss/option_color_ruby.scss @@ -1,51 +1,53 @@ -/* COLORED BG -------------------------------------------------------- */ - -.bg-primary { - background-color: $color-sand; -} -.bg-success { - background-color: $color-red; -} -.bg-info { - background-color: $color-red-dark; -} -.bg-warning { - background-color: $color-orange; -} -.bg-danger { - background-color: $color-orange-dark; -} - -.btn .fa { - color: white;} - -.btn-secondary .fa { - color: $gray-dark;} - -/* TRANSPARENT BG --------------------------------------------------- */ -/* Used in snippets Prx Image Color and Prx Image Shade ------------- */ - -.bg-transparent-color { background: $color-red-dark; opacity: 0.85;} -.bg-transparent-shade { background: black; opacity: 0.5;} - -/* Footer ----------------------------------------------------------- */ - -#wrapwrap footer { - background-color: $color-burgundy; - color: $gray-lighter; - } -footer ul li a { - color: white; - } -footer ul li a:hover { - color: $color-orange; - text-decoration: none; - } -footer h4 { - color: $color-sand; - padding-bottom: 12px; - text-transform: uppercase; - } -footer .fa { - color: $color-red; - } +// TODO review BS4 custo for theme default + +// /* COLORED BG -------------------------------------------------------- */ + +// .bg-primary { +// background-color: $color-sand; +// } +// .bg-success { +// background-color: $color-red; +// } +// .bg-info { +// background-color: $color-red-dark; +// } +// .bg-warning { +// background-color: $color-orange; +// } +// .bg-danger { +// background-color: $color-orange-dark; +// } + +// .btn .fa { +// color: white;} + +// .btn-secondary .fa { +// color: gray('900');} + +// /* TRANSPARENT BG --------------------------------------------------- */ +// Used in snippets Prx Image Color and Prx Image Shade ------------- + +// .bg-transparent-color { background: $color-red-dark; opacity: 0.85;} +// .bg-transparent-shade { background: black; opacity: 0.5;} + +// /* Footer ----------------------------------------------------------- */ + +// #wrapwrap footer { +// background-color: $color-burgundy; +// color: gray('200'); +// } +// footer ul li a { +// color: white; +// } +// footer ul li a:hover { +// color: $color-orange; +// text-decoration: none; +// } +// footer h4 { +// color: $color-sand; +// padding-bottom: 12px; +// text-transform: uppercase; +// } +// footer .fa { +// color: $color-red; +// } diff --git a/addons/theme_default/static/src/scss/option_color_ruby_bs_variables.scss b/addons/theme_default/static/src/scss/option_color_ruby_bs_variables.scss index 7fd168c8bd7..174bedbb4ec 100644 --- a/addons/theme_default/static/src/scss/option_color_ruby_bs_variables.scss +++ b/addons/theme_default/static/src/scss/option_color_ruby_bs_variables.scss @@ -1,17 +1,19 @@ -/* GRAYS --------------------------------------------------------- */ +// TODO review BS4 custo for theme default -$gray: lighten(#000, 50%); +// /* GRAYS --------------------------------------------------------- */ -/* TEXT & LINKS -------------------------------------------------------- */ +// $gray-700: lighten(#000, 50%); -$text-muted: $gray; -$link-color: $color-primary; -$link-hover-color: $color-success; +// /* TEXT & LINKS -------------------------------------------------------- */ -/* BUTTONS --------------------------------------------------------- */ +// $text-muted: gray('700'); +// $link-color: $color-primary; +// $link-hover-color: $color-success; -$btn-primary-bg: $color-red; -$btn-success-bg: $color-orange; -$btn-info-bg: $color-yellow-dark; -$btn-warning-bg: $color-orange-dark; -$btn-danger-bg: $color-red-dark; +// BUTTONS --------------------------------------------------------- + +// $btn-primary-bg: $color-red; +// $btn-success-bg: $color-orange; +// $btn-info-bg: $color-yellow-dark; +// $btn-warning-bg: $color-orange-dark; +// $btn-danger-bg: $color-red-dark; -- cgit v1.2.3