Files
Gainsight/customer_templates/Menlo_Security/_section_featured_customers.html.liquid
Norm Rasmussen 26beb4c7f2 new directory
2022-02-23 13:18:41 -05:00

96 lines
2.9 KiB
Plaintext

<div class="np-homepage-featured np-homepage-featured-items np-max-width">
<div class="np-homepage-featured-text">
<div class="np-homepage-headline">
Featured Customers
</div>
</div>
<div class="featured-photography-carousel np-carousel np-carousel-bg-blue" id="featured-photography-carousel">
<div class="np-carousel-card">
<div>
<img src="https://s3.amazonaws.com/static.northpass.com/demos/jpmorgan-chase-logo-2000.jpg" alt="Featured Photography" class='customer-carousel-image'/>
<div class="slide-label">JP Morgan & Chase</div>
</div>
</div>
<div class="np-carousel-card">
<div>
<img src="https://s3.amazonaws.com/static.northpass.com/demos/AON-logo.png" alt="Featured Photography" class='customer-carousel-image'/>
<div class="slide-label">AON</div>
</div>
</div>
<div class="np-carousel-card">
<div>
<img src="https://s3.amazonaws.com/static.northpass.com/demos/faurecia-vector-logo.png" alt="Featured Photography" class='customer-carousel-image'/>
<div class="slide-label">Faurecia</div>
</div>
</div>
<div class="np-carousel-card">
<div>
<img src="https://s3.amazonaws.com/static.northpass.com/demos/hsbc-old-logo.png" alt="Featured Photography" class='customer-carousel-image'/>
<div class="slide-label">HSBC</div>
</div>
</div>
<div class="np-carousel-card">
<div>
<img src="https://s3.amazonaws.com/static.northpass.com/demos/sandia-labs-logo.jpg" alt="Featured Photography" class='customer-carousel-image'/>
<div class="slide-label">Sandia National Laboratories</div>
</div>
</div>
</div>
</div>
<script>
$(document).ready(function(){
$("#featured-photography-carousel").slick({
slidesToShow: 3.5,
prevArrow: '<i class="fal fa-chevron-left"></i>',
nextArrow: '<i class="fal fa-chevron-right"></i>',
infinite: false,
responsive: [
{
breakpoint: 1350,
settings: {
slidesToShow: 2.3,
}
},
{
breakpoint: 1024,
settings: {
slidesToShow: 2,
}
},
{
breakpoint: 768,
settings: {
slidesToShow: 1,
}
}
]
});
});
</script>
<style>
.featured-photography-carousel .fa-chevron-right::before {
right: -6px !important;
}
.customer-carousel-image {
width: 225px;
height: 225px;
object-fit: contain;
align-content: center;
}
.slick-track .np-carousel-card {
margin-right: -105px;
}
.featured-photography-carousel .slick-initialized .slick-slide {
margin: 0 1px 1px 0;
}
</style>