[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
This commit is contained in:
@@ -37,7 +37,7 @@
|
||||
transition: opacity 100ms;
|
||||
}
|
||||
|
||||
@include media-breakpoint-down(sm) {
|
||||
@include media-breakpoint-down(md) {
|
||||
height: auto;
|
||||
min-height: 200px;
|
||||
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
@@ -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%;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -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%;
|
||||
}
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
@@ -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,
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
@@ -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) {
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
min-height: 450px;
|
||||
color: gray('800');
|
||||
|
||||
@include media-breakpoint-down(md) {
|
||||
@include media-breakpoint-down(lg) {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
@@ -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 {
|
||||
|
||||
Reference in New Issue
Block a user