ofco/medicalalert-web-reloaded
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

WIP

Browse Source
This commit is contained in:
Haley Bristol
2025-01-08 17:04:55 -08:00
parent 553e789bd6
commit ca58f24df3
23 changed files with 976 additions and 845 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
wp/wp-content/themes/medicalalert/src/scss/col2-circle-content.scss
View File

@@ -1,23 +1,35 @@
.col2-circle-content-slice-container {
.highlighted-circle {
img {
border-radius: 50%;
width: 225px;
height: 225px;
object-fit: cover;
.rounded-circle {
max-width: 260px;
margin: 0 auto;
@include media-breakpoint-up(md) {
margin-left: auto
}
}
.highlighted-circle-title {
color: $consumer-primary
img {
object-fit: cover;
width: 100%;
}
.highlighted-circle-title {
color: $consumer-primary;
h3 {
font-weight: bold;
}
}
.highlighted-circle-copy {
p {
line-height: 41px;
line-height: 32px;
}
}
.highlighted-circle-link {
a {
line-height: 41px;
line-height: 32px;
}
}
}

24
wp/wp-content/themes/medicalalert/src/scss/col2-circle-cta-list.scss
View File

@@ -1,14 +1,16 @@
.col2-circle-cta-list-slice-container {
.circle-image {
padding: 0 0 20px;
img {
width: 100%;
height: 100%;
border-radius: 50%;
.rounded-circle {
max-width: 460px;
margin-left: auto
}
img {
object-fit: cover;
width: 100%;
}
.title {
color: $consumer-primary;
padding-bottom: 10px;
}
}
.title {
color: $consumer-primary;
padding-bottom: 10px;
}
}

28
wp/wp-content/themes/medicalalert/src/scss/col2-media-highlights.scss
View File

@@ -1,25 +1,53 @@
.col2-media-highlights-slice-container {
svg {
max-width: 1500px;
}
.none-graphic {
display: none
}
.radial-left-graphic {
top: 0;
left: -200px;
}
.radial-right-graphic {
top: 50%;
right: -71%;
}
.radial-center-graphic {
top: -50%;
right: -30%;
}
.border-side-1 {
border-right: 1px solid black;
}
.border-side-3 {
border-left: 1px solid black;
}
.video-aside {
video {
width: 100%;
}
}
.copy {
strong {
font-weight: bold;
}
}
@include media-breakpoint-down(lg) {
.border-side-1 {
border-left: none;
border-bottom: 1px solid black;
}
.border-side-3 {
border-left: none;
border-bottom: 1px solid black;

34
wp/wp-content/themes/medicalalert/src/scss/col3-card.scss
View File

@@ -1,24 +1,24 @@
.col3-card-slice-container {
.radial {
.radial-top {
left: 0;
width: 250px;
top: 0;
svg {
width: 100%;
max-width: 250px;
max-width: 350px;
}
@include media-breakpoint-up(xs) {
top: -646px;
}
// @include media-breakpoint-up(xs) {
// top: -646px;
// }
@include media-breakpoint-up(md) {
top: -666px;
}
// @include media-breakpoint-up(md) {
// top: -666px;
// }
@include media-breakpoint-up(lg) {
top: -706px;
}
// @include media-breakpoint-up(lg) {
// top: -706px;
// }
}
.col3-card-wrapper {
@@ -26,8 +26,6 @@
.col3-card-item {
position: relative;
background-color: $white;
// min-height: 40em;
.col3-card-img {
width: 100%;
@@ -38,14 +36,6 @@
.col3-card-title {
color: $consumer-primary;
}
.col3-card-link {
position: absolute;
bottom: 0;
width: fit-content;
left: 50%;
transform: translate(-50%, -50%);
}
}
}
}

28
wp/wp-content/themes/medicalalert/src/scss/color-header-card-grid.scss
View File

@@ -4,6 +4,7 @@
width: 100%;
height: 100px;
}
.copy {
min-height: 17rem;
}
@@ -12,6 +13,7 @@
.header-color-white {
background-color: $white;
h4 {
color: $light-gray;
}
@@ -19,6 +21,7 @@
.header-color-gray {
background-color: $gray;
h4 {
color: $light-gray;
}
@@ -26,6 +29,7 @@
.header-color-red {
background-color: $consumer-primary;
h4 {
color: $white;
}
@@ -33,6 +37,7 @@
.header-color-light-blue {
background-color: $light-blue;
h4 {
color: $light-gray;
}
@@ -40,6 +45,29 @@
.header-color-blue {
background-color: $business-primary;
h4 {
color: $white;
}
}
// .border-color-purple-gradient {
// background: linear-gradient(to left top, rgba(0, 0, 102, 1) 0%, rgba(126, 91, 239, 1) 100%);
// }
.header-color-navy-purple {
background: linear-gradient(90deg, rgba(0, 0, 102, 1) 0%, rgba(126, 91, 239, 1) 100%);
padding: 5px;
position: relative;
width: fit-content;
margin: 0 auto;
border-radius: 25px;
.copy {
border-bottom-right-radius: 19px;
border-bottom-left-radius: 19px;
}
h4 {
color: $white;
}

3
wp/wp-content/themes/medicalalert/src/scss/faq-dropdown.scss
View File

@@ -21,9 +21,6 @@
font-weight: 700;
padding: 1.3rem 0;
line-height: normal;
// &::after {
// filter: invert(1) grayscale(1);
// }
}
.accordion-body {

174
wp/wp-content/themes/medicalalert/src/scss/global.scss
View File

@@ -20,7 +20,11 @@ body {
}
.overflow-hidden {
overflow: hidden
overflow: hidden;
}
.overflow-x-hidden {
overflow-x: hidden;
}
.z-0 {
@@ -130,31 +134,16 @@ input[type="submit"].gform_button,
button[type="submit"].single_add_to_cart_button,
#searchBtn {
border: none;
padding: 14px;
padding: 10px 36px;
background-color: $orange !important;
color: $white !important;
font-size: 20px;
font-size: 16px;
font-weight: 600;
text-decoration: none;
box-sizing: border-box;
display: inline-block;
line-height: 20.21px;
border-radius: 10px;
}
.button--primary {
border: none;
padding: 8px 20px;
background-color: $orange;
/* Define the actual color, not a variable */
color: $white;
/* Define the actual color, not a variable */
font-size: 25px;
font-weight: 600;
text-decoration: none;
display: inline-block;
line-height: 36px;
/* Add any additional styles you want here */
border-radius: 8px;
}
// Background Colors Configurations
@@ -359,34 +348,6 @@ button[type="submit"].single_add_to_cart_button,
}
}
.padding-top-medium {
@include media-breakpoint-up(xs) {
padding-top: .75rem;
}
@include media-breakpoint-up(md) {
padding-top: 1rem;
}
@include media-breakpoint-up(md) {
padding-top: 2rem;
}
}
.padding-top-large {
@include media-breakpoint-up(xs) {
padding-top: 3rem;
}
@include media-breakpoint-up(md) {
padding-top: 4rem;
}
@include media-breakpoint-up(lg) {
padding-top: 6rem;
}
}
.padding-bottom-small {
@include media-breakpoint-up(xs) {
padding-bottom: 0.25rem;
@@ -401,18 +362,46 @@ button[type="submit"].single_add_to_cart_button,
}
}
.padding-bottom-medium {
.padding-top-medium {
@include media-breakpoint-up(xs) {
padding-bottom: .75rem;
padding-top: 1rem;
}
@include media-breakpoint-up(md) {
padding-bottom: 1rem;
padding-top: 2rem;
}
@include media-breakpoint-up(lg) {
padding-top: 3rem;
}
}
.padding-bottom-medium {
@include media-breakpoint-up(xs) {
padding-bottom: 1rem;
}
@include media-breakpoint-up(md) {
padding-bottom: 2rem;
}
@include media-breakpoint-up(lg) {
padding-bottom: 3rem;
}
}
.padding-top-large {
@include media-breakpoint-up(xs) {
padding-top: 3rem;
}
@include media-breakpoint-up(md) {
padding-top: 4rem;
}
@include media-breakpoint-up(lg) {
padding-top: 6rem;
}
}
.padding-bottom-large {
@@ -516,31 +505,60 @@ button[type="submit"].single_add_to_cart_button,
background: $ma-red;
}
.btn {
border-radius: 0.5rem;
padding: 0.4rem 2rem;
font-weight: bold;
}
.btn-red {
background: $ma-red;
color: white;
font-weight: bold;
padding: .5em 3em;
border-radius: 10px;
// font-weight: bold;
// padding: .5em 3em;
// border-radius: 10px;
}
.bg-sky {
.btn-outline-primary {
color: $ma-sky;
border-color: $ma-sky;
background: white;
}
.btn-check:checked+.btn-outline-primary,
.btn-check:active+.btn-outline-primary,
.btn-outline-primary:hover,
.btn-outline-primary:active,
.btn-outline-primary.active,
.btn-outline-primary.dropdown-toggle.show {
color: $ma-sky;
border-color: $ma-sky;
background: #EBF5FF;
}
.btn-check:focus+.btn-outline-primary,
.btn-outline-primary:focus {
box-shadow: 0 0 0 0.25rem rgba(153, 173, 237, 0.5);
}
.bg-sky {
background: $ma-sky;
}
.bg-purple {
color: $ma-purple;
background: $ma-purple;
}
.bg-yellow {
color: $ma-yellow;
background: $ma-yellow;
}
.bg-green {
color: $ma-green;
background: $ma-green;
}
.g-navy-sky {
.bg-color-navy-sky {
background: linear-gradient(90deg, rgba(0, 0, 102, 1) 0%, rgba(51, 153, 255, 1) 100%);
}
@@ -584,6 +602,19 @@ button[type="submit"].single_add_to_cart_button,
.bg-color-navy-purple {
background: linear-gradient(90deg, rgba(0, 0, 102, 1) 0%, rgba(126, 91, 239, 1) 100%);
color: white;
li {
color: white;
}
p {
color: white;
}
a {
color: white;
}
}
.bg-color-red-yellow {
@@ -594,12 +625,22 @@ button[type="submit"].single_add_to_cart_button,
border-radius: 20px;
background: linear-gradient(to left top, rgba(51, 153, 255, .1) 0%, rgba(51, 153, 255, 0.5) 100%);
padding: 5px;
color: white;
img {
border-radius: 17px;
}
}
ul,
ol {
line-height: 30px !important;
li {
margin-bottom: 6px;
}
}
.mw-250 {
max-width: 250px;
}
@@ -616,6 +657,14 @@ button[type="submit"].single_add_to_cart_button,
}
}
.border-color-purple-gradient {
background: linear-gradient(to left top, rgba(0, 0, 102, 1) 0%, rgba(126, 91, 239, 1) 100%);
padding: 5px;
position: relative;
width: fit-content;
margin: 0 auto;
}
.fs-xs {
font-size: 14px;
@@ -623,4 +672,13 @@ button[type="submit"].single_add_to_cart_button,
font-size: 14px;
line-height: 19px;
}
}
.fs-sm {
font-size: 16px;
p {
font-size: 16px;
line-height: 26px;
}
}

16
wp/wp-content/themes/medicalalert/src/scss/hero.scss
View File

@@ -29,12 +29,16 @@
max-width: 500px;
}
.tile-2 {
right: 2%;
bottom: -6%;
width: 160px;
.tile-1-3-grid {
max-width: 250px;
}
// .tile-2 {
// right: 2%;
// bottom: -6%;
// width: 160px;
// }
.tile-square {
max-width: 250px;
}
@@ -44,8 +48,8 @@
}
.radial {
bottom: -42%;
right: -18%;
bottom: -65%;
right: 0%;
}
@include media-breakpoint-up(md) {

20
wp/wp-content/themes/medicalalert/src/scss/video-copy.scss
View File

@@ -7,31 +7,27 @@
max-width: 620px;
}
svg {
max-width: 1000px;
}
.none-graphic {
display: none
}
.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;
}
}
}