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-09 12:14:35 -08:00
parent baf728b22b
commit d0c66fdbfb
8 changed files with 147 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
wp/wp-content/themes/medicalalert/dist/app.css vendored
View File

@@ -11591,9 +11591,18 @@ button[type=submit].single_add_to_cart_button,
.f-white {
color: white;
}
.f-white:hover {
color: white !important;
}
.f-white p {
color: white;
}
.f-white a {
color: white;
}
.f-white a:hover {
color: white !important;
}
.f-black {
color: #110F24;
@@ -12327,9 +12336,9 @@ body {
grid-template-rows: 1fr auto 1fr;
width: 100%;
}
.icon-info-grid-slice-container .icon-card-wrapper .icon-card .icon-img {
max-width: 50px;
height: 50px;
.icon-info-grid-slice-container .icon-card-wrapper .icon-card .icon-img img {
max-width: 37px;
height: auto;
}
.consumer-brand .icon-info-grid-slice-container .icon-card .title {
@@ -12427,8 +12436,29 @@ body {
max-width: 300px;
}
.product-carousel-slice-container .slick-prev:before,
.product-carousel-slice-container .slick-next:before {
opacity: 0;
}
.product-carousel-slice-container .slick-dots {
bottom: -3px;
left: -112px;
}
.product-carousel-slice-container .slick-dots li button {
padding: 0;
}
.product-carousel-slice-container .slick-dots li button::before {
font-size: 12px;
color: white;
opacity: 0.9;
}
.product-carousel-slice-container .slick-dots .slick-active button::before {
color: #507CFF;
}
.product-carousel-slice-container .products .product-slide .product-image img {
width: 100%;
background: white;
border-radius: 16px;
}
.product-carousel-slice-container .products .product-slide .title {
color: #036396;

2
wp/wp-content/themes/medicalalert/dist/mix-manifest.json vendored
View File

@@ -1,4 +1,4 @@
{
"/app.js": "/app.js?id=def087bfee86b3ced20472c4fd21ee05",
"/app.css": "/app.css?id=273836cfd783ff85befd47a49c8f0d58"
"/app.css": "/app.css?id=761e43848c928eae130fd5702a51fe19"
}

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

@@ -446,9 +446,22 @@ button[type="submit"].single_add_to_cart_button,
.f-white {
color: white;
&:hover {
color: white !important;
}
p {
color: white;
}
a {
color: white;
&:hover {
color: white !important;
}
}
}
.f-black {

6
wp/wp-content/themes/medicalalert/src/scss/icon-info-grid.scss
View File

@@ -5,9 +5,9 @@
grid-template-rows: 1fr auto 1fr;
width: 100%;
.icon-img {
max-width: 50px;
height: 50px;
.icon-img img {
max-width: 37px;
height: auto;
}
}

56
wp/wp-content/themes/medicalalert/src/scss/product-carousel.scss
View File

@@ -1,14 +1,48 @@
.product-carousel-slice-container {
.products {
.product-slide {
.product-image {
img {
width: 100%;
}
}
.title {
color: $blue;
}
.slick-prev:before,
.slick-next:before {
opacity: 0;
}
.slick-dots {
bottom: -3px;
left: -112px;
li {
button {
padding: 0;
&::before {
font-size: 12px;
color: white;
opacity: .9;
}
}
}
.slick-active button::before {
color: #507CFF;
}
}
.products {
.product-slide {
.g-sky-border {
// position: absolute;
}
.product-image {
img {
width: 100%;
background: white;
border-radius: 16px;
}
}
.title {
color: $blue;
}
}
}
}
}

12
wp/wp-content/themes/medicalalert/tpl/image_aside.tpl
View File

@@ -1,15 +1,17 @@
<!-- Image Aside BEGIN -->
<section class="image-aside-slice-container bg-color-{{background_color}} padding-top-{{padding_top}} padding-bottom-{{padding_bottom}}">
<div class="container">
<div class="row row-cols-2 gx-4">
<div class="col-12 col-md-6 my-auto py-3 order-lg-{{alignment}}">
<div class="row gx-4">
<div class="col-12 col-md-6 my-3 order-lg-{{alignment}}">
<div class="g-sky-border">
<img class="img-fluid image-aside-img" src="{{image.url}}" alt="{{image.alt}}">
</div>
</div>
<div class="col-12 col-md-6 my-auto py-3">
<div class="image-aside-copy">
{{{copy}}}
<div class="col-12 col-md-6 my-3">
<div class="d-flex align-items-center h-100">
<div class="image-aside-copy">
{{{copy}}}
</div>
</div>
</div>
</div>

3
wp/wp-content/themes/medicalalert/tpl/phone_contact_with_shortcode.tpl
View File

@@ -1,6 +1,5 @@
<!-- Phone Contact with Shortcode BEGIN -->
<section class="phone-contact-with-shortcode-slice-container bg-color-sky-red p-relative">
<section class="phone-contact-with-shortcode-slice-container bg-color-sky-red p-relative overflow-hidden">
<div class="p-absolute radial-left">
<svg class="w-100" width="424" height="565" viewBox="0 0 424 565" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_252_447)">

86
wp/wp-content/themes/medicalalert/tpl/product_carousel.tpl
View File

@@ -1,50 +1,52 @@
<!-- Product Carousel BEGIN -->
<section class="product-carousel-slice-container bg-color-{{background_color}} padding-top-{{padding_top}} padding-bottom-{{padding_bottom}}">
<div class="container">
<div class="row justify-content-center">
<div class="col-10">
<div class="products">
{{#each product_slides}}
<div class="product-slide">
<div class="row row-cols-1 row-cols-lg-2 justify-content-center gx-4">
<div class="col-8 col-lg-4">
<div class="product-image">
<img class="p-3" src="{{image.url}}" alt="{{image.alt}}">
</div>
<div class="container">
<div class="row justify-content-center rounded bg-color-gradient-light-blue">
<div class="col-10">
<div class="products">
{{#each product_slides}}
<div class="product-slide">
<div class="row row-cols-1 row-cols-lg-2 justify-content-center gx-4">
<div class="col-8 col-lg-4 p-relative mt-4">
<div class="g-sky-border">
<div class="product-image">
<img class="p-3" src="{{image.url}}" alt="{{image.alt}}">
</div>
</div>
</div>
<div class="col col-lg-8 my-auto text-center text-lg-start">
<div class="title mt-4 mt-lg-0 mb-2">
<h4>{{title}}</h4>
</div>
<div class="copy mb-3">
<p>{{copy}}</p>
</div>
<div class="link">
{{#if link}}
<a class="button--primary" href="{{link.url}}">{{link.title}}</a>
{{/if}}
</div>
</div>
</div>
</div>
{{/each}}
</div>
<div class="col col-lg-8 my-auto text-center text-lg-start">
<div class="title mt-4 mt-lg-0 mb-4">
<h3>{{title}}</h3>
</div>
<div class="copy mb-4">
<p>{{copy}}</p>
</div>
<div class="link mb-4">
{{#if link}}
<a class="button--primary" href="{{link.url}}">{{link.title}}</a>
{{/if}}
</div>
</div>
</div>
</div>
{{/each}}
</div>
</div>
</div>
</div>
<!-- Slick Carousel -->
<script type="text/javascript">
$(window).on('load', function(){
$('.products').slick({
slidesToShow: 1,
slidesToScroll: 1,
arrows: false,
dots: true,
autoplay: true,
arrows: true,
});
});
</script>
<!-- Slick Carousel -->
<script type="text/javascript">
$(window).on('load', function () {
$('.products').slick({
slidesToShow: 1,
slidesToScroll: 1,
arrows: false,
dots: true,
autoplay: true,
arrows: true,
});
});
</script>
</section>
<!-- Product Carousel END -->
<!-- Product Carousel END -->