mobile styles and fix overflow

This commit is contained in:
2024-12-18 15:52:12 -08:00
parent 90505b964a
commit 01ca26189e
24 changed files with 458 additions and 331 deletions

View File

@@ -1,4 +1,4 @@
.col2-circle-content-slice-container {
.col2-image-coopy-slice-container {
.highlighted-circle {
img {
border-radius: 50%;

View File

@@ -1,21 +1,41 @@
.radial-container-col3-card {
.sonar {
svg {
width: 100%;
max-width: 250px;
}
@include media-breakpoint-up(xs) {
width: 250px;
top: -646px;
}
@include media-breakpoint-up(md) {
top: -705px;
}
@include media-breakpoint-up(lg) {
top: -745px;
}
}
}
.col3-card-slice-container {
.col3-card-wrapper {
z-index: 1;
.col3-card-item {
position: relative;
min-height: 40em;
// border: 1px solid $gray-border;
// box-shadow: 5px 5px 10px 0px rgba(119, 119, 119, 0.16);
background-color: $white;
// min-height: 40em;
.col3-card-img {
width: 100%;
}
.col3-card-item-inner-wrapper {
min-height: 350px;
.col3-card-title {
color: $consumer-primary;

View File

@@ -17,7 +17,9 @@
.consumer-brand {
.faq-dropdown-slice-container {
.accordion-button {
padding: .5rem 1.25rem
padding: .5rem 1.25rem;
font-size: 20px;
line-height: normal;
}
.accordion-button,

View File

@@ -43,12 +43,6 @@ body {
}
}
h2 {
font-size: calc(1rem + 1vw);
font-weight: 400;
line-height: 50px;
}
// .consumer-brand {
// h2 {
// color: $consumer-primary;
@@ -381,15 +375,15 @@ button[type="submit"].single_add_to_cart_button,
.padding-top-large {
@include media-breakpoint-up(xs) {
padding-top: 0.75rem;
padding-top: 3rem;
}
@include media-breakpoint-up(md) {
padding-top: 1.5rem;
padding-top: 4rem;
}
@include media-breakpoint-up(lg) {
padding-top: 3rem;
padding-top: 6rem;
}
}
@@ -423,15 +417,15 @@ button[type="submit"].single_add_to_cart_button,
.padding-bottom-large {
@include media-breakpoint-up(xs) {
padding-bottom: 0.75rem;
padding-bottom: 3rem;
}
@include media-breakpoint-up(md) {
padding-bottom: 1.5rem;
padding-bottom: 4rem;
}
@include media-breakpoint-up(lg) {
padding-bottom: 3rem;
padding-bottom: 6rem;
}
}
@@ -460,17 +454,6 @@ button[type="submit"].single_add_to_cart_button,
}
}
.sonar-svg-left {
bottom: -165%;
left: 0;
overflow-x: hidden;
svg {
max-width: 300px;
width: 100%;
}
}
.f-white {
color: white;

View File

@@ -6,12 +6,19 @@
// }
// }
.business-brand {
.h2-heading-slice-container {
h2 {
color: $business-primary;
}
}
// .business-brand {
// .h2-heading-slice-container {
// h2 {
// color: $business-primary;
// }
// }
// }
h2 {
font-size: calc(1.4rem + 1vw);
font-weight: 400;
line-height: 50px;
}
.f-purple h2 {

View File

@@ -1,11 +1,11 @@
h4 {
font-size: 26px;
font-weight: 400;
line-height: 40px;
font-weight: bold;
line-height: 32px;
@include media-breakpoint-up(md) {
font-size: 32px;
}
// @include media-breakpoint-up(md) {
// font-size: 32px;
// }
}
.f-purple h4 {

View File

@@ -35,6 +35,12 @@
}
}
.main-logo img {
height: 30px;
width: 200px !important;
max-width: 200px !important;
}
.top-bar-items li {
position: relative;
align-self: center;
@@ -56,11 +62,6 @@
content: none;
}
.main-logo img {
height: 30px;
width: 200px;
}
@include media-breakpoint-up(lg) {
.menu-item-has-children::after {
content: "";

View File

@@ -43,18 +43,13 @@
margin-bottom: -85px;
}
.sonar-svg-3 {
display: none;
.radial {
bottom: -42%;
right: -18%;
}
@include media-breakpoint-up(md) {
.sonar-svg-3 {
display: block;
position: absolute;
bottom: -42%;
right: -18%;
overflow-x: hidden;
}
.pos {
margin-bottom: -175px;
@@ -70,10 +65,4 @@
width: 100%;
}
}
.sonar-svg {
bottom: -292px;
right: -200px;
overflow-x: hidden;
}

View File

@@ -1,4 +1,14 @@
.phone-contact-with-shortcode-slice-container {}
.phone-contact-with-shortcode-slice-container {
.radial-left {
top: -53px;
left: 0;
svg {
max-width: 300px;
}
}
}
// .consumer-brand {
// .call-title {

View File

@@ -1,3 +1,29 @@
.simple-content-slice-container {
overflow: hidden;
.radial {
right: 0;
top: 120px;
width: 100%;
max-width: 250px;
svg {
width: 100%;
max-width: 250px;
}
// @include media-breakpoint-up(xs) {
// top: -646px;
// }
// @include media-breakpoint-up(md) {
// top: -705px;
// }
// @include media-breakpoint-up(lg) {
// top: -745px;
// }
}
}

View File

@@ -1,12 +1,14 @@
.testimonial-slice-container {
margin-bottom: 5rem;
padding-bottom: 9rem;
.g-sky-border {
top: 20px;
@include media-breakpoint-up(lg) {
.g-sky-border {
margin-bottom: -73px;
}
}
.testimonial-img {
// border-radius: 50%;
width: 100%;
max-width: 300px;
max-height: 300px;
@@ -26,8 +28,9 @@
}
}
.sonar {
.radial {
right: 0;
top: 0;
top: -55px;
}
}

View File

@@ -5,6 +5,33 @@
.ratio {
max-width: 620px;
}
.radial-right-graphic {
top: 0;
right: -200px;
svg {
max-width: 1000px;
}
}
.radial-left-graphic {
top: 0;
left: -200px;
svg {
max-width: 1000px;
}
}
.radial-center-graphic {
top: 0;
left: 50%;
svg {
max-width: 1000px;
}
}
}