From 67cace90a9138975a4e1f565ce47d718afcc673f Mon Sep 17 00:00:00 2001 From: qsm-odoo Date: Tue, 13 Mar 2018 10:25:01 +0100 Subject: [PATCH] [REF] theme_default: adapt the scss convertion for everything to work --- .../static/src/scss/bootstrap_overridden.scss | 5 + .../theme_default/static/src/scss/colors.scss | 78 +-------- .../src/scss/option_color_amethyst.scss | 44 ++--- .../option_color_amethyst_bs_variables.scss | 17 ++ .../scss/option_color_amethyst_variables.scss | 7 + .../static/src/scss/option_color_cobalt.scss | 24 +-- .../option_color_cobalt_bs_variables.scss | 13 ++ .../scss/option_color_cobalt_variables.scss | 7 + .../static/src/scss/option_color_emerald.scss | 38 +---- .../option_color_emerald_bs_variables.scss | 13 ++ .../scss/option_color_emerald_variables.scss | 7 + .../static/src/scss/option_color_gold.scss | 38 +---- .../scss/option_color_gold_bs_variables.scss | 13 ++ .../src/scss/option_color_gold_variables.scss | 7 + .../static/src/scss/option_color_ruby.scss | 41 +---- .../scss/option_color_ruby_bs_variables.scss | 17 ++ .../src/scss/option_color_ruby_variables.scss | 7 + .../static/src/scss/option_color_stone.scss | 76 --------- .../static/src/scss/primary_variables.scss | 47 ++++++ .../views/theme_default_templates.xml | 152 +++++++++++------- 20 files changed, 289 insertions(+), 362 deletions(-) create mode 100644 addons/theme_default/static/src/scss/bootstrap_overridden.scss create mode 100644 addons/theme_default/static/src/scss/option_color_amethyst_bs_variables.scss create mode 100644 addons/theme_default/static/src/scss/option_color_amethyst_variables.scss create mode 100644 addons/theme_default/static/src/scss/option_color_cobalt_bs_variables.scss create mode 100644 addons/theme_default/static/src/scss/option_color_cobalt_variables.scss create mode 100644 addons/theme_default/static/src/scss/option_color_emerald_bs_variables.scss create mode 100644 addons/theme_default/static/src/scss/option_color_emerald_variables.scss create mode 100644 addons/theme_default/static/src/scss/option_color_gold_bs_variables.scss create mode 100644 addons/theme_default/static/src/scss/option_color_gold_variables.scss create mode 100644 addons/theme_default/static/src/scss/option_color_ruby_bs_variables.scss create mode 100644 addons/theme_default/static/src/scss/option_color_ruby_variables.scss delete mode 100644 addons/theme_default/static/src/scss/option_color_stone.scss create mode 100644 addons/theme_default/static/src/scss/primary_variables.scss diff --git a/addons/theme_default/static/src/scss/bootstrap_overridden.scss b/addons/theme_default/static/src/scss/bootstrap_overridden.scss new file mode 100644 index 00000000000..b396442df02 --- /dev/null +++ b/addons/theme_default/static/src/scss/bootstrap_overridden.scss @@ -0,0 +1,5 @@ +$gray-darker: lighten(#000, 20%); +$gray-dark: lighten(#000, 40%); +$gray: lighten(#000, 55%); +$gray-light: lighten(#000, 70%); +$gray-lighter: lighten(#000, 80%); diff --git a/addons/theme_default/static/src/scss/colors.scss b/addons/theme_default/static/src/scss/colors.scss index e893f5de84e..5e58c0f4c73 100644 --- a/addons/theme_default/static/src/scss/colors.scss +++ b/addons/theme_default/static/src/scss/colors.scss @@ -1,79 +1,3 @@ -/* Clean Colors */ - -$color-blue: #3498DB; -$color-turquoise: #1ABC9C; -$color-green: #2ECC71; -$color-yellow: #F1C40F; -$color-orange: #E67E22; -$color-red: #E74C3C; -$color-pink: #f74b94; -$color-purple: #9B59B6; -$color-brown: #7b5844; - -$color-blue-dark: #2980B9; -$color-turquoise-dark: #16A085; -$color-green-dark: #27AE60; -$color-yellow-dark: #f3ac12; -$color-orange-dark: #D35400; -$color-red-dark: #C0392B; -$color-pink-dark: #ea3884; -$color-purple-dark: #8E44AD; -$color-brown-dark: #604434; - -$color-blue-light: lighten($color-blue, 20%); -$color-turquoise-light: lighten($color-turquoise, 20%); -$color-green-light: lighten($color-green, 20%); -$color-yellow-light: lighten($color-yellow, 20%); -$color-orange-light: lighten($color-orange, 20%); -$color-red-light: lighten($color-red, 20%); -$color-pink-light: lighten($color-pink, 20%); -$color-purple-light: lighten($color-purple, 20%); -$color-brown-light: lighten($color-brown, 20%); - -$color-clouds: #ECF0F1; -$color-silver: #BDC3C7; -$color-concrete: #95A5A6; -$color-stone: #7F8C8D; -$color-asphalt: #34495E; -$color-midnight: #2C3E50; - - -$color-concrete-dark: #445b5c; - -/* +++++ NEW COLORS +++++ */ - -$color-wind: #f7f7f7; -$color-clay: #e1dcd5; -$color-sand: #c5bcb1; -$color-beach: #f3bf91; -$color-forest: #254c3a; -$color-twilight: #3b2c50; -$color-burgundy: #8e362d; -$color-marine: #212d3a; - -/* GRAYS --------------------------------------------------------- */ - -$gray-darker: lighten(#000, 20%); -$gray-dark: lighten(#000, 40%); -$gray: lighten(#000, 55%); -$gray-light: lighten(#000, 70%); -$gray-lighter: lighten(#000, 80%); - -/* Backgrounds Colors ------------------------------------------------*/ - -$bg-blue: background($color-blue); -$bg-turquoise: background($color-turquoise); -$bg-green: background($color-green); -$bg-yellow: background($color-yellow); -$bg-orange: background($color-orange); -$bg-red: background($color-red); -$bg-pink: background($color-pink); -$bg-purple: background($color-purple); -$bg-brown: background($color-brown); - - -/* ---- Default Color HTML Class ---- */ - .bg-blue { background-color: $color-blue;} .bg-turquoise { background-color: $color-turquoise;} .bg-green { background-color: $color-green;} @@ -92,4 +16,4 @@ $bg-brown: background($color-brown); .text-red { color: $color-red;} .text-pink { color: $color-pink;} .text-purple { color: $color-purple;} -.text-brown { color: $color-brown;} \ No newline at end of file +.text-brown { color: $color-brown;} 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 ed66abd08ac..a0a7c914930 100644 --- a/addons/theme_default/static/src/scss/option_color_amethyst.scss +++ b/addons/theme_default/static/src/scss/option_color_amethyst.scss @@ -1,16 +1,4 @@ -/* GRAYS --------------------------------------------------------- */ - -$gray-darker: lighten(#000, 30%); - -/* COLORS --------------------------------------------------------- */ - -$color-primary: $color-purple; -$color-success: $color-purple-dark; -$color-info: $color-twilight; -$color-warning: $color-red-dark; -$color-danger: $color-midnight; - -/* COLORED BG -------------------------------------------------------- */ +/* COLORED BG -------------------------------------------------------- */ .bg-primary { background-color: $color-clouds; @@ -19,7 +7,7 @@ $color-danger: $color-midnight; background-color: $color-purple; } .bg-info { - background-color: $color-twilight; + background-color: $color-twilight; } .bg-warning { background-color: $color-purple-dark; @@ -28,20 +16,6 @@ $color-danger: $color-midnight; background-color: $color-midnight; } -/* TEXTS & LINKS --------------------------------------------------- */ - -$text-muted: $color-primary; -$link-color: $color-primary; -$link-hover-color: $color-success; - -/* 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; - .btn .fa { color: white;} @@ -51,27 +25,27 @@ $btn-danger-bg: $color-red; /* 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;} +.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; - } \ No newline at end of file + 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 new file mode 100644 index 00000000000..a50fa8aaf78 --- /dev/null +++ b/addons/theme_default/static/src/scss/option_color_amethyst_bs_variables.scss @@ -0,0 +1,17 @@ +/* GRAYS --------------------------------------------------------- */ + +$gray-darker: lighten(#000, 30%); + +/* TEXTS & LINKS --------------------------------------------------- */ + +$text-muted: $color-primary; +$link-color: $color-primary; +$link-hover-color: $color-success; + +/* 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_amethyst_variables.scss b/addons/theme_default/static/src/scss/option_color_amethyst_variables.scss new file mode 100644 index 00000000000..b770aadd105 --- /dev/null +++ b/addons/theme_default/static/src/scss/option_color_amethyst_variables.scss @@ -0,0 +1,7 @@ +/* COLORS --------------------------------------------------------- */ + +$color-primary: $color-purple; +$color-success: $color-purple-dark; +$color-info: $color-twilight; +$color-warning: $color-red-dark; +$color-danger: $color-midnight; 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 5c8eae78d53..ed3c6efb5c4 100644 --- a/addons/theme_default/static/src/scss/option_color_cobalt.scss +++ b/addons/theme_default/static/src/scss/option_color_cobalt.scss @@ -1,12 +1,4 @@ -/* COLORS --------------------------------------------------------- */ - -$color-primary: $color-blue; -$color-success: $color-turquoise; -$color-info: $color-green; -$color-warning: $color-asphalt; -$color-danger: $color-midnight; - -/* COLORED BG -------------------------------------------------------- */ +/* COLORED BG -------------------------------------------------------- */ .bg-primary { background-color: $color-wind; @@ -24,20 +16,6 @@ $color-danger: $color-midnight; background-color: $color-asphalt; } -/* TEXTS & LINKS --------------------------------------------------- */ - -$text-muted: $color-primary; -$link-color: $color-primary; -$link-hover-color: $color-info; - -/* 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; - .btn .fa { color: white;} 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 new file mode 100644 index 00000000000..ab87820cddb --- /dev/null +++ b/addons/theme_default/static/src/scss/option_color_cobalt_bs_variables.scss @@ -0,0 +1,13 @@ +/* TEXTS & LINKS --------------------------------------------------- */ + +$text-muted: $color-primary; +$link-color: $color-primary; +$link-hover-color: $color-info; + +/* 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_cobalt_variables.scss b/addons/theme_default/static/src/scss/option_color_cobalt_variables.scss new file mode 100644 index 00000000000..d2aec3a8772 --- /dev/null +++ b/addons/theme_default/static/src/scss/option_color_cobalt_variables.scss @@ -0,0 +1,7 @@ +/* COLORS --------------------------------------------------------- */ + +$color-primary: $color-blue; +$color-success: $color-turquoise; +$color-info: $color-green; +$color-warning: $color-asphalt; +$color-danger: $color-midnight; 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 ab1dc35b132..d936425e1f2 100644 --- a/addons/theme_default/static/src/scss/option_color_emerald.scss +++ b/addons/theme_default/static/src/scss/option_color_emerald.scss @@ -1,12 +1,4 @@ -/* COLORS --------------------------------------------------------- */ - -$color-primary: $color-green; -$color-success: $color-turquoise; -$color-info: $color-turquoise-dark; -$color-warning: $color-asphalt; -$color-danger: $color-midnight; - -/* COLORED BG -------------------------------------------------------- */ +/* COLORED BG -------------------------------------------------------- */ .bg-primary { background-color: $color-wind; @@ -24,20 +16,6 @@ $color-danger: $color-midnight; background-color: $color-forest; } -/* TEXTS & LINKS --------------------------------------------------- */ - -$text-muted: $color-success; -$link-color: $color-success; -$link-hover-color: $color-primary; - -/* 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; - .btn .fa { color: white;} @@ -47,27 +25,27 @@ $btn-danger-bg: $color-red; /* 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;} +.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; - } + 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 new file mode 100644 index 00000000000..9b8dec0f38e --- /dev/null +++ b/addons/theme_default/static/src/scss/option_color_emerald_bs_variables.scss @@ -0,0 +1,13 @@ +/* TEXTS & LINKS --------------------------------------------------- */ + +$text-muted: $color-success; +$link-color: $color-success; +$link-hover-color: $color-primary; + +/* 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_emerald_variables.scss b/addons/theme_default/static/src/scss/option_color_emerald_variables.scss new file mode 100644 index 00000000000..73f73b12dd3 --- /dev/null +++ b/addons/theme_default/static/src/scss/option_color_emerald_variables.scss @@ -0,0 +1,7 @@ +/* COLORS --------------------------------------------------------- */ + +$color-primary: $color-green; +$color-success: $color-turquoise; +$color-info: $color-turquoise-dark; +$color-warning: $color-asphalt; +$color-danger: $color-midnight; 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 3cc62a3f1a3..ba6fa843ec5 100644 --- a/addons/theme_default/static/src/scss/option_color_gold.scss +++ b/addons/theme_default/static/src/scss/option_color_gold.scss @@ -1,12 +1,4 @@ -/* COLORS --------------------------------------------------------- */ - -$color-primary: $color-orange; -$color-success: $color-red; -$color-info: $color-yellow-dark; -$color-warning: $color-red-dark; -$color-danger: $color-orange-dark; - -/* COLORED BG -------------------------------------------------------- */ +/* COLORED BG -------------------------------------------------------- */ .bg-primary { background-color: $color-sand; @@ -24,20 +16,6 @@ $color-danger: $color-orange-dark; background-color: $color-orange-dark; } -/* TEXTS & LINKS ------------------------------------------------------- */ - -$text-muted: $gray; -$link-color: $color-info; -$link-hover-color: $color-primary; - -/* 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; - .btn .fa { color: white;} @@ -47,22 +25,22 @@ $btn-danger-bg: $color-red-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;} +.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; @@ -71,7 +49,3 @@ footer h4 { 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 new file mode 100644 index 00000000000..eb10f308be8 --- /dev/null +++ b/addons/theme_default/static/src/scss/option_color_gold_bs_variables.scss @@ -0,0 +1,13 @@ +/* TEXTS & LINKS ------------------------------------------------------- */ + +$text-muted: $gray; +$link-color: $color-info; +$link-hover-color: $color-primary; + +/* 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_gold_variables.scss b/addons/theme_default/static/src/scss/option_color_gold_variables.scss new file mode 100644 index 00000000000..596423eeef0 --- /dev/null +++ b/addons/theme_default/static/src/scss/option_color_gold_variables.scss @@ -0,0 +1,7 @@ +/* COLORS --------------------------------------------------------- */ + +$color-primary: $color-orange; +$color-success: $color-red; +$color-info: $color-yellow-dark; +$color-warning: $color-red-dark; +$color-danger: $color-orange-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 12fce8ea4e6..e87f7168391 100644 --- a/addons/theme_default/static/src/scss/option_color_ruby.scss +++ b/addons/theme_default/static/src/scss/option_color_ruby.scss @@ -1,16 +1,4 @@ -/* GRAYS --------------------------------------------------------- */ - -$gray: lighten(#000, 50%); - -/* COLORS --------------------------------------------------------- */ - -$color-primary: $color-red; -$color-success: $color-red-dark; -$color-info: $color-orange; -$color-warning: $color-purple; -$color-danger: $color-orange-dark; - -/* COLORED BG -------------------------------------------------------- */ +/* COLORED BG -------------------------------------------------------- */ .bg-primary { background-color: $color-sand; @@ -28,20 +16,6 @@ $color-danger: $color-orange-dark; background-color: $color-orange-dark; } -/* TEXT & LINKS -------------------------------------------------------- */ - -$text-muted: $gray; -$link-color: $color-primary; -$link-hover-color: $color-success; - -/* 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; - .btn .fa { color: white;} @@ -51,22 +25,22 @@ $btn-danger-bg: $color-red-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;} +.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; @@ -74,5 +48,4 @@ footer h4 { } 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 new file mode 100644 index 00000000000..7fd168c8bd7 --- /dev/null +++ b/addons/theme_default/static/src/scss/option_color_ruby_bs_variables.scss @@ -0,0 +1,17 @@ +/* GRAYS --------------------------------------------------------- */ + +$gray: lighten(#000, 50%); + +/* TEXT & LINKS -------------------------------------------------------- */ + +$text-muted: $gray; +$link-color: $color-primary; +$link-hover-color: $color-success; + +/* 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; diff --git a/addons/theme_default/static/src/scss/option_color_ruby_variables.scss b/addons/theme_default/static/src/scss/option_color_ruby_variables.scss new file mode 100644 index 00000000000..c780d477bda --- /dev/null +++ b/addons/theme_default/static/src/scss/option_color_ruby_variables.scss @@ -0,0 +1,7 @@ +/* COLORS --------------------------------------------------------- */ + +$color-primary: $color-red; +$color-success: $color-red-dark; +$color-info: $color-orange; +$color-warning: $color-purple; +$color-danger: $color-orange-dark; diff --git a/addons/theme_default/static/src/scss/option_color_stone.scss b/addons/theme_default/static/src/scss/option_color_stone.scss deleted file mode 100644 index 42c9937270d..00000000000 --- a/addons/theme_default/static/src/scss/option_color_stone.scss +++ /dev/null @@ -1,76 +0,0 @@ -/* COLORS --------------------------------------------------------- */ - -$color-primary: $color-concrete; -$color-success: $color-turquoise; -$color-info: $color-stone; -$color-warning: $color-concrete-dark; -$color-danger: $color-midnight; - -/* COLORED BG -------------------------------------------------------- */ - -.bg-primary { - background-color: $color-clouds; -} -.bg-success { - background-color: $color-silver; -} -.bg-info { - background-color: $color-stone; -} -.bg-warning { - background-color: $color-concrete-dark; -} -.bg-danger { - background-color: $color-asphalt; -} - -/* TEXT & LINKS -------------------------------------------------------- */ - -$text-muted: $color-primary; -$link-color: $color-primary; -$link-hover-color: $color-info; - -/* BUTTONS --------------------------------------------------------- */ - -$btn-primary-bg: $color-concrete; -$btn-success-bg: $color-blue; -$btn-info-bg: $color-asphalt; -$btn-warning-bg: $color-red; -$btn-danger-bg: $color-red-dark; - -.btn .fa { - color: white;} - -.btn-default .fa { - color: $gray-dark;} - -/* TRANSPARENT BG --------------------------------------------------- */ -/* Used in snippets Prx Image Color and Prx Image Shade ------------- */ - -.bg-transparent-color { background: $color-stone; opacity: 0.9;} -.bg-transparent-shade { background: black; opacity: 0.5;} - -/* Footer ----------------------------------------------------------- */ - -#wrapwrap footer { - background-color: $color-concrete-dark; - color: $color-concrete; - } -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/primary_variables.scss b/addons/theme_default/static/src/scss/primary_variables.scss new file mode 100644 index 00000000000..bb7cdef0818 --- /dev/null +++ b/addons/theme_default/static/src/scss/primary_variables.scss @@ -0,0 +1,47 @@ +$color-blue: #3498DB; +$color-turquoise: #1ABC9C; +$color-green: #2ECC71; +$color-yellow: #F1C40F; +$color-orange: #E67E22; +$color-red: #E74C3C; +$color-pink: #f74b94; +$color-purple: #9B59B6; +$color-brown: #7b5844; + +$color-blue-dark: #2980B9; +$color-turquoise-dark: #16A085; +$color-green-dark: #27AE60; +$color-yellow-dark: #f3ac12; +$color-orange-dark: #D35400; +$color-red-dark: #C0392B; +$color-pink-dark: #ea3884; +$color-purple-dark: #8E44AD; +$color-brown-dark: #604434; + +$color-blue-light: lighten($color-blue, 20%); +$color-turquoise-light: lighten($color-turquoise, 20%); +$color-green-light: lighten($color-green, 20%); +$color-yellow-light: lighten($color-yellow, 20%); +$color-orange-light: lighten($color-orange, 20%); +$color-red-light: lighten($color-red, 20%); +$color-pink-light: lighten($color-pink, 20%); +$color-purple-light: lighten($color-purple, 20%); +$color-brown-light: lighten($color-brown, 20%); + +$color-clouds: #ECF0F1; +$color-silver: #BDC3C7; +$color-concrete: #95A5A6; +$color-stone: #7F8C8D; +$color-asphalt: #34495E; +$color-midnight: #2C3E50; + +$color-concrete-dark: #445b5c; + +$color-wind: #f7f7f7; +$color-clay: #e1dcd5; +$color-sand: #c5bcb1; +$color-beach: #f3bf91; +$color-forest: #254c3a; +$color-twilight: #3b2c50; +$color-burgundy: #8e362d; +$color-marine: #212d3a; diff --git a/addons/theme_default/views/theme_default_templates.xml b/addons/theme_default/views/theme_default_templates.xml index 3c23a080aa3..5b98ef506d5 100644 --- a/addons/theme_default/views/theme_default_templates.xml +++ b/addons/theme_default/views/theme_default_templates.xml @@ -1,9 +1,20 @@ -