From ac63e031c0e74e7b12a8500e7d9bee74f7b170a0 Mon Sep 17 00:00:00 2001 From: Romeo Fragomeli Date: Mon, 4 Jul 2022 07:53:56 +0000 Subject: [PATCH 1/2] [REF] *: BS5: adapt changes in media query mixin > Media query mixins parameters have changed for a more logical approach > media-breakpoint-down() uses the breakpoint itself instead of the next > breakpoint (e.g., media-breakpoint-down(lg) instead of > media-breakpoint-down(md) targets viewports smaller than lg). > Similarly, the second parameter in media-breakpoint-between() also > uses the breakpoint itself instead of the next breakpoint (e.g., > media-between(sm, lg) instead of media-breakpoint-between(sm, md) > targets viewports between sm and lg). https://getbootstrap.com/docs/5.1/migration/#sass Task ID: 2766483 Part-of: odoo/design-themes#580 --- .../s_banner_parallax/000_variables.scss | 4 +-- .../s_features_carousel/000_variables.scss | 2 +- .../compatibility-saas-11.4-variables.scss | 2 +- .../compatibility-saas-11.4-variables.scss | 2 +- .../compatibility-saas-11.4-variables.scss | 2 +- .../old_snippets/s_animated_boxes/000.scss | 2 +- .../old_snippets/s_banner_parallax/000.scss | 4 +-- .../old_snippets/s_clonable_boxes/000.scss | 2 +- .../old_snippets/s_color_blocks_4/000.scss | 2 +- .../src/old_snippets/s_event_slide/000.scss | 2 +- .../old_snippets/s_features_carousel/000.scss | 2 +- .../old_snippets/s_images_carousel/000.scss | 2 +- .../s_menu_three_columns/000.scss | 4 +-- .../old_snippets/s_products_carousel/000.scss | 4 +-- .../src/old_snippets/s_profile/000.scss | 2 +- .../src/old_snippets/s_progress/000.scss | 8 ++--- .../compatibility-saas-11.4-variables.scss | 2 +- .../src/scss/compatibility-saas-11.4.scss | 30 +++++++++---------- theme_common/static/src/scss/mixins.scss | 18 +++++------ .../s_features_carousel/000_variables.scss | 2 +- .../s_banner_parallax/000_variables.scss | 6 ++-- .../s_features_carousel/000_variables.scss | 2 +- .../compatibility-saas-11.4-variables.scss | 6 ++-- .../s_banner_parallax/000_variables.scss | 2 +- .../s_big_icons/000_variables.scss | 6 ++-- .../s_features_carousel/000_variables.scss | 2 +- .../compatibility-saas-11.4-variables.scss | 2 +- .../static/src/snippets/s_numbers/000.scss | 2 +- .../s_features_carousel/000_variables.scss | 2 +- .../compatibility-saas-11.4-variables.scss | 2 +- .../compatibility-saas-11.4-variables.scss | 2 +- .../compatibility-saas-11.4-variables.scss | 4 +-- .../compatibility-saas-11.4-variables.scss | 2 +- 33 files changed, 69 insertions(+), 69 deletions(-) diff --git a/theme_anelusia/static/src/old_snippets/s_banner_parallax/000_variables.scss b/theme_anelusia/static/src/old_snippets/s_banner_parallax/000_variables.scss index f10941fed..842c6fe07 100644 --- a/theme_anelusia/static/src/old_snippets/s_banner_parallax/000_variables.scss +++ b/theme_anelusia/static/src/old_snippets/s_banner_parallax/000_variables.scss @@ -6,7 +6,7 @@ $s-banner-parallax-text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.6); width: 100%; text-align: center; bottom: -30px; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { top: 100px; } } @@ -14,7 +14,7 @@ $s-banner-parallax-text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.6); vertical-align: bottom; } @mixin s-banner-parallax-height-hook { - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { height: 100vh !important; } } diff --git a/theme_anelusia/static/src/old_snippets/s_features_carousel/000_variables.scss b/theme_anelusia/static/src/old_snippets/s_features_carousel/000_variables.scss index 4c35832e0..ae15dac52 100644 --- a/theme_anelusia/static/src/old_snippets/s_features_carousel/000_variables.scss +++ b/theme_anelusia/static/src/old_snippets/s_features_carousel/000_variables.scss @@ -2,7 +2,7 @@ $s-features-carousel-border-width: 0; @mixin s-features-carousel-inner-hook { .carousel-inner .row { margin: 0 70px; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { margin: 0; } } diff --git a/theme_anelusia/static/src/scss/compatibility-saas-11.4-variables.scss b/theme_anelusia/static/src/scss/compatibility-saas-11.4-variables.scss index 87e890155..c510a1459 100644 --- a/theme_anelusia/static/src/scss/compatibility-saas-11.4-variables.scss +++ b/theme_anelusia/static/src/scss/compatibility-saas-11.4-variables.scss @@ -7,7 +7,7 @@ $s-banner-3-carousel-height: 100vh; text-align: center; width: 100%; padding-top: 60vh; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { padding-top: 25vh; } } diff --git a/theme_artists/static/src/scss/compatibility-saas-11.4-variables.scss b/theme_artists/static/src/scss/compatibility-saas-11.4-variables.scss index 7e9c6833a..61865bc13 100644 --- a/theme_artists/static/src/scss/compatibility-saas-11.4-variables.scss +++ b/theme_artists/static/src/scss/compatibility-saas-11.4-variables.scss @@ -25,7 +25,7 @@ $s-banner-3-h2-size: 30px; transform: none; font-size: 18px; } - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { width: 100%; margin-top: 0; } diff --git a/theme_beauty/static/src/scss/compatibility-saas-11.4-variables.scss b/theme_beauty/static/src/scss/compatibility-saas-11.4-variables.scss index 9e763f994..9ab597c28 100644 --- a/theme_beauty/static/src/scss/compatibility-saas-11.4-variables.scss +++ b/theme_beauty/static/src/scss/compatibility-saas-11.4-variables.scss @@ -26,7 +26,7 @@ $s-banner-3-h2-size: 30px; margin-top: 0; } h1 { - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { font-size: 40px !important; margin-top: 0; } diff --git a/theme_common/static/src/old_snippets/s_animated_boxes/000.scss b/theme_common/static/src/old_snippets/s_animated_boxes/000.scss index 00bc21b51..e2a151edd 100644 --- a/theme_common/static/src/old_snippets/s_animated_boxes/000.scss +++ b/theme_common/static/src/old_snippets/s_animated_boxes/000.scss @@ -37,7 +37,7 @@ transition: opacity 100ms; } - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { height: auto; min-height: 200px; diff --git a/theme_common/static/src/old_snippets/s_banner_parallax/000.scss b/theme_common/static/src/old_snippets/s_banner_parallax/000.scss index b651dbcfd..34399e393 100644 --- a/theme_common/static/src/old_snippets/s_banner_parallax/000.scss +++ b/theme_common/static/src/old_snippets/s_banner_parallax/000.scss @@ -3,7 +3,7 @@ $s-banner-parallax-text-color: o-color('alpha') !default; #wrapwrap .s_banner_parallax { margin-bottom: 0px !important; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { background-position: $s-banner-parallax-bg-position; } @include s-banner-parallax-height-hook; @@ -19,7 +19,7 @@ $s-banner-parallax-text-color: o-color('alpha') !default; color: $s-banner-parallax-text-color; @include s-banner-parallax-hero-bg-hook; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { text-align: center; padding-left: 15px; } diff --git a/theme_common/static/src/old_snippets/s_clonable_boxes/000.scss b/theme_common/static/src/old_snippets/s_clonable_boxes/000.scss index b1dbcafcf..fa9005f1e 100644 --- a/theme_common/static/src/old_snippets/s_clonable_boxes/000.scss +++ b/theme_common/static/src/old_snippets/s_clonable_boxes/000.scss @@ -15,7 +15,7 @@ padding-top: $grid-gutter-width/2; padding-bottom: $grid-gutter-width/2; - @include media-breakpoint-down(md) { + @include media-breakpoint-down(lg) { width: 100%; } } diff --git a/theme_common/static/src/old_snippets/s_color_blocks_4/000.scss b/theme_common/static/src/old_snippets/s_color_blocks_4/000.scss index 507514161..b5dec02c5 100644 --- a/theme_common/static/src/old_snippets/s_color_blocks_4/000.scss +++ b/theme_common/static/src/old_snippets/s_color_blocks_4/000.scss @@ -12,7 +12,7 @@ [class*="col-lg-"] { padding: 64px 20px; } - @include media-breakpoint-down(md) { + @include media-breakpoint-down(lg) { [class*="col-lg-"] { flex: 1 1 100%; } diff --git a/theme_common/static/src/old_snippets/s_event_slide/000.scss b/theme_common/static/src/old_snippets/s_event_slide/000.scss index ee803f658..0900bb5a5 100644 --- a/theme_common/static/src/old_snippets/s_event_slide/000.scss +++ b/theme_common/static/src/old_snippets/s_event_slide/000.scss @@ -34,7 +34,7 @@ overflow: hidden; overflow-y: scroll; padding-top: 40px; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { overflow: visible; height: auto; } diff --git a/theme_common/static/src/old_snippets/s_features_carousel/000.scss b/theme_common/static/src/old_snippets/s_features_carousel/000.scss index 6ed448904..bc048f9bc 100644 --- a/theme_common/static/src/old_snippets/s_features_carousel/000.scss +++ b/theme_common/static/src/old_snippets/s_features_carousel/000.scss @@ -61,7 +61,7 @@ opacity: 1; cursor: pointer; } - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { [class*="col-lg-"] > p { padding: 0 30px; } diff --git a/theme_common/static/src/old_snippets/s_images_carousel/000.scss b/theme_common/static/src/old_snippets/s_images_carousel/000.scss index 50079972f..860bca874 100644 --- a/theme_common/static/src/old_snippets/s_images_carousel/000.scss +++ b/theme_common/static/src/old_snippets/s_images_carousel/000.scss @@ -1,7 +1,7 @@ .s_images_carousel { height: 400px; &.carousel { - @include media-breakpoint-down(md) { + @include media-breakpoint-down(lg) { height: auto !important; } .carousel-inner, diff --git a/theme_common/static/src/old_snippets/s_menu_three_columns/000.scss b/theme_common/static/src/old_snippets/s_menu_three_columns/000.scss index 38568fe5f..68ea7fbe0 100644 --- a/theme_common/static/src/old_snippets/s_menu_three_columns/000.scss +++ b/theme_common/static/src/old_snippets/s_menu_three_columns/000.scss @@ -7,7 +7,7 @@ height: 150px; position: relative; padding: 0; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { height: 100px; } @media only screen and (max-width : 360px) { // FIXME @@ -25,7 +25,7 @@ h2 { line-height: 150px; margin-top: 0; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { line-height: 100px; line-height: 100px; } diff --git a/theme_common/static/src/old_snippets/s_products_carousel/000.scss b/theme_common/static/src/old_snippets/s_products_carousel/000.scss index fc90b5141..ce857b6cb 100644 --- a/theme_common/static/src/old_snippets/s_products_carousel/000.scss +++ b/theme_common/static/src/old_snippets/s_products_carousel/000.scss @@ -66,7 +66,7 @@ color: o-color('alpha'); text-align: center; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { padding-top: 20px; text-align: center; } @@ -79,7 +79,7 @@ font-size: 85px; text-shadow: 1px 1px 11px rgba(0, 0, 0, 0.86); - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { font-size: 65px; } @media screen and (max-width: 360px) { diff --git a/theme_common/static/src/old_snippets/s_profile/000.scss b/theme_common/static/src/old_snippets/s_profile/000.scss index 33b358e14..e04c75246 100644 --- a/theme_common/static/src/old_snippets/s_profile/000.scss +++ b/theme_common/static/src/old_snippets/s_profile/000.scss @@ -2,7 +2,7 @@ min-height: 450px; color: gray('800'); - @include media-breakpoint-down(md) { + @include media-breakpoint-down(lg) { text-align: center; } diff --git a/theme_common/static/src/old_snippets/s_progress/000.scss b/theme_common/static/src/old_snippets/s_progress/000.scss index 25dbb8838..488f5b337 100644 --- a/theme_common/static/src/old_snippets/s_progress/000.scss +++ b/theme_common/static/src/old_snippets/s_progress/000.scss @@ -2,7 +2,7 @@ > div > .row > div { border-left-width: 1px; border-left-style: solid; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { border-bottom-width: 1px; border-bottom-style: solid; border-left-width: 0; @@ -27,7 +27,7 @@ padding: 10px; text-align: center; min-height: 230px; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { min-height: 50px; } @@ -56,14 +56,14 @@ height: 25px; text-align: right; width: 100%; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { display: none; } } .progress-content { padding: 10px 25px; min-height: 230px; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { min-height: 50px; } h1 { diff --git a/theme_common/static/src/scss/compatibility-saas-11.4-variables.scss b/theme_common/static/src/scss/compatibility-saas-11.4-variables.scss index ca460c66a..650de2984 100644 --- a/theme_common/static/src/scss/compatibility-saas-11.4-variables.scss +++ b/theme_common/static/src/scss/compatibility-saas-11.4-variables.scss @@ -15,7 +15,7 @@ margin: 0; } } - @include media-breakpoint-down(md) { + @include media-breakpoint-down(lg) { bottom: $bottom-sm; } } diff --git a/theme_common/static/src/scss/compatibility-saas-11.4.scss b/theme_common/static/src/scss/compatibility-saas-11.4.scss index a313523db..fa2f2990f 100644 --- a/theme_common/static/src/scss/compatibility-saas-11.4.scss +++ b/theme_common/static/src/scss/compatibility-saas-11.4.scss @@ -17,7 +17,7 @@ img { max-height: 80px; } - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { [class*="col-lg-"] { padding-bottom: 15px; } @@ -110,7 +110,7 @@ @include s-banner-3-col-center-hook; padding-left: $s-banner-3-padding; color: $s-banner-3-hero-bg-color; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { top: 0px; text-align: center; padding-left: 0px; @@ -399,7 +399,7 @@ font-weight: 300; } .row > div > img { - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { max-height: 100px; } } @@ -637,7 +637,7 @@ float: left; padding: 0 44px 0 0; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { width: 100%; padding: 0; } @@ -663,7 +663,7 @@ border-right: 0 solid #ccc; border-bottom: 15px solid rgba(0, 0, 0, 0); content: " "; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { display: none; } } @@ -678,7 +678,7 @@ border-right: 0 solid $s-timeline-color; border-bottom: 14px solid rgba(0, 0, 0, 0); content: " "; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { display: none; } } @@ -703,7 +703,7 @@ border-bottom-right-radius: 50%; border-bottom-left-radius: 50%; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { display: none; } } @@ -712,7 +712,7 @@ float: right; padding: 0 0 0 44px; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { padding: 0; margin-top: 20px; } @@ -740,7 +740,7 @@ float: right; padding: 0 0 0 44px; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { padding: 0; } @@ -821,7 +821,7 @@ $s-timeline-company-color: o-color('alpha') !default; margin-top: 5px; } -@include media-breakpoint-down(sm) { +@include media-breakpoint-down(md) { #wrapwrap ul.timeline:before { display: none; } @@ -959,7 +959,7 @@ $s-timeline-company-color: o-color('alpha') !default; } } -@include media-breakpoint-down(sm) { +@include media-breakpoint-down(md) { #wrapwrap .s_timeline_icons ul.timeline { text-align: center; &:before{ @@ -1119,7 +1119,7 @@ $s-timeline-company-color: o-color('alpha') !default; height: 100%; > div { height: 100%; - @include media-breakpoint-down(md) { + @include media-breakpoint-down(lg) { height: auto !important; } } @@ -1128,7 +1128,7 @@ $s-timeline-company-color: o-color('alpha') !default; .carousel-inner { width: 80%; margin: 0 10%; - @include media-breakpoint-down(md) { + @include media-breakpoint-down(lg) { width: 100%; margin: 0; } @@ -1168,7 +1168,7 @@ $s-timeline-company-color: o-color('alpha') !default; @include carousel-control(15px, 0, 2px); .fa { margin-top: -21px; - @include media-breakpoint-down(md) { + @include media-breakpoint-down(lg) { top: 65px; margin-top: 0; } @@ -1186,7 +1186,7 @@ $s-timeline-company-color: o-color('alpha') !default; #wrapwrap .s_medias_list { background-color: if($s-medias-list-bg-color-main != null, $s-medias-list-bg-color-main, gray('200')); .media { - @include media-breakpoint-down(md) { + @include media-breakpoint-down(lg) { height: auto !important; } > .row { diff --git a/theme_common/static/src/scss/mixins.scss b/theme_common/static/src/scss/mixins.scss index 8f5ae1883..d02d6dcac 100644 --- a/theme_common/static/src/scss/mixins.scss +++ b/theme_common/static/src/scss/mixins.scss @@ -92,7 +92,7 @@ &:hover { color: theme-color('primary'); } - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { top: auto; bottom: 0; } @@ -145,16 +145,16 @@ //------------------------------------------------------------------------------ @mixin o-theme-responsive-spacing-classes($lg, $md, $sm, $xs) { - @include media-breakpoint-down(lg) { + @include media-breakpoint-down(xl) { @include o-spacing-all($lg); } - @include media-breakpoint-down(md) { + @include media-breakpoint-down(lg) { @include o-spacing-all($md); } - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { @include o-spacing-all($sm); } - @include media-breakpoint-down(xs) { + @include media-breakpoint-down(sm) { @include o-spacing-all($xs); } } @@ -269,7 +269,7 @@ } @mixin o-theme-cfa-header-responsive-sizes() { - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { h1 { font-size: 30px; } @@ -346,7 +346,7 @@ @include media-breakpoint-up(md) { display: $display; } - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { padding: $media-padding; } .divider { @@ -563,7 +563,7 @@ } .oe_cart { .btn { - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { padding: 10px; } } @@ -617,7 +617,7 @@ } .wizard { box-shadow: none; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { padding-right: 0px; li { padding-left: 7px; diff --git a/theme_kea/static/src/old_snippets/s_features_carousel/000_variables.scss b/theme_kea/static/src/old_snippets/s_features_carousel/000_variables.scss index 3ed2314f9..4aa7f828c 100644 --- a/theme_kea/static/src/old_snippets/s_features_carousel/000_variables.scss +++ b/theme_kea/static/src/old_snippets/s_features_carousel/000_variables.scss @@ -1,7 +1,7 @@ @mixin s-features-carousel-inner-hook { .carousel-inner .row { margin: 0 70px; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { margin: 0; } } diff --git a/theme_loftspace/static/src/old_snippets/s_banner_parallax/000_variables.scss b/theme_loftspace/static/src/old_snippets/s_banner_parallax/000_variables.scss index 850be3aaa..fa1a140fa 100644 --- a/theme_loftspace/static/src/old_snippets/s_banner_parallax/000_variables.scss +++ b/theme_loftspace/static/src/old_snippets/s_banner_parallax/000_variables.scss @@ -26,7 +26,7 @@ $s-banner-parallax-h1-size: 50px; bottom: -85vh; left: -2px; opacity: 0.8; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { display: none; } } @@ -41,13 +41,13 @@ $s-banner-parallax-h1-size: 50px; bottom: -85vh; right: -2px; opacity: 0.8; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { display: none; } } }; @mixin s-banner-parallax-height-hook { - @include media-breakpoint-down(md) { + @include media-breakpoint-down(lg) { height: 100vh !important; } }; diff --git a/theme_loftspace/static/src/old_snippets/s_features_carousel/000_variables.scss b/theme_loftspace/static/src/old_snippets/s_features_carousel/000_variables.scss index f74c7ab62..24d32ec69 100644 --- a/theme_loftspace/static/src/old_snippets/s_features_carousel/000_variables.scss +++ b/theme_loftspace/static/src/old_snippets/s_features_carousel/000_variables.scss @@ -3,7 +3,7 @@ $s-features-carousel-indicators-visible: visible; @mixin s-features-carousel-inner-hook { .carousel-inner .row { margin: 40px 70px; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { margin: 0; } } diff --git a/theme_loftspace/static/src/scss/compatibility-saas-11.4-variables.scss b/theme_loftspace/static/src/scss/compatibility-saas-11.4-variables.scss index b62394adb..a3e9d2332 100644 --- a/theme_loftspace/static/src/scss/compatibility-saas-11.4-variables.scss +++ b/theme_loftspace/static/src/scss/compatibility-saas-11.4-variables.scss @@ -23,12 +23,12 @@ $s-big-icon-circle-icon-size: 150px; @mixin s-big-icon-circle-height-hook { height: 100vh; padding-top: 0; - @include media-breakpoint-down(lg) { + @include media-breakpoint-down(xl) { height: 100%; } .row { height: 100vh; - @include media-breakpoint-down(lg) { + @include media-breakpoint-down(xl) { height: 100%; } } @@ -40,7 +40,7 @@ $s-big-icon-circle-icon-size: 150px; @mixin s-big-icon-circle-fa-hook { height: 100px; line-height: 70px; - @include media-breakpoint-down(lg) { + @include media-breakpoint-down(xl) { height: 80px; } } diff --git a/theme_monglia/static/src/old_snippets/s_banner_parallax/000_variables.scss b/theme_monglia/static/src/old_snippets/s_banner_parallax/000_variables.scss index a45c3163f..2ffa0fe88 100644 --- a/theme_monglia/static/src/old_snippets/s_banner_parallax/000_variables.scss +++ b/theme_monglia/static/src/old_snippets/s_banner_parallax/000_variables.scss @@ -15,7 +15,7 @@ $s-banner-parallax-h1-size: 50px; padding: 0; } @mixin s-banner-parallax-height-hook { - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { height: 100vh !important; } } diff --git a/theme_monglia/static/src/old_snippets/s_big_icons/000_variables.scss b/theme_monglia/static/src/old_snippets/s_big_icons/000_variables.scss index b58fee0ef..f6682f303 100644 --- a/theme_monglia/static/src/old_snippets/s_big_icons/000_variables.scss +++ b/theme_monglia/static/src/old_snippets/s_big_icons/000_variables.scss @@ -3,11 +3,11 @@ $s-big-icon-circle-icon-size: 150px; $s-big-icon-circle-text-color: $-gray-700; @mixin s-big-icon-circle-height-hook { padding-top: 0; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { height: 100%; } .row { - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { height: 100%; } } @@ -18,7 +18,7 @@ $s-big-icon-circle-text-color: $-gray-700; @mixin s-big-icon-circle-fa-hook { height: 150px; line-height: 70px; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { height: 80px; } } diff --git a/theme_monglia/static/src/old_snippets/s_features_carousel/000_variables.scss b/theme_monglia/static/src/old_snippets/s_features_carousel/000_variables.scss index f74c7ab62..24d32ec69 100644 --- a/theme_monglia/static/src/old_snippets/s_features_carousel/000_variables.scss +++ b/theme_monglia/static/src/old_snippets/s_features_carousel/000_variables.scss @@ -3,7 +3,7 @@ $s-features-carousel-indicators-visible: visible; @mixin s-features-carousel-inner-hook { .carousel-inner .row { margin: 40px 70px; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { margin: 0; } } diff --git a/theme_monglia/static/src/scss/compatibility-saas-11.4-variables.scss b/theme_monglia/static/src/scss/compatibility-saas-11.4-variables.scss index e0f958cc2..29f6fc6b6 100644 --- a/theme_monglia/static/src/scss/compatibility-saas-11.4-variables.scss +++ b/theme_monglia/static/src/scss/compatibility-saas-11.4-variables.scss @@ -20,7 +20,7 @@ $s-banner-3-h2-size: 25px; img { display: none; } - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { top: 100px; width: 100%; } diff --git a/theme_monglia/static/src/snippets/s_numbers/000.scss b/theme_monglia/static/src/snippets/s_numbers/000.scss index 3b5904223..6f8b9c0df 100644 --- a/theme_monglia/static/src/snippets/s_numbers/000.scss +++ b/theme_monglia/static/src/snippets/s_numbers/000.scss @@ -1,7 +1,7 @@ .s_numbers { .s_number { font-size: 75px; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { font-size: 60px; } } diff --git a/theme_notes/static/src/old_snippets/s_features_carousel/000_variables.scss b/theme_notes/static/src/old_snippets/s_features_carousel/000_variables.scss index 3ed2314f9..4aa7f828c 100644 --- a/theme_notes/static/src/old_snippets/s_features_carousel/000_variables.scss +++ b/theme_notes/static/src/old_snippets/s_features_carousel/000_variables.scss @@ -1,7 +1,7 @@ @mixin s-features-carousel-inner-hook { .carousel-inner .row { margin: 0 70px; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { margin: 0; } } diff --git a/theme_notes/static/src/scss/compatibility-saas-11.4-variables.scss b/theme_notes/static/src/scss/compatibility-saas-11.4-variables.scss index 7441f36fd..e81a35608 100644 --- a/theme_notes/static/src/scss/compatibility-saas-11.4-variables.scss +++ b/theme_notes/static/src/scss/compatibility-saas-11.4-variables.scss @@ -3,7 +3,7 @@ $s-banner-3-padding: 0px; @mixin s-banner-3-col-center-hook { margin-left: 16.6667%; text-align: center; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { margin-left: 0px; } } diff --git a/theme_odoo_experts/static/src/scss/compatibility-saas-11.4-variables.scss b/theme_odoo_experts/static/src/scss/compatibility-saas-11.4-variables.scss index ae5cd6f32..3bc48df26 100644 --- a/theme_odoo_experts/static/src/scss/compatibility-saas-11.4-variables.scss +++ b/theme_odoo_experts/static/src/scss/compatibility-saas-11.4-variables.scss @@ -24,7 +24,7 @@ $s-banner-3-h2-size: 30px; transform: none; font-size: 18px; } - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { width: 100%; margin-top: 0; } diff --git a/theme_orchid/static/src/scss/compatibility-saas-11.4-variables.scss b/theme_orchid/static/src/scss/compatibility-saas-11.4-variables.scss index 174453540..d4e167b43 100644 --- a/theme_orchid/static/src/scss/compatibility-saas-11.4-variables.scss +++ b/theme_orchid/static/src/scss/compatibility-saas-11.4-variables.scss @@ -18,7 +18,7 @@ $s-banner-3-h2-size: 30px; margin-top: 100px; background-color: white; border: 15px solid rgba(255, 255, 255, .5); - @include media-breakpoint-down(lg) { + @include media-breakpoint-down(xl) { text-align: left !important; width: auto; margin-top: 0; @@ -34,7 +34,7 @@ $s-banner-3-h2-size: 30px; border: 15px solid white; border-left-width: 50px; border-right-width: 50px; - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { border-width: 10px; } } diff --git a/theme_yes/static/src/scss/compatibility-saas-11.4-variables.scss b/theme_yes/static/src/scss/compatibility-saas-11.4-variables.scss index c7440a710..d2889f0fc 100644 --- a/theme_yes/static/src/scss/compatibility-saas-11.4-variables.scss +++ b/theme_yes/static/src/scss/compatibility-saas-11.4-variables.scss @@ -24,7 +24,7 @@ $s-banner-3-h2-size: 30px; transform: none; font-size: 18px; } - @include media-breakpoint-down(sm) { + @include media-breakpoint-down(md) { width: 100%; margin-top: 0; } From 54cca0eaf6ae99befb68458e18adc47cff73df46 Mon Sep 17 00:00:00 2001 From: Romeo Fragomeli Date: Mon, 4 Jul 2022 07:56:18 +0000 Subject: [PATCH 2/2] [REF] *: BS5: migration Automated change made by a lot of RegEx to change all think that is possible to automate. https://getbootstrap.com/docs/5.1/migration Task ID: 2766483 Part-of: odoo/design-themes#580 --- theme_bewise/views/customizations.xml | 8 ++-- .../views/snippets/s_quotes_carousel.xml | 6 +-- .../src/old_snippets/s_compact_menu/000.scss | 4 +- .../src/old_snippets/s_discount/000.scss | 6 +-- .../src/old_snippets/s_event_list/000.scss | 10 ++-- .../src/old_snippets/s_event_slide/000.scss | 4 +- .../old_snippets/s_features_carousel/000.scss | 6 +-- .../src/old_snippets/s_full_menu/000.scss | 4 +- .../src/old_snippets/s_pricing/000.scss | 4 +- .../src/old_snippets/s_profile/000.scss | 12 ++--- .../src/scss/compatibility-saas-10-1.scss | 10 ++-- .../src/scss/compatibility-saas-10-2.scss | 20 ++++---- .../compatibility-saas-11.4-variables.scss | 2 +- .../src/scss/compatibility-saas-11.4.scss | 38 +++++++-------- theme_common/static/src/scss/mixins.scss | 48 +++++++++---------- theme_enark/views/snippets/s_numbers.xml | 6 +-- theme_graphene/views/customizations.xml | 14 +++--- .../s_discount/000_variables.scss | 2 +- theme_kiddo/views/snippets/s_image_text.xml | 4 +- .../views/snippets/s_quotes_carousel.xml | 4 +- theme_kiddo/views/snippets/s_text_image.xml | 4 +- .../views/snippets/s_three_columns.xml | 6 +-- .../s_features_carousel/000_variables.scss | 2 +- .../views/snippets/s_call_to_action.xml | 2 +- .../s_features_carousel/000_variables.scss | 2 +- theme_nano/views/snippets/s_carousel.xml | 2 +- .../views/snippets/s_quotes_carousel.xml | 4 +- .../views/snippets/s_quotes_carousel.xml | 4 +- theme_paptic/views/customizations.xml | 2 +- .../views/snippets/s_three_columns.xml | 6 +-- .../src/scss/compatibility-saas-11.4.scss | 6 +-- theme_yes/views/snippets/s_cover.xml | 2 +- .../views/snippets/s_quotes_carousel.xml | 2 +- 33 files changed, 128 insertions(+), 128 deletions(-) diff --git a/theme_bewise/views/customizations.xml b/theme_bewise/views/customizations.xml index 60f296b79..eacd84b4e 100644 --- a/theme_bewise/views/customizations.xml +++ b/theme_bewise/views/customizations.xml @@ -83,7 +83,7 @@

Journalists, directors, developers, etc. working effectively in their fields of excellence.

-
+
@@ -109,7 +109,7 @@

All students benefit from individualised support.

-
+
@@ -191,7 +191,7 @@ - + @@ -210,7 +210,7 @@ - + diff --git a/theme_bistro/views/snippets/s_quotes_carousel.xml b/theme_bistro/views/snippets/s_quotes_carousel.xml index 62005be91..be477a14f 100644 --- a/theme_bistro/views/snippets/s_quotes_carousel.xml +++ b/theme_bistro/views/snippets/s_quotes_carousel.xml @@ -13,7 +13,7 @@ background-image: none; - + Cosy and friendly, good atmosphere and super food. Especially the spiced fruit crumble. @@ -24,7 +24,7 @@ background-image: none; - + This place is perfect for groups or a casual date night. @@ -35,7 +35,7 @@ background-image: none; - + A truly exquisite dining experience. I highly recommend the Mustard Sauce, out of this world. diff --git a/theme_common/static/src/old_snippets/s_compact_menu/000.scss b/theme_common/static/src/old_snippets/s_compact_menu/000.scss index 68eea853e..1e8a23cce 100644 --- a/theme_common/static/src/old_snippets/s_compact_menu/000.scss +++ b/theme_common/static/src/old_snippets/s_compact_menu/000.scss @@ -17,12 +17,12 @@ > .row { min-height: 150px; height: auto; - border-left: 3px solid gray('200'); + border-left: 3px solid map-get($grays, '200'); > .menublock { margin: 0 0 0 20px; padding: 0 20px 0 0; - border-bottom: 1px solid gray('200'); + border-bottom: 1px solid map-get($grays, '200'); float: left; h4 { font-weight: bold; diff --git a/theme_common/static/src/old_snippets/s_discount/000.scss b/theme_common/static/src/old_snippets/s_discount/000.scss index b50b1e1df..760903154 100644 --- a/theme_common/static/src/old_snippets/s_discount/000.scss +++ b/theme_common/static/src/old_snippets/s_discount/000.scss @@ -4,7 +4,7 @@ padding: 30px 0; border-radius: $s-discount-box-border-radius; position: relative; - box-shadow: 0px 0px 5px 0px rgba(gray('700'), 0.5); + box-shadow: 0px 0px 5px 0px rgba(map-get($grays, '700'), 0.5); word-wrap: break-word; &:before { @@ -63,7 +63,7 @@ #wrapwrap .s_discount_descr { text-align: center; font-size: 13px; - color: gray('800'); + color: map-get($grays, '800'); margin-top: 10px; padding: 20px 25px; @include s-discount-descr-hook; @@ -92,7 +92,7 @@ border-radius: 4px; margin-top: 10px; background: #f0f0f0; - color: gray('800'); + color: map-get($grays, '800'); .code { padding: 10px 15px; } diff --git a/theme_common/static/src/old_snippets/s_event_list/000.scss b/theme_common/static/src/old_snippets/s_event_list/000.scss index 33b47b2f0..546ddf93f 100644 --- a/theme_common/static/src/old_snippets/s_event_list/000.scss +++ b/theme_common/static/src/old_snippets/s_event_list/000.scss @@ -42,13 +42,13 @@ text-align: center; > li { float: left; - color: gray('800'); + color: map-get($grays, '800'); font-size: 11px; font-weight: 300; &:hover { - color: gray('800'); - background-color: gray('200'); + color: map-get($grays, '800'); + background-color: map-get($grays, '200'); } > a { @@ -87,7 +87,7 @@ > a { display: block; width: 100%; - color: gray('800'); + color: map-get($grays, '800'); text-decoration: none; } } @@ -174,7 +174,7 @@ width: 40px; > ul { height: 100%; - border-left: 1px solid lighten(gray('200'), 10%); + border-left: 1px solid lighten(map-get($grays, '200'), 10%); > li { width: 100%; height: 33.333%; diff --git a/theme_common/static/src/old_snippets/s_event_slide/000.scss b/theme_common/static/src/old_snippets/s_event_slide/000.scss index 0900bb5a5..7643b9407 100644 --- a/theme_common/static/src/old_snippets/s_event_slide/000.scss +++ b/theme_common/static/src/old_snippets/s_event_slide/000.scss @@ -22,8 +22,8 @@ background-color: o-color('epsilon'); } > .row > div { - border-right: 1px solid gray('200'); - border-bottom: 1px solid gray('200'); + border-right: 1px solid map-get($grays, '200'); + border-bottom: 1px solid map-get($grays, '200'); text-align: left; h4 { text-align: center; diff --git a/theme_common/static/src/old_snippets/s_features_carousel/000.scss b/theme_common/static/src/old_snippets/s_features_carousel/000.scss index bc048f9bc..47ef934f1 100644 --- a/theme_common/static/src/old_snippets/s_features_carousel/000.scss +++ b/theme_common/static/src/old_snippets/s_features_carousel/000.scss @@ -40,17 +40,17 @@ border-bottom: { width: $s-features-carousel-border-width; style: $s-features-carousel-border-style; - color: if(s-features-carousel-border-color != null, $s-features-carousel-border-color, gray('600')); + color: if(s-features-carousel-border-color != null, $s-features-carousel-border-color, map-get($grays, '600')); } text-align: center; padding-bottom: 30px; } .carousel-indicators { - border-top: 1px dotted gray('600'); + border-top: 1px dotted map-get($grays, '600'); padding-top: 32px; visibility: $s-features-carousel-indicators-visible; li { - border: 1px solid gray('200'); + border: 1px solid map-get($grays, '200'); } } .carousel-indicators .active { diff --git a/theme_common/static/src/old_snippets/s_full_menu/000.scss b/theme_common/static/src/old_snippets/s_full_menu/000.scss index ed8626949..c5ff40136 100644 --- a/theme_common/static/src/old_snippets/s_full_menu/000.scss +++ b/theme_common/static/src/old_snippets/s_full_menu/000.scss @@ -8,10 +8,10 @@ font-size: 20px; } .menu-container > .s_full_menu_content { - border-left: 3px solid gray('200'); + border-left: 3px solid map-get($grays, '200'); .row { .s_full_menu_content_description { - border-bottom: 1px solid gray('200'); + border-bottom: 1px solid map-get($grays, '200'); padding-bottom: 15px; line-height: 1; span { diff --git a/theme_common/static/src/old_snippets/s_pricing/000.scss b/theme_common/static/src/old_snippets/s_pricing/000.scss index f475e535e..73ff7a35f 100644 --- a/theme_common/static/src/old_snippets/s_pricing/000.scss +++ b/theme_common/static/src/old_snippets/s_pricing/000.scss @@ -1,6 +1,6 @@ #wrapwrap .s_pricing strong { font-weight: 700; - color: gray('800'); + color: map-get($grays, '800'); } #wrapwrap .s_pricing_footer { @@ -8,7 +8,7 @@ } #wrapwrap .s_pricing_box { box-shadow: 0px 2px 5px 0px rgba(black, 0.1); - border: 1px solid lighten(gray('200'), 10%); + border: 1px solid lighten(map-get($grays, '200'), 10%); } #wrapwrap .s_pricing_header { diff --git a/theme_common/static/src/old_snippets/s_profile/000.scss b/theme_common/static/src/old_snippets/s_profile/000.scss index e04c75246..107cb0f7a 100644 --- a/theme_common/static/src/old_snippets/s_profile/000.scss +++ b/theme_common/static/src/old_snippets/s_profile/000.scss @@ -1,18 +1,18 @@ #wrapwrap .s_profile_box { min-height: 450px; - color: gray('800'); + color: map-get($grays, '800'); @include media-breakpoint-down(lg) { text-align: center; } h2 { - color: gray('800'); + color: map-get($grays, '800'); } span.tags { - background: gray('700'); + background: map-get($grays, '700'); border-radius: 2px; color: white; padding: 2px 4px; @@ -21,14 +21,14 @@ } #wrapwrap .s_profile_box_divider { - border-top: 1px solid lighten(gray('600'), 15%); + border-top: 1px solid lighten(map-get($grays, '600'), 15%); } #wrapwrap .s_profile_box_emphasis:hover { transition: all 0.3s ease-in-out; - background-color: lighten(gray('200'), 10%); + background-color: lighten(map-get($grays, '200'), 10%); } #wrapwrap .s_profile .card p, #wrapwrap .s_profile .card h2 { - color: gray('800'); + color: map-get($grays, '800'); } diff --git a/theme_common/static/src/scss/compatibility-saas-10-1.scss b/theme_common/static/src/scss/compatibility-saas-10-1.scss index 4c1066aca..66f2993ca 100644 --- a/theme_common/static/src/scss/compatibility-saas-10-1.scss +++ b/theme_common/static/src/scss/compatibility-saas-10-1.scss @@ -10,8 +10,8 @@ } } -.black { @include bg-compatibility-mixin($black, gray('600')); } -.darkgray { @include bg-compatibility-mixin(gray('800'), $white); } -.gray { @include bg-compatibility-mixin(gray('700'), $white); } -.lightgray { @include bg-compatibility-mixin(gray('200'), gray('700')); } -.white { @include bg-compatibility-mixin($white, gray('700')); } +.black { @include bg-compatibility-mixin($black, map-get($grays, '600')); } +.darkgray { @include bg-compatibility-mixin(map-get($grays, '800'), $white); } +.gray { @include bg-compatibility-mixin(map-get($grays, '700'), $white); } +.lightgray { @include bg-compatibility-mixin(map-get($grays, '200'), map-get($grays, '700')); } +.white { @include bg-compatibility-mixin($white, map-get($grays, '700')); } diff --git a/theme_common/static/src/scss/compatibility-saas-10-2.scss b/theme_common/static/src/scss/compatibility-saas-10-2.scss index 41f270986..d202f8ae4 100644 --- a/theme_common/static/src/scss/compatibility-saas-10-2.scss +++ b/theme_common/static/src/scss/compatibility-saas-10-2.scss @@ -3,23 +3,23 @@ // To allow a smooth transition, old classes alias are created here. // Define new theme variables in case the user changes its theme -$gray-light-light: gray('200'); -$gray-light-dark: gray('600'); -$gray-dark-light: gray('700'); -$gray-dark-dark: gray('900'); -$gray-darkest: gray('900'); +$gray-light-light: map-get($grays, '200'); +$gray-light-dark: map-get($grays, '600'); +$gray-dark-light: map-get($grays, '700'); +$gray-dark-dark: map-get($grays, '900'); +$gray-darkest: map-get($grays, '900'); body .color-black { color: $black; } body .color-white { color: $white; } -body .color-gray-lighter { color: gray('200'); } +body .color-gray-lighter { color: map-get($grays, '200'); } body .color-gray-light-light { color: $gray-light-light; } -body .color-gray-light { color: gray('600'); } +body .color-gray-light { color: map-get($grays, '600'); } body .color-gray-light-dark { color: $gray-light-dark; } -body .color-gray { color: gray('700'); } +body .color-gray { color: map-get($grays, '700'); } body .color-gray-dark-light { color: $gray-dark-light; } -body .color-gray-dark { color: gray('900'); } +body .color-gray-dark { color: map-get($grays, '900'); } body .color-gray-dark-dark { color: $gray-dark-dark; } -body .color-gray-darker { color: gray('900'); } +body .color-gray-darker { color: map-get($grays, '900'); } body .color-gray-darkest { color: $gray-darkest; } body .color-alpha { color: o-color('alpha'); } body .color-beta { color: o-color('beta'); } diff --git a/theme_common/static/src/scss/compatibility-saas-11.4-variables.scss b/theme_common/static/src/scss/compatibility-saas-11.4-variables.scss index 650de2984..8f484e86b 100644 --- a/theme_common/static/src/scss/compatibility-saas-11.4-variables.scss +++ b/theme_common/static/src/scss/compatibility-saas-11.4-variables.scss @@ -4,7 +4,7 @@ li { width: 12px; height: 12px; - border-color: gray('900'); + border-color: map-get($grays, '900'); margin: 0; &:hover { border-color: o-color('alpha'); diff --git a/theme_common/static/src/scss/compatibility-saas-11.4.scss b/theme_common/static/src/scss/compatibility-saas-11.4.scss index fa2f2990f..951799739 100644 --- a/theme_common/static/src/scss/compatibility-saas-11.4.scss +++ b/theme_common/static/src/scss/compatibility-saas-11.4.scss @@ -317,7 +317,7 @@ #wrapwrap .s_separator_shade hr { height: 2px; border-top: 0; - background: gray('700'); + background: map-get($grays, '700'); border-radius: 5px; } @@ -411,7 +411,7 @@ color: white; padding-top: 32px; p { - color: gray('800'); + color: map-get($grays, '800'); font-size: 16px; } } @@ -436,7 +436,7 @@ &.quotecarousel { padding: 0; } - @include blockquote-layout(#fff, gray('900')); + @include blockquote-layout(#fff, map-get($grays, '900')); .carousel-indicators { @include carousel-indicators(5px, -5px); } @@ -602,7 +602,7 @@ position: absolute; content: " "; width: 3px; - background-color: gray('200'); + background-color: map-get($grays, '200'); left: 50%; margin-left: -1.5px; } @@ -787,17 +787,17 @@ #wrapwrap .s_timeline_title { margin-top: 0; - color: gray('800'); + color: map-get($grays, '800'); } #wrapwrap .s_timeline_info { margin-top: 0; - color: gray('700'); + color: map-get($grays, '700'); } #wrapwrap .s_timeline_date { margin-top: 0; - color: gray('800'); + color: map-get($grays, '800'); } $s-timeline-company-color: o-color('alpha') !default; @@ -808,13 +808,13 @@ $s-timeline-company-color: o-color('alpha') !default; } #wrapwrap .s_timeline_heading { - color: gray('800'); + color: map-get($grays, '800'); } #wrapwrap .s_timeline_body > p, #wrapwrap .s_timeline_body > ul { margin-bottom: 0; - color: gray('800'); + color: map-get($grays, '800'); } #wrapwrap .s_timeline_body > p + p { @@ -855,7 +855,7 @@ $s-timeline-company-color: o-color('alpha') !default; top: 10px; bottom: 10px; left: 50%; - background-color: gray('700'); + background-color: map-get($grays, '700'); } li { @@ -875,7 +875,7 @@ $s-timeline-company-color: o-color('alpha') !default; .timeline-content-double { position: relative; width: 50%; - color: gray('900'); + color: map-get($grays, '900'); &:after { content: ''; position: absolute; @@ -883,8 +883,8 @@ $s-timeline-company-color: o-color('alpha') !default; right: 30px; display: inline-block; border-top: 5px solid rgba(0, 0, 0, 0); - border-left: 5px solid gray('900'); - border-right: 0 solid gray('900'); + border-left: 5px solid map-get($grays, '900'); + border-right: 0 solid map-get($grays, '900'); border-bottom: 5px solid rgba(0, 0, 0, 0); } @@ -922,7 +922,7 @@ $s-timeline-company-color: o-color('alpha') !default; line-height: 30px; margin-left: -40px; background-color: #fff; - color: gray('900'); + color: map-get($grays, '900'); font-weight: 700; text-align: center; z-index: $zindex-navbar; @@ -967,7 +967,7 @@ $s-timeline-company-color: o-color('alpha') !default; } li { - border-bottom: 1px solid gray('200'); + border-bottom: 1px solid map-get($grays, '200'); &:last-child{ border-bottom: 0; } @@ -1177,15 +1177,15 @@ $s-timeline-company-color: o-color('alpha') !default; } #wrapwrap .s_references_2 { - @include blockquote-layout(gray('200'), gray('900')); + @include blockquote-layout(map-get($grays, '200'), map-get($grays, '900')); .carousel-indicators { @include carousel-indicators(-15px, -10px); } } #wrapwrap .s_medias_list { - background-color: if($s-medias-list-bg-color-main != null, $s-medias-list-bg-color-main, gray('200')); - .media { + background-color: if($s-medias-list-bg-color-main != null, $s-medias-list-bg-color-main, map-get($grays, '200')); + .d-flex { @include media-breakpoint-down(lg) { height: auto !important; } @@ -1200,7 +1200,7 @@ $s-timeline-company-color: o-color('alpha') !default; } .media-options { height: 100%; - background-color: gray('200'); + background-color: map-get($grays, '200'); > .row { margin: 0; [class*="col-"]{ diff --git a/theme_common/static/src/scss/mixins.scss b/theme_common/static/src/scss/mixins.scss index d02d6dcac..ee9eceb41 100644 --- a/theme_common/static/src/scss/mixins.scss +++ b/theme_common/static/src/scss/mixins.scss @@ -83,14 +83,14 @@ @mixin carousel-control($position, $fa-position, $fa-padding) { opacity: 1; text-shadow: none; - color: gray('900'); + color: map-get($grays, '900'); font-size: inherit; width: 5%; .fa { top: 50%; background-color: #fff; &:hover { - color: theme-color('primary'); + color: map-get($theme-colors, 'primary'); } @include media-breakpoint-down(md) { top: auto; @@ -252,17 +252,17 @@ // designed... should we keep this ? @each $color, $alias in ('success': 'epsilon', 'info': 'gamma', 'warning': 'delta') { &.btn-#{$color} { - @include button-variant(theme-color($alias), theme-color($alias)); + @include button-variant(map-get($theme-colors, $alias), map-get($theme-colors, $alias)); } &.btn-outline-#{$color} { - @include button-outline-variant(theme-color($alias)); + @include button-outline-variant(map-get($theme-colors, $alias)); } } &.btn-danger { - @include button-variant(gray('black'), gray('black')); + @include button-variant(map-get($grays, 'black'), map-get($grays, 'black')); } &.btn-outline-danger { - @include button-outline-variant(gray('black'), gray('black')); + @include button-outline-variant(map-get($grays, 'black'), map-get($grays, 'black')); } } } @@ -288,7 +288,7 @@ border-right-width: 0px; border-radius: 0px; @if $with-color { - color: gray('700'); + color: map-get($grays, '700'); } &:focus { @@ -396,13 +396,13 @@ } @mixin o-theme-cfa-ecommerce-classes( - $nav-link-color: o-color('epsilon'), $nav-link-hover-color: o-color('beta'), $nav-link-hover-bg-color: gray('800'), + $nav-link-color: o-color('epsilon'), $nav-link-hover-color: o-color('beta'), $nav-link-hover-bg-color: map-get($grays, '800'), $nav-link-active-bg-color: rgba(0, 0, 0, 0), $nav-link-active-color: o-color('epsilon'), - $js-attributes-padding: 0px 15px 15px 15px, $js-attributes-strong-color: o-color('gamma'), $js-attributes-label-color: gray('700'), + $js-attributes-padding: 0px 15px 15px 15px, $js-attributes-strong-color: o-color('gamma'), $js-attributes-label-color: map-get($grays, '700'), $h6-padding-y: 10px, $h6-font-size: 13px, $h6-text-align: left, $h6-border-top: 0, $h6-border-bottom: 0, $h6-color: o-color('delta'), $price-font-size: 12px, $product-price-padding: 0, $product-price-align: left, $btn-secondary-padding: 5px 10px, - $right-column-border-bottom: 1px solid gray('700'), $right-column-color: gray('700'), $right-column-font-weight: bold, - $add-cart-bg-color: gray('700'), $add-cart-color: white, $add-cart-width: auto, $price-h4: 25px) { + $right-column-border-bottom: 1px solid map-get($grays, '700'), $right-column-color: map-get($grays, '700'), $right-column-font-weight: bold, + $add-cart-bg-color: map-get($grays, '700'), $add-cart-color: white, $add-cart-width: auto, $price-h4: 25px) { .breadcrumb { padding-top: 20px; @@ -435,10 +435,10 @@ } .oe_product { .btn.btn-danger { - @include button-variant(theme-color('danger'), theme-color('danger')); + @include button-variant(map-get($theme-colors, 'danger'), map-get($theme-colors, 'danger')); } .text-danger { - color: theme-color('danger') !important; + color: map-get($theme-colors, 'danger') !important; } .o_wsale_product_information { padding: 0px 15px; @@ -571,7 +571,7 @@ background-color: rgba(0, 0, 0, 0); } strong { - color: gray('700'); + color: map-get($grays, '700'); } #cart_products img { max-width: 100px; @@ -594,7 +594,7 @@ font-size: 18px; } #right_column { - color: gray('700'); + color: map-get($grays, '700'); a { color: red; } @@ -701,10 +701,10 @@ @mixin o-theme-chd-bg-gradient-classes() { .bg_gradient_primary_down { - background-image: linear-gradient( rgba(theme-color('primary'), 0), rgba(theme-color('primary'), 1) ),; + background-image: linear-gradient( rgba(map-get($theme-colors, 'primary'), 0), rgba(map-get($theme-colors, 'primary'), 1) ),; } .bg_gradient_primary_up { - background-image: linear-gradient( rgba(theme-color('primary'), 1), rgba(theme-color('primary'), 0) ),; + background-image: linear-gradient( rgba(map-get($theme-colors, 'primary'), 1), rgba(map-get($theme-colors, 'primary'), 0) ),; } .bg_gradient_white_down_thumb { background-image: linear-gradient( rgba(#ccc, 1), rgba(white, 0.5) ),; @@ -923,7 +923,7 @@ &:before { content: ""; width: 1px; - background-color: gray('200'); + background-color: map-get($grays, '200'); height: 100%; @include o-position-absolute(0, auto, 0, -10%); } @@ -968,7 +968,7 @@ label.css_attribute_color { opacity: 0.8; cursor: pointer; - border: 1px solid gray('600'); + border: 1px solid map-get($grays, '600'); box-shadow: inset 0 0 0 2px #fff; border-radius: 2px; @@ -1126,8 +1126,8 @@ .input-group .form-control { height: auto; padding: $padding; - color: gray('900'); - @include border-left-radius(20px); + color: map-get($grays, '900'); + @include border-start-radius(20px); + .input-group-append button { padding: 6px 20px; @@ -1138,10 +1138,10 @@ // Ask a question - Button .btn-group .btn { padding: 6px 12px; - @include border-right-radius(0); + @include border-end-radius(0); &.dropdown-toggle { - @include border-left-radius(0); - @include border-right-radius(20px); + @include border-start-radius(0); + @include border-end-radius(20px); } } // Ask a question - Editor icons diff --git a/theme_enark/views/snippets/s_numbers.xml b/theme_enark/views/snippets/s_numbers.xml index 69822b2ca..bce278812 100644 --- a/theme_enark/views/snippets/s_numbers.xml +++ b/theme_enark/views/snippets/s_numbers.xml @@ -18,13 +18,13 @@ - + - + - + diff --git a/theme_graphene/views/customizations.xml b/theme_graphene/views/customizations.xml index 722b1bc26..d94f12f7d 100644 --- a/theme_graphene/views/customizations.xml +++ b/theme_graphene/views/customizations.xml @@ -48,7 +48,7 @@

Unique experiences to drive engagement

-
+
@@ -57,7 +57,7 @@

We have one goal in mind, the user satisfaction.

-
+
@@ -81,12 +81,12 @@ -
+
-
+
@@ -169,7 +169,7 @@ diff --git a/theme_monglia/static/src/old_snippets/s_features_carousel/000_variables.scss b/theme_monglia/static/src/old_snippets/s_features_carousel/000_variables.scss index 24d32ec69..eee038e2f 100644 --- a/theme_monglia/static/src/old_snippets/s_features_carousel/000_variables.scss +++ b/theme_monglia/static/src/old_snippets/s_features_carousel/000_variables.scss @@ -9,5 +9,5 @@ $s-features-carousel-indicators-visible: visible; } } @mixin s-features-carousel-mask-hook { - border: 1px solid gray('200'); + border: 1px solid map-get($grays, '200'); } diff --git a/theme_nano/views/snippets/s_carousel.xml b/theme_nano/views/snippets/s_carousel.xml index 5d25ed9ce..c539e9e27 100644 --- a/theme_nano/views/snippets/s_carousel.xml +++ b/theme_nano/views/snippets/s_carousel.xml @@ -14,7 +14,7 @@ - + diff --git a/theme_odoo_experts/views/snippets/s_quotes_carousel.xml b/theme_odoo_experts/views/snippets/s_quotes_carousel.xml index 44c6f2ac9..47ce4d961 100644 --- a/theme_odoo_experts/views/snippets/s_quotes_carousel.xml +++ b/theme_odoo_experts/views/snippets/s_quotes_carousel.xml @@ -20,7 +20,7 @@ - + @@ -32,7 +32,7 @@ - + diff --git a/theme_orchid/views/snippets/s_quotes_carousel.xml b/theme_orchid/views/snippets/s_quotes_carousel.xml index 073a18e9c..7176c5c06 100644 --- a/theme_orchid/views/snippets/s_quotes_carousel.xml +++ b/theme_orchid/views/snippets/s_quotes_carousel.xml @@ -32,7 +32,7 @@ - + @@ -46,7 +46,7 @@ - + diff --git a/theme_paptic/views/customizations.xml b/theme_paptic/views/customizations.xml index 7fe2a51ce..11bfd6b87 100644 --- a/theme_paptic/views/customizations.xml +++ b/theme_paptic/views/customizations.xml @@ -99,7 +99,7 @@

 

Scalable and Modular

Whether you start small or are already a large company, our solution adapts to your needs and grows with you.

-
+
diff --git a/theme_real_estate/views/snippets/s_three_columns.xml b/theme_real_estate/views/snippets/s_three_columns.xml index bd70ba79d..b9dc97ec0 100644 --- a/theme_real_estate/views/snippets/s_three_columns.xml +++ b/theme_real_estate/views/snippets/s_three_columns.xml @@ -8,7 +8,7 @@ - $295,000 + $295,000 House On The Hill @@ -22,7 +22,7 @@ - $1,295,000,000 + $1,295,000,000 Moutain View @@ -36,7 +36,7 @@ - $455,000 + $455,000 Paradise Residence diff --git a/theme_treehouse/static/src/scss/compatibility-saas-11.4.scss b/theme_treehouse/static/src/scss/compatibility-saas-11.4.scss index 3a6ab7c1b..d20e635f2 100644 --- a/theme_treehouse/static/src/scss/compatibility-saas-11.4.scss +++ b/theme_treehouse/static/src/scss/compatibility-saas-11.4.scss @@ -116,11 +116,11 @@ // Comparisons .s_comparisons { .list-group-item.active, .list-group-item.active:focus, .list-group-item.active:hover { - background-color: theme-color('primary'); - border-color: theme-color('primary'); + background-color: map-get($theme-colors, 'primary'); + border-color: map-get($theme-colors, 'primary'); } .panel-body h2 small { - color: gray('900'); + color: map-get($grays, '900'); } } diff --git a/theme_yes/views/snippets/s_cover.xml b/theme_yes/views/snippets/s_cover.xml index 39055d395..49ec0e8d9 100644 --- a/theme_yes/views/snippets/s_cover.xml +++ b/theme_yes/views/snippets/s_cover.xml @@ -26,7 +26,7 @@ - + diff --git a/theme_yes/views/snippets/s_quotes_carousel.xml b/theme_yes/views/snippets/s_quotes_carousel.xml index 36d74c922..c55fbeb35 100644 --- a/theme_yes/views/snippets/s_quotes_carousel.xml +++ b/theme_yes/views/snippets/s_quotes_carousel.xml @@ -11,7 +11,7 @@
- +