mirror of
https://github.com/qdrant/landing_page.git
synced 2026-10-01 17:08:30 +02:00
copy cta-banner from another branch
This commit is contained in:
trean
@@ -1,6 +1,9 @@
|
||||
---
|
||||
title: Engines Ready. Awaiting Your Command.
|
||||
subtitle: Cloud Quickstart - spin up a cluster in seconds.
|
||||
illustration:
|
||||
src: /img/hr-tech/cta-illustration.webp
|
||||
alt: "Rocket flying over the globe"
|
||||
button:
|
||||
text: Start Building for Free
|
||||
url: https://cloud.qdrant.io
|
||||
|
||||
@@ -8,6 +8,5 @@
|
||||
@import 'qdrant-pricing-features';
|
||||
@import 'qdrant-pricing-faq';
|
||||
@import 'qdrant-pricing-comparison';
|
||||
@import 'qdrant-pricing-cta';
|
||||
@import 'qdrant-pricing-get-contacted';
|
||||
@import 'pricing-door';
|
||||
|
||||
-130
@@ -1,130 +0,0 @@
|
||||
@use '../../helpers/functions' as *;
|
||||
|
||||
.qdrant-pricing-cta {
|
||||
position: relative;
|
||||
padding: $spacer * 7.5 0 $spacer * 7;
|
||||
background-color: $neutral-10;
|
||||
overflow: hidden;
|
||||
|
||||
&__background {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
&__stars {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background-image: url('/img/backgrounds/stars-bg.svg');
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
&__globe {
|
||||
position: absolute;
|
||||
top: pxToRem(-50);
|
||||
right: pxToRem(-200);
|
||||
width: pxToRem(800);
|
||||
height: pxToRem(800);
|
||||
background-image: url('/img/backgrounds/globe-grid.svg');
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: contain;
|
||||
opacity: 0.4;
|
||||
}
|
||||
|
||||
&__content {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
max-width: pxToRem(500);
|
||||
}
|
||||
|
||||
&__title {
|
||||
margin-bottom: $spacer;
|
||||
font-size: pxToRem(40);
|
||||
font-weight: 600;
|
||||
line-height: 1.2;
|
||||
color: $neutral-100;
|
||||
}
|
||||
|
||||
&__subtitle {
|
||||
margin-bottom: $spacer * 2;
|
||||
font-size: pxToRem(18);
|
||||
line-height: 1.5;
|
||||
color: $neutral-80;
|
||||
}
|
||||
|
||||
&__button {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: $spacer * 0.5;
|
||||
|
||||
svg {
|
||||
transition: transform 0.2s ease;
|
||||
}
|
||||
|
||||
&:hover svg {
|
||||
transform: translateX(4px);
|
||||
}
|
||||
}
|
||||
|
||||
@include media-breakpoint-down(lg) {
|
||||
padding: $spacer * 5 0;
|
||||
|
||||
&__title {
|
||||
font-size: pxToRem(32);
|
||||
}
|
||||
|
||||
&__subtitle {
|
||||
font-size: pxToRem(16);
|
||||
}
|
||||
|
||||
&__globe {
|
||||
right: pxToRem(-300);
|
||||
width: pxToRem(600);
|
||||
height: pxToRem(600);
|
||||
}
|
||||
}
|
||||
|
||||
@include media-breakpoint-down(md) {
|
||||
padding: $spacer * 5 0 $spacer * 3;
|
||||
text-align: center;
|
||||
|
||||
&__content {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
&__title {
|
||||
font-size: pxToRem(36);
|
||||
line-height: 1.15;
|
||||
}
|
||||
|
||||
&__subtitle {
|
||||
font-size: pxToRem(16);
|
||||
margin-bottom: $spacer * 1.5;
|
||||
}
|
||||
|
||||
&__button {
|
||||
width: 100%;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
&__globe {
|
||||
position: relative;
|
||||
top: auto;
|
||||
right: auto;
|
||||
width: 100%;
|
||||
height: pxToRem(300);
|
||||
margin-top: $spacer * 3;
|
||||
opacity: 0.3;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,26 +0,0 @@
|
||||
<section class="qdrant-pricing-cta">
|
||||
<div class="qdrant-pricing-cta__background">
|
||||
<div class="qdrant-pricing-cta__stars"></div>
|
||||
<div class="qdrant-pricing-cta__globe"></div>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="qdrant-pricing-cta__content">
|
||||
<h2 class="qdrant-pricing-cta__title">{{ .Params.title }}</h2>
|
||||
<p class="qdrant-pricing-cta__subtitle">{{ .Params.subtitle }}</p>
|
||||
{{ with .Params.button }}
|
||||
<a href="{{ .url }}" class="button button_contained button_lg qdrant-pricing-cta__button">
|
||||
{{ .text }}
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M4.16669 10H15.8334M15.8334 10L10 4.16666M15.8334 10L10 15.8333"
|
||||
stroke="currentColor"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
/>
|
||||
</svg>
|
||||
</a>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@@ -18,7 +18,7 @@
|
||||
{{ end }}
|
||||
|
||||
{{ with (.Site.GetPage "/pricing/qdrant-pricing-cta") }}
|
||||
{{ partial "pricing/qdrant-pricing-cta" . }}
|
||||
{{ partial "cta-banner" . }}
|
||||
{{ end }}
|
||||
|
||||
{{ end }}
|
||||
|
||||
@@ -10,7 +10,7 @@
|
||||
{{ end }}
|
||||
|
||||
{{ with (.Site.GetPage "/pricing/qdrant-pricing-cta") }}
|
||||
{{ partial "pricing/qdrant-pricing-cta" . }}
|
||||
{{ partial "cta-banner" . }}
|
||||
{{ end }}
|
||||
|
||||
{{ end }}
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 89 KiB |
Reference in New Issue
Block a user