Files
landing_page/qdrant-landing/themes/qdrant-2024/assets/css/partials/_hybrid-cloud-partners.scss
T

80 lines
1.5 KiB
SCSS

@use 'sass:math';
@use '../helpers/functions' as *;
@use '../mixins/marquee' as marquee;
.hybrid-cloud-partners {
padding-top: $spacer * 4;
padding-bottom: $spacer * 4;
background-color: $neutral-94;
&__title {
margin: 0 auto $spacer * 2.5;
font-size: $spacer * 1.5;
line-height: pxToRem(34);
color: $neutral-20;
text-align: center;
}
&__content {
position: relative;
display: flex;
flex-direction: column;
gap: $spacer * 1.5;
padding: pxToRem(92) 0;
}
&__cards {
@include marquee.base(96px, 264px, 20, 20, 12px, $neutral-94, false, 50s, none);
&__container {
}
&__item {
display: flex;
align-items: center;
gap: $spacer;
padding: $spacer 0 $spacer $spacer;
background-color: $neutral-98;
border-radius: pxToRem(12);
img {
width: $spacer * 4;
height: $spacer * 4;
}
p {
margin-bottom: 0;
font-weight: bold;
}
}
}
&__square-grid-overlay {
display: block;
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: pxToRem(400);
background-image: url('/img/square-grid.png');
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
@include media-breakpoint-up(xl) {
padding-top: $spacer * 5;
padding-bottom: $spacer * 5;
&__title {
width: pxToRem(920);
font-size: $spacer * 2;
line-height: pxToRem(38);
}
&__square-grid-overlay {
background-size: contain;
}
}
}