diff --git a/qdrant-landing/content/e-commerce/hero.md b/qdrant-landing/content/e-commerce/hero.md index 82fa0a3d3..b6e522fb1 100644 --- a/qdrant-landing/content/e-commerce/hero.md +++ b/qdrant-landing/content/e-commerce/hero.md @@ -4,7 +4,7 @@ tag: icon: src: /icons/outline/cart-teal.svg alt: Shopping Cart -title: AI-Powered Vector Search for Smarter Shopping & Personalized E-Commerce +title: AI-Powered Vector Search for Smarter Shopping & Personalized E-Commerce description: Drive conversions with AI-powered vector search that delivers hyper-relevant product discovery, personalized recommendations, and fraud detection—all powered by Qdrant’s enterprise-grade vector search. startFree: text: Get Started diff --git a/qdrant-landing/static/img/e-commerce-hero.png b/qdrant-landing/static/img/e-commerce-hero.png new file mode 100644 index 000000000..650e6516d Binary files /dev/null and b/qdrant-landing/static/img/e-commerce-hero.png differ diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/partials/_legal-tech-hero.scss b/qdrant-landing/themes/qdrant-2024/assets/css/partials/_legal-tech-hero.scss index 46493f7a0..5fde2d84b 100644 --- a/qdrant-landing/themes/qdrant-2024/assets/css/partials/_legal-tech-hero.scss +++ b/qdrant-landing/themes/qdrant-2024/assets/css/partials/_legal-tech-hero.scss @@ -69,9 +69,13 @@ img { position: relative; + z-index: 1; display: block; width: 100%; - max-width: pxToRem(560); + max-width: pxToRem(395); + height: auto; + object-fit: contain; + object-position: right top; margin-right: -$spacer * 1.5; margin-bottom: -$spacer * 1.5; } @@ -81,6 +85,10 @@ padding-top: $spacer * 5; padding-bottom: $spacer * 5; + &__content { + max-width: pxToRem(560); + } + &__title { font-size: $spacer * 3; line-height: pxToRem(58); @@ -93,29 +101,36 @@ &-square-grid { display: block; position: absolute; - width: pxToRem(686); - height: pxToRem(480); - right: -24%; - top: -3%; + width: min(100%, pxToRem(686)); + aspect-ratio: 800 / 560; + right: 0; + top: -$spacer * 1.5; background-image: url('/img/legal-tech-hero-grid.svg'); - background-size: 100%; + background-size: cover; background-position: center; background-repeat: no-repeat; z-index: 0; } img { - width: 110%; + width: 100%; + max-width: pxToRem(395); + height: auto; + object-fit: contain; + object-position: right top; } } } @include media-breakpoint-up(xl) { + &__content { + max-width: pxToRem(634); + } + &__preview { &-square-grid { - width: pxToRem(800); - height: pxToRem(560); - top: -5%; + width: min(100%, pxToRem(800)); + aspect-ratio: 1 / 1; } } } diff --git a/qdrant-landing/themes/qdrant-2024/layouts/partials/legal-tech-hero.html b/qdrant-landing/themes/qdrant-2024/layouts/partials/legal-tech-hero.html index aa0ecb9ab..153e10739 100644 --- a/qdrant-landing/themes/qdrant-2024/layouts/partials/legal-tech-hero.html +++ b/qdrant-landing/themes/qdrant-2024/layouts/partials/legal-tech-hero.html @@ -1,7 +1,7 @@