mirror of
https://github.com/qdrant/landing_page.git
synced 2026-10-04 02:18:29 +02:00
Edge page update (#2143)
* edge page update Co-authored-by: Cursor <cursoragent@cursor.com> * refactoring and renaming (#2145) * rename edge-beta to edge in file names and style classes, moved some files to improve files organization * audit fix * fix paths * fixes * add a button to scroll to the form --------- Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
trean
@@ -1,35 +0,0 @@
|
||||
---
|
||||
title: Real-time vector retrieval for Edge AI in resource-constrained environments
|
||||
features:
|
||||
- id: 0
|
||||
image:
|
||||
src: /img/edge-beta-features/native-vector.svg
|
||||
alt: Native Vector Search
|
||||
title: Native Vector Search for Embedded & Edge AI
|
||||
description: Runs as a lightweight, in-process library. No background threads, no services - ideal for mobile, robotic, and embedded environments.
|
||||
- id: 1
|
||||
image:
|
||||
src: /img/edge-beta-features/optimized-for-low-memory.svg
|
||||
alt: Low-Memory
|
||||
title: Optimized for Low-Memory, Low-Compute Devices
|
||||
description: Dramatically Designed for resource-constrained hardware. No idle overhead, no runtime daemons. Fits into tightly scoped edge deployments. memory usage with built-in compression options and offload data to disk.
|
||||
- id: 2
|
||||
image:
|
||||
src: /img/edge-beta-features/local-by-default.svg
|
||||
alt: Local by Default
|
||||
title: Local by Default, Cloud-Connected When Needed
|
||||
description: Retrieval runs fully offline. Sync with Qdrant Cloud only when required - for data transfer, tenant promotion, or coordination at scale.
|
||||
- id: 3
|
||||
image:
|
||||
src: /img/edge-beta-features/hybrid-and-multimodal-search.svg
|
||||
alt: Hybrid & Multimodal Search
|
||||
title: Hybrid & Multimodal Search On-Device
|
||||
description: Supports dense and multimodal vectors with structured filtering. Enables real-time retrieval from text, image, audio, or sensor-derived embeddings.
|
||||
- id: 4
|
||||
image:
|
||||
src: /img/edge-beta-features/multitenancy-built.svg
|
||||
alt: Multitenancy Built
|
||||
title: Edge-Scale Multitenancy with Native SDKs
|
||||
description: Supports payload- and shard-based tenant isolation. Routes queries across uneven edge workloads. Native SDKs in Java (Android), Swift (Apple), and more.
|
||||
sitemapExclude: true
|
||||
---
|
||||
@@ -1,29 +0,0 @@
|
||||
---
|
||||
title: Purpose-Built for On-Device AI Workloads
|
||||
cards:
|
||||
- id: 0
|
||||
icon:
|
||||
src: /img/edge-beta-vectors/icon1.svg
|
||||
alt: Robotics & Autonomy
|
||||
title: Robotics & Autonomy
|
||||
description: Run multimodal retrieval from onboard sensors (like LiDAR, radar, and cameras) for real-time navigation and decision-making.
|
||||
- id: 1
|
||||
icon:
|
||||
src: /img/edge-beta-vectors/icon2.svg
|
||||
alt: Offline Voice Assistants
|
||||
title: Offline Voice Assistants
|
||||
description: Power local memory for privacy-first assistants on mobile or embedded hardware, without relying on a persistent connection.
|
||||
- id: 2
|
||||
icon:
|
||||
src: /img/edge-beta-vectors/icon3.svg
|
||||
alt: Smart Retail & Kiosks
|
||||
title: Smart Retail & Kiosks
|
||||
description: Enable product similarity and anomaly detection on edge terminals with limited or intermittent connectivity.
|
||||
- id: 3
|
||||
icon:
|
||||
src: /img/edge-beta-vectors/icon4.svg
|
||||
alt: Industrial IoT
|
||||
title: Industrial IoT
|
||||
description: Perform local retrieval and diagnostics from sensor-derived embeddings in air-gapped or bandwidth-constrained environments.
|
||||
sitemapExclude: true
|
||||
---
|
||||
@@ -0,0 +1,18 @@
|
||||
---
|
||||
title: Offline Visual Memory for Smart Glasses
|
||||
label:
|
||||
title: Demo
|
||||
icon:
|
||||
src: /icons/outline/play.svg
|
||||
alt: Demo
|
||||
description: This GitHub demo showcases a proof-of-concept for smart glasses that can remember what they see and help you find objects, like your keys, even when fully offline. It runs Qdrant Edge directly on the device, using a vision-language model to convert video frames into vectors for fast, local search while skipping redundant frames to stay efficient.
|
||||
description2: See how vector search can bring memory-like capabilities to resource-constrained hardware at the edge.
|
||||
cta:
|
||||
text: View in GitHub
|
||||
url: https://github.com/qdrant/qdrant-edge-demo
|
||||
target: "_blank"
|
||||
image:
|
||||
src: /img/edge/demo-visual.png
|
||||
alt: Offline Visual Memory for Smart Glasses
|
||||
sitemapExclude: true
|
||||
---
|
||||
-3
@@ -9,9 +9,6 @@ questions:
|
||||
answer: Yes. Read the <a href="https://qdrant.tech/documentation/edge/edge-quickstart/">Quick Start guide</a>,
|
||||
and view the <a href="https://github.com/qdrant/qdrant-edge-demo">demo</a> on GitHub.
|
||||
- id: 2
|
||||
question: What are the minimum requirements to join the beta?
|
||||
answer: You should have a clear use case for on-device or offline vector search. Preference is given to companies working with embedded hardware or deploying agents at the edge.
|
||||
- id: 3
|
||||
question: How do I get access?
|
||||
answer: If you're building edge-native or embedded AI systems, apply to join the beta. Or, read the <a href="https://qdrant.tech/documentation/edge/edge-quickstart/">Quick Start guide</a>, and view the <a href="https://github.com/qdrant/qdrant-edge-demo">demo</a> on GitHub
|
||||
sitemapExclude: true
|
||||
@@ -0,0 +1,35 @@
|
||||
---
|
||||
title: Real-time vector retrieval for Edge AI in resource-constrained environments
|
||||
features:
|
||||
- id: 0
|
||||
image:
|
||||
src: /img/edge-beta-features/native-vector.svg
|
||||
alt: Native Vector Search
|
||||
title: Native Vector Search for Embedded & Edge AI
|
||||
description: Run in-memory, disk-backed, and hybrid vector search on the edge. Deploy on mobile devices, IoT gateways, industrial PCs, drones, and more.
|
||||
- id: 1
|
||||
image:
|
||||
src: /img/edge-beta-features/optimized-for-low-memory.svg
|
||||
alt: Low-Memory
|
||||
title: Optimized for Low Memory & Low Compute Devices
|
||||
description: Optimized for resource-constrained environments with a small memory footprint and efficient CPU/GPU utilization to ensure smooth performance on edge devices.
|
||||
- id: 2
|
||||
image:
|
||||
src: /img/edge-beta-features/local-by-default.svg
|
||||
alt: Local by Default
|
||||
title: Local-first, Cloud-Connected When Needed
|
||||
description: Perform vector search locally with fallback to cloud for more complex queries or when more compute is needed to train your AI model.
|
||||
- id: 3
|
||||
image:
|
||||
src: /img/edge-beta-features/hybrid-and-multimodal-search.svg
|
||||
alt: Hybrid & Multimodal Search
|
||||
title: Hybrid & Multi-modal Search On Device
|
||||
description: Support for various data types, including text, images, audio, and more. Combine multiple modalities for more accurate and context-aware results.
|
||||
- id: 4
|
||||
image:
|
||||
src: /img/edge-beta-features/multitenancy-built.svg
|
||||
alt: Multitenancy Built
|
||||
title: Multitenancy Built for Edge Scale
|
||||
description: Designed to manage multiple tenants, users, or applications on a single edge device. Isolate data and control access for secure and scalable deployments.
|
||||
sitemapExclude: true
|
||||
---
|
||||
+2
-2
@@ -1,6 +1,6 @@
|
||||
---
|
||||
title: Apply to Join the Beta
|
||||
description: Beta available to selected teams building embedded or edge-native AI systems.
|
||||
title: Submit Your Interest or Project
|
||||
description: Fill out the form to stay updated about Qdrant Edge news, or let us know about your project.
|
||||
form:
|
||||
id: edge-beta-form
|
||||
hubspotFormOptions: '{
|
||||
+4
-1
@@ -8,7 +8,10 @@ label:
|
||||
subtitle: Run Vector Search Inside Embedded and Edge AI Systems
|
||||
description: Qdrant Edge is a lightweight, in-process vector search engine designed for embedded devices, autonomous systems, and mobile agents. It enables on-device retrieval with minimal memory footprint, no background services, and optional synchronization with Qdrant Cloud.
|
||||
startFree:
|
||||
text: Join the Beta
|
||||
text: Read Quick Start Docs
|
||||
url: /documentation/edge/edge-quickstart/
|
||||
contactUs:
|
||||
text: Contact Us
|
||||
url: "#form"
|
||||
image:
|
||||
src: /img/qdrant-edge-scheme.svg
|
||||
@@ -0,0 +1,29 @@
|
||||
---
|
||||
title: Purpose-Built for On-Device AI Workloads
|
||||
cards:
|
||||
- id: 0
|
||||
icon:
|
||||
src: /img/edge-beta-vectors/icon1.svg
|
||||
alt: Robotics & Autonomy
|
||||
title: Robotics & Autonomy
|
||||
description: Run real-time vector search to enable robots to make faster, more informed decisions for object recognition, navigation, and more.
|
||||
- id: 1
|
||||
icon:
|
||||
src: /img/edge-beta-vectors/icon2.svg
|
||||
alt: Offline Voice Assistants
|
||||
title: Offline Voice Assistants
|
||||
description: Provide fast, accurate, and private voice search for devices without an internet connection, such as smart speakers, wearables, and more.
|
||||
- id: 2
|
||||
icon:
|
||||
src: /img/edge-beta-vectors/icon3.svg
|
||||
alt: Smart Retail & Kiosks
|
||||
title: Smart Retail & Kiosks
|
||||
description: Personalize in-store experiences, provide product recommendations, and power intelligent kiosks for enhanced customer engagement.
|
||||
- id: 3
|
||||
icon:
|
||||
src: /img/edge-beta-vectors/icon4.svg
|
||||
alt: Industrial IoT
|
||||
title: Industrial IoT
|
||||
description: Perform anomaly detection, predictive maintenance, and real-time insights on sensor data directly at the edge for industrial applications.
|
||||
sitemapExclude: true
|
||||
---
|
||||
Generated
+334
-342
File diff suppressed because it is too large
Load Diff
@@ -132,12 +132,7 @@
|
||||
@import 'partials/cloud-inference-cluster';
|
||||
@import 'partials/cloud-inference-get-started';
|
||||
@import 'partials/cloud-inference-faq';
|
||||
@import 'partials/edge-beta-hero';
|
||||
@import 'partials/edge-beta-features';
|
||||
@import 'partials/edge-beta-vectors';
|
||||
@import 'partials/edge-beta-form';
|
||||
@import 'partials/edge-beta-faq';
|
||||
@import 'partials/edge-beta-get-started';
|
||||
@import 'partials/edge/index';
|
||||
@import 'partials/elastic-lucene/index';
|
||||
@import 'partials/hr-tech/index';
|
||||
@import 'partials/healthcare/index';
|
||||
|
||||
@@ -0,0 +1,73 @@
|
||||
@use '../helpers/functions' as *;
|
||||
|
||||
.edge-beta-demo {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
padding-top: $spacer * 4;
|
||||
padding-bottom: $spacer * 4;
|
||||
background: radial-gradient(
|
||||
ellipse 120% 80% at 0% 0%,
|
||||
rgba(231, 29, 95, 0.12) 0%,
|
||||
rgba(133, 71, 255, 0.06) 40%,
|
||||
transparent 70%
|
||||
), $neutral-10;
|
||||
|
||||
&__lights-overlay {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
height: pxToRem(200);
|
||||
background-image: url('/img/elastic-lucene/lights.svg');
|
||||
background-repeat: repeat-x;
|
||||
background-position: center top;
|
||||
background-size: cover;
|
||||
transform: scaleY(-1);
|
||||
filter: blur(6px);
|
||||
z-index: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
&__title {
|
||||
margin: 0 0 $spacer * 2;
|
||||
font-size: $h4-font-size;
|
||||
line-height: 1.2;
|
||||
font-weight: 600;
|
||||
color: $neutral-100;
|
||||
}
|
||||
|
||||
&__description {
|
||||
margin-bottom: $spacer * 1.5;
|
||||
font-size: $font-size-l;
|
||||
line-height: $line-height-lg;
|
||||
color: $neutral-90;
|
||||
|
||||
&--secondary {
|
||||
margin-bottom: $spacer * 2;
|
||||
}
|
||||
}
|
||||
|
||||
&__button {
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
&__image {
|
||||
width: 100%;
|
||||
max-width: pxToRem(540);
|
||||
}
|
||||
|
||||
@include media-breakpoint-up(lg) {
|
||||
padding-top: $spacer * 5;
|
||||
padding-bottom: $spacer * 7.5;
|
||||
|
||||
&__title {
|
||||
line-height: 1.5;
|
||||
margin-bottom: $spacer * 2.5;
|
||||
}
|
||||
|
||||
&__description {
|
||||
max-width: pxToRem(540);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,74 @@
|
||||
@use '../../helpers/functions' as *;
|
||||
|
||||
.edge-demo {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
padding-top: $spacer * 4;
|
||||
padding-bottom: $spacer * 4;
|
||||
background: radial-gradient(
|
||||
ellipse 120% 80% at 0% 0%,
|
||||
rgba(231, 29, 95, 0.12) 0%,
|
||||
rgba(133, 71, 255, 0.06) 40%,
|
||||
transparent 70%
|
||||
), $neutral-10;
|
||||
|
||||
&__lights-overlay {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
height: pxToRem(200);
|
||||
background-image: url('/img/elastic-lucene/lights.svg');
|
||||
background-repeat: repeat-x;
|
||||
background-position: center top;
|
||||
background-size: cover;
|
||||
transform: scaleY(-1);
|
||||
filter: blur(6px);
|
||||
z-index: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
&__title {
|
||||
margin: 0 0 $spacer * 2;
|
||||
font-size: $h4-font-size;
|
||||
line-height: 1.2;
|
||||
font-weight: 600;
|
||||
color: $neutral-100;
|
||||
}
|
||||
|
||||
&__description {
|
||||
margin-bottom: $spacer * 1.5;
|
||||
font-size: $font-size-l;
|
||||
line-height: $line-height-lg;
|
||||
color: $neutral-98;
|
||||
|
||||
&--secondary {
|
||||
margin-bottom: $spacer * 2;
|
||||
}
|
||||
}
|
||||
|
||||
&__button {
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
&__image {
|
||||
width: 100%;
|
||||
max-width: pxToRem(540);
|
||||
}
|
||||
|
||||
@include media-breakpoint-up(lg) {
|
||||
padding-top: $spacer * 5;
|
||||
padding-bottom: $spacer * 7.5;
|
||||
|
||||
&__title {
|
||||
font-size: $h2-font-size;
|
||||
line-height: pxToRem(67);
|
||||
margin-bottom: $spacer * 2.5;
|
||||
}
|
||||
|
||||
&__description {
|
||||
max-width: pxToRem(540);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,26 @@
|
||||
@use '../../helpers/functions' as *;
|
||||
|
||||
.edge-faq {
|
||||
padding-top: $spacer * 4;
|
||||
padding-bottom: $spacer * 4;
|
||||
background-color: $neutral-94;
|
||||
|
||||
&__title {
|
||||
margin-bottom: $spacer * 3;
|
||||
font-size: $h4-font-size;
|
||||
line-height: $h3-font-size;
|
||||
color: $neutral-20;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@include media-breakpoint-up(lg) {
|
||||
padding-top: $spacer * 5;
|
||||
padding-bottom: $spacer * 5;
|
||||
|
||||
&__title {
|
||||
margin-bottom: $spacer * 5;
|
||||
font-size: $h2-font-size;
|
||||
line-height: pxToRem(67);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,56 @@
|
||||
@use '../../helpers/functions' as *;
|
||||
|
||||
.edge-features {
|
||||
padding-top: $spacer * 4;
|
||||
padding-bottom: $spacer * 2.5;
|
||||
background-color: $neutral-94;
|
||||
|
||||
&__title {
|
||||
margin-bottom: $spacer * 2.5;
|
||||
font-size: $h5-font-size;
|
||||
line-height: pxToRem(38);
|
||||
color: $neutral-20;
|
||||
}
|
||||
|
||||
&__card {
|
||||
justify-content: flex-start;
|
||||
padding-bottom: 0;
|
||||
|
||||
&-title {
|
||||
margin-bottom: pxToRem(12);
|
||||
font-size: $font-size-xl;
|
||||
line-height: pxToRem(30);
|
||||
color: $neutral-20;
|
||||
}
|
||||
|
||||
&-description {
|
||||
margin-bottom: $spacer;
|
||||
color: $neutral-40;
|
||||
}
|
||||
|
||||
&-image {
|
||||
width: 100%;
|
||||
margin-top: auto;
|
||||
}
|
||||
}
|
||||
|
||||
&__cards {
|
||||
& > div:first-of-type {
|
||||
.edge-features__card-image {
|
||||
width: calc(100% + ($spacer * 3));
|
||||
margin-left: -$spacer * 1.5;
|
||||
margin-right: -$spacer * 1.5;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@include media-breakpoint-up(lg) {
|
||||
padding-top: $spacer * 7.5;
|
||||
|
||||
&__title {
|
||||
margin-bottom: $spacer * 4;
|
||||
font-size: $h3-font-size;
|
||||
line-height: pxToRem(58);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,161 @@
|
||||
@use '../../helpers/functions' as *;
|
||||
|
||||
.edge-form {
|
||||
position: relative;
|
||||
padding-top: $spacer * 4;
|
||||
padding-bottom: $spacer * 4;
|
||||
background-color: $neutral-10;
|
||||
overflow: hidden;
|
||||
|
||||
&__title {
|
||||
margin-bottom: $spacer * 1.5;
|
||||
font-size: $h5-font-size;
|
||||
line-height: pxToRem(38);
|
||||
color: $neutral-98;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
&__description {
|
||||
max-width: pxToRem(730);
|
||||
margin: 0 auto $spacer * 3;
|
||||
font-size: $font-size-xl;
|
||||
line-height: pxToRem(30);
|
||||
color: $neutral-70;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
&__container {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
max-width: pxToRem(720);
|
||||
margin: 0 auto;
|
||||
border-radius: $spacer * 0.5;
|
||||
background: linear-gradient($neutral-20, #0e1424);
|
||||
|
||||
* {
|
||||
font-family: $font-family-base;
|
||||
}
|
||||
|
||||
[data-hsfc-id=Renderer] .hsfc-Step .hsfc-Step__Content {
|
||||
padding: $spacer * 1.5;
|
||||
}
|
||||
|
||||
.hsfc-RichText span, .hsfc-FieldLabel span, .hsfc-ProgressBar__Text {
|
||||
font-size: $font-size-s !important;
|
||||
line-height: $line-height-sm !important;
|
||||
color: $neutral-98 !important;
|
||||
}
|
||||
|
||||
.hsfc-FieldLabel {
|
||||
margin-bottom: $spacer * 0.5 !important;
|
||||
}
|
||||
|
||||
[data-hsfc-id=Renderer] .hsfc-TextInput, [data-hsfc-id=Renderer] .hsfc-TextareaInput {
|
||||
display: block;
|
||||
background-color: transparent;
|
||||
border: pxToRem(1) solid $neutral-50;
|
||||
margin-bottom: $spacer * 0.5;
|
||||
padding: $spacer * 0.5 $spacer;
|
||||
font-size: $font-size-md;
|
||||
line-height: $spacer * 1.5;
|
||||
color: $neutral-98;
|
||||
border-radius: $spacer * 0.5;
|
||||
|
||||
&:focus, &:active {
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
&::placeholder {
|
||||
color: $neutral-70;
|
||||
}
|
||||
}
|
||||
|
||||
[data-hsfc-id=Renderer] .hsfc-ErrorAlert {
|
||||
font-size: $font-size-xs;
|
||||
line-height: $font-size-l;
|
||||
color: $primary-40;
|
||||
}
|
||||
|
||||
[data-hsfc-id=Renderer] .hsfc-Button {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-wrap: nowrap;
|
||||
cursor: pointer;
|
||||
border: none;
|
||||
border-radius: $spacer * 0.5;
|
||||
color: $neutral-100;
|
||||
text-decoration: none;
|
||||
|
||||
height: $spacer * 2.5;
|
||||
padding: pxToRem(22);
|
||||
font-weight: 700;
|
||||
font-size: map-get($font-sizes-text, md);
|
||||
z-index: 1;
|
||||
background: linear-gradient(180deg, $primary-50, $primary-40) !important;
|
||||
box-shadow: 0 2px 1px 0 $primary-60 inset !important;
|
||||
transition: none !important;
|
||||
|
||||
&:hover {
|
||||
background: $primary-50 !important;
|
||||
border: none !important;
|
||||
box-shadow: 0 2px 1px 0 $primary-70 inset !important;
|
||||
transform: none !important;
|
||||
}
|
||||
|
||||
&:active {
|
||||
background: $primary-50 !important;
|
||||
border: none !important;
|
||||
box-shadow:
|
||||
0 2px 1px 0 $primary-60 inset,
|
||||
0 0 0 2px rgba(220, 36, 76, 0.4) !important;
|
||||
}
|
||||
|
||||
&.button_disabled,
|
||||
&:disabled {
|
||||
background: $primary-70 !important;
|
||||
border: none !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__form-overlay {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
width: pxToRem(210);
|
||||
height: pxToRem(210);
|
||||
background-image: url('/img/blurred/blurred-light-15.svg');
|
||||
background-position: top;
|
||||
background-size: cover;
|
||||
border-radius: 0 pxToRem(12) 0 0;
|
||||
}
|
||||
|
||||
&__overlay {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: -$spacer * 1.5;
|
||||
width: pxToRem(637);
|
||||
height: pxToRem(444);
|
||||
background-image: url('/img/blurred/blurred-light-19.svg');
|
||||
background-position: bottom;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
@include media-breakpoint-up(lg) {
|
||||
padding-top: $spacer * 7.5;
|
||||
padding-bottom: $spacer * 7.5;
|
||||
|
||||
&__title {
|
||||
font-size: $h3-font-size;
|
||||
line-height: pxToRem(58);
|
||||
}
|
||||
|
||||
&__container {
|
||||
[data-hsfc-id=Renderer] .hsfc-Step .hsfc-Step__Content {
|
||||
padding: $spacer * 4;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,14 @@
|
||||
@use '../../mixins/get-started-small' as get-started-small;
|
||||
@use '../../helpers/functions' as *;
|
||||
|
||||
.edge-get-started {
|
||||
@include get-started-small.base(
|
||||
$spacer * 5,
|
||||
$spacer * 2.5,
|
||||
$spacer * 7.5,
|
||||
$spacer * 5,
|
||||
$neutral-94,
|
||||
$neutral-10,
|
||||
$neutral-10
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,65 @@
|
||||
@use '../../helpers/functions' as *;
|
||||
|
||||
.edge-hero {
|
||||
position: relative;
|
||||
padding-top: $spacer * 2.5;
|
||||
padding-bottom: $spacer * 4;
|
||||
background-color: $neutral-10;
|
||||
|
||||
&__title {
|
||||
margin: $spacer * 1.5 0;
|
||||
font-size: $h4-font-size;
|
||||
line-height: $h3-font-size;
|
||||
color: $neutral-98;
|
||||
}
|
||||
|
||||
&__subtitle {
|
||||
margin-bottom: $spacer * 1.5;
|
||||
font-size: $h6-font-size;
|
||||
line-height: pxToRem(34);
|
||||
color: $neutral-98;
|
||||
}
|
||||
|
||||
&__description {
|
||||
margin-bottom: $spacer * 2;
|
||||
font-size: $font-size-l;
|
||||
line-height: $line-height-lg;
|
||||
color: $neutral-70;
|
||||
}
|
||||
|
||||
&__buttons {
|
||||
display: flex;
|
||||
gap: 1.5rem;
|
||||
}
|
||||
|
||||
&__image {
|
||||
width: 100%;
|
||||
max-width: pxToRem(540);
|
||||
}
|
||||
|
||||
&__overlay {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: pxToRem(176);
|
||||
background-image: url('/img/blurred/blurred-light-11.png');
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
@include media-breakpoint-up(lg) {
|
||||
padding-top: $spacer * 5;
|
||||
padding-bottom: $spacer * 7.5;
|
||||
|
||||
&__title {
|
||||
font-size: $h2-font-size;
|
||||
line-height: pxToRem(67);
|
||||
}
|
||||
|
||||
&__subtitle, &__description {
|
||||
max-width: pxToRem(500);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,102 @@
|
||||
@use '../../helpers/functions' as *;
|
||||
|
||||
.edge-vectors {
|
||||
padding-top: $spacer * 4;
|
||||
padding-bottom: $spacer * 4;
|
||||
background-color: $neutral-94;
|
||||
|
||||
&__title {
|
||||
max-width: pxToRem(920);
|
||||
margin: 0 auto $spacer * 4;
|
||||
font-size: $h4-font-size;
|
||||
line-height: $h3-font-size;
|
||||
color: $neutral-20;
|
||||
}
|
||||
|
||||
&__card {
|
||||
&-info {
|
||||
padding-bottom: $spacer * 2;
|
||||
}
|
||||
|
||||
&-icon {
|
||||
height: $spacer * 3.5;
|
||||
width: $spacer * 3.5;
|
||||
margin-bottom: $spacer;
|
||||
}
|
||||
|
||||
&-title {
|
||||
font-size: $h5-font-size;
|
||||
line-height: $h4-font-size;
|
||||
margin-bottom: $spacer;
|
||||
color: $neutral-20;
|
||||
}
|
||||
|
||||
&-description {
|
||||
font-size: $font-size-l;
|
||||
line-height: $line-height-lg;
|
||||
margin-bottom: 0;
|
||||
color: $neutral-30;
|
||||
}
|
||||
}
|
||||
|
||||
@include media-breakpoint-up(lg) {
|
||||
padding-top: $spacer * 7.5;
|
||||
padding-bottom: $spacer * 7.5;
|
||||
|
||||
&__title {
|
||||
font-size: $h3-font-size;
|
||||
line-height: pxToRem(58);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
&__card {
|
||||
position: relative;
|
||||
|
||||
&:nth-of-type(2),
|
||||
&:nth-of-type(4) {
|
||||
& > div {
|
||||
&:before {
|
||||
content: "";
|
||||
display: block;
|
||||
height: 100%;
|
||||
width: pxToRem(1);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background-color: $neutral-80;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:nth-of-type(1),
|
||||
&:nth-of-type(2) {
|
||||
& > div {
|
||||
&:after {
|
||||
content: "";
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: pxToRem(1);
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background-color: $neutral-80;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&-info {
|
||||
max-width: pxToRem(400);
|
||||
margin: auto;
|
||||
padding: $spacer * 3.5 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@include media-breakpoint-up(xl) {
|
||||
&__card {
|
||||
&-info {
|
||||
max-width: pxToRem(443);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
@import 'edge-hero';
|
||||
@import 'edge-features';
|
||||
@import 'edge-vectors';
|
||||
@import 'edge-demo';
|
||||
@import 'edge-form';
|
||||
@import 'edge-faq';
|
||||
@import 'edge-get-started';
|
||||
@@ -1,13 +0,0 @@
|
||||
{{ define "main" }}
|
||||
{{ partial "site-header" . }}
|
||||
|
||||
{{ partial "edge-beta-hero" . }}
|
||||
{{ partial "edge-beta-features" . }}
|
||||
{{ partial "edge-beta-vectors" . }}
|
||||
{{ partial "edge-beta-form" . }}
|
||||
{{ partial "edge-beta-faq" . }}
|
||||
|
||||
{{ with (.Site.GetPage "/edge-beta/edge-beta-get-started") }}
|
||||
{{ partial "get-started-small" (dict "context" . "class" "edge-beta-get-started") }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
@@ -0,0 +1,14 @@
|
||||
{{ define "main" }}
|
||||
{{ partial "site-header" . }}
|
||||
|
||||
{{ partial "edge/edge-hero" . }}
|
||||
{{ partial "edge/edge-features" . }}
|
||||
{{ partial "edge/edge-vectors" . }}
|
||||
{{ partial "edge/edge-demo" . }}
|
||||
{{ partial "edge/edge-form" . }}
|
||||
{{ partial "edge/edge-faq" . }}
|
||||
|
||||
{{ with (.Site.GetPage "/edge/edge-get-started") }}
|
||||
{{ partial "get-started-small" (dict "context" . "class" "edge-get-started") }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
@@ -1,8 +0,0 @@
|
||||
{{ with (.Site.GetPage "/edge-beta/edge-beta-faq") }}
|
||||
<section class="edge-beta-faq">
|
||||
<div class="container">
|
||||
<h2 class="edge-beta-faq__title">{{ .Params.title }}</h2>
|
||||
{{ partial "accordion" . }}
|
||||
</div>
|
||||
</section>
|
||||
{{ end }}
|
||||
@@ -1,18 +0,0 @@
|
||||
{{ with (.Site.GetPage "/edge-beta/edge-beta-features") }}
|
||||
<section class="edge-beta-features">
|
||||
<div class="container">
|
||||
<h2 class="edge-beta-features__title">{{ .Params.title }}</h2>
|
||||
<div class="edge-beta-features__cards row g-4">
|
||||
{{ range $index, $element := .Params.features }}
|
||||
<div class="col-12 {{ if eq $index 0 }}col-lg-8{{ else }}col-lg-4 {{ end }}">
|
||||
<div class="card edge-beta-features__card">
|
||||
<h6 class="edge-beta-features__card-title">{{ .title }}</h6>
|
||||
<p class="edge-beta-features__card-description">{{ .description }}</p>
|
||||
<img class="edge-beta-features__card-image" src="{{ .image.src }}" alt="{{ .image.alt }}" />
|
||||
</div>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{{ end }}
|
||||
@@ -1,23 +0,0 @@
|
||||
{{ with (.Site.GetPage "/edge-beta/edge-beta-hero") }}
|
||||
<section class="edge-beta-hero">
|
||||
<div class="container">
|
||||
<div class="row align-items-lg-center g-5 g-lg-0">
|
||||
<div class="col-12 col-lg-6 z-1">
|
||||
{{ partial "label" . }}
|
||||
<h3 class="edge-beta-hero__title">{{ .Params.title }}</h3>
|
||||
<h5 class="edge-beta-hero__subtitle">{{ .Params.subtitle }}</h5>
|
||||
<p class="edge-beta-hero__description">{{ .Params.description }}</p>
|
||||
<div class="edge-beta-hero__buttons">
|
||||
<a href="{{ .Params.startFree.url }}" class="button button_contained button_lg">
|
||||
{{ .Params.startFree.text }}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 col-lg-6 d-flex justify-content-center z-1">
|
||||
<img class="edge-beta-hero__image" src="{{ .Params.image.src }}" alt="{{ .Params.image.alt }}" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="edge-beta-hero__overlay"></div>
|
||||
</section>
|
||||
{{ end }}
|
||||
@@ -1,18 +0,0 @@
|
||||
{{ with (.Site.GetPage "edge-beta/edge-beta-vectors") }}
|
||||
<section class="edge-beta-vectors">
|
||||
<div class="container">
|
||||
<h2 class="edge-beta-vectors__title">{{ .Params.title }}</h2>
|
||||
<div class="edge-beta-vectors__cards row g-4 g-lg-0">
|
||||
{{ range $index, $element := .Params.cards }}
|
||||
<div class="edge-beta-vectors__card col-12 col-lg-6">
|
||||
<div class="edge-beta-vectors__card-info">
|
||||
<img class="edge-beta-vectors__card-icon" src="{{ .icon.src }}" alt="{{ .icon.alt }}" />
|
||||
<h5 class="edge-beta-vectors__card-title">{{ .title }}</h5>
|
||||
<p class="edge-beta-vectors__card-description">{{ .description }}</p>
|
||||
</div>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{{ end }}
|
||||
@@ -0,0 +1,26 @@
|
||||
{{ with (.Site.GetPage "/edge/edge-demo") }}
|
||||
<section class="edge-demo">
|
||||
<div class="edge-demo__lights-overlay"></div>
|
||||
<div class="container">
|
||||
<div class="row align-items-lg-center g-5 g-lg-0">
|
||||
<div class="col-12 col-lg-6 z-1">
|
||||
<h2 class="edge-demo__title">
|
||||
{{ .Params.label.title }}: {{ .Params.title }}
|
||||
</h2>
|
||||
<p class="edge-demo__description">{{ .Params.description }}</p>
|
||||
{{ with .Params.description2 }}
|
||||
<p class="edge-demo__description edge-demo__description--secondary">{{ . }}</p>
|
||||
{{ end }}
|
||||
<div class="edge-demo__buttons">
|
||||
<a href="{{ .Params.cta.url }}" class="button button_contained button_lg edge-demo__button" target="{{ .Params.cta.target }}">
|
||||
{{ .Params.cta.text }}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 col-lg-6 d-flex justify-content-center z-1">
|
||||
<img class="edge-demo__image" src="{{ .Params.image.src }}" alt="{{ .Params.image.alt }}" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{{ end }}
|
||||
@@ -0,0 +1,8 @@
|
||||
{{ with (.Site.GetPage "/edge/edge-faq") }}
|
||||
<section class="edge-faq">
|
||||
<div class="container">
|
||||
<h2 class="edge-faq__title">{{ .Params.title }}</h2>
|
||||
{{ partial "accordion" . }}
|
||||
</div>
|
||||
</section>
|
||||
{{ end }}
|
||||
@@ -0,0 +1,18 @@
|
||||
{{ with (.Site.GetPage "/edge/edge-features") }}
|
||||
<section class="edge-features">
|
||||
<div class="container">
|
||||
<h2 class="edge-features__title">{{ .Params.title }}</h2>
|
||||
<div class="edge-features__cards row g-4">
|
||||
{{ range $index, $element := .Params.features }}
|
||||
<div class="col-12 {{ if eq $index 0 }}col-lg-8{{ else }}col-lg-4 {{ end }}">
|
||||
<div class="card edge-features__card">
|
||||
<h6 class="edge-features__card-title">{{ .title }}</h6>
|
||||
<p class="edge-features__card-description">{{ .description }}</p>
|
||||
<img class="edge-features__card-image" src="{{ .image.src }}" alt="{{ .image.alt }}" />
|
||||
</div>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{{ end }}
|
||||
+8
-8
@@ -1,12 +1,12 @@
|
||||
{{ with (.Site.GetPage "/edge-beta/edge-beta-form") }}
|
||||
<section class="edge-beta-form" id="form">
|
||||
<div class="edge-beta-form__overlay"></div>
|
||||
{{ with (.Site.GetPage "/edge/edge-form") }}
|
||||
<section class="edge-form" id="form">
|
||||
<div class="edge-form__overlay"></div>
|
||||
<div class="container">
|
||||
<h2 class="edge-beta-form__title">{{ .Params.title }}</h2>
|
||||
<p class="edge-beta-form__description">{{ .Params.description }}</p>
|
||||
<h2 class="edge-form__title">{{ .Params.title }}</h2>
|
||||
<p class="edge-form__description">{{ .Params.description }}</p>
|
||||
|
||||
<div class="edge-beta-form__container">
|
||||
<div class="edge-beta-form__form-overlay"></div>
|
||||
<div class="edge-form__container">
|
||||
<div class="edge-form__form-overlay"></div>
|
||||
<script src="https://js-eu1.hsforms.net/forms/embed/developer/139603372.js" defer></script>
|
||||
|
||||
<script>
|
||||
@@ -32,7 +32,7 @@
|
||||
fallbackButtonContainer.appendChild(fallbackButton);
|
||||
{{ end }}
|
||||
|
||||
document.getElementsByClassName("edge-beta-form__container")[0].appendChild(fallbackButtonContainer);
|
||||
document.getElementsByClassName("edge-form__container")[0].appendChild(fallbackButtonContainer);
|
||||
}
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,26 @@
|
||||
{{ with (.Site.GetPage "/edge/edge-hero") }}
|
||||
<section class="edge-hero">
|
||||
<div class="container">
|
||||
<div class="row align-items-lg-center g-5 g-lg-0">
|
||||
<div class="col-12 col-lg-6 z-1">
|
||||
{{ partial "label" . }}
|
||||
<h3 class="edge-hero__title">{{ .Params.title }}</h3>
|
||||
<h5 class="edge-hero__subtitle">{{ .Params.subtitle }}</h5>
|
||||
<p class="edge-hero__description">{{ .Params.description }}</p>
|
||||
<div class="edge-hero__buttons">
|
||||
<a href="{{ .Params.startFree.url }}" class="button button_contained button_lg">
|
||||
{{ .Params.startFree.text }}
|
||||
</a>
|
||||
<a href="{{ .Params.contactUs.url }}" class="button button_outlined button_lg">
|
||||
{{ .Params.contactUs.text }}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 col-lg-6 d-flex justify-content-center z-1">
|
||||
<img class="edge-hero__image" src="{{ .Params.image.src }}" alt="{{ .Params.image.alt }}" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="edge-hero__overlay"></div>
|
||||
</section>
|
||||
{{ end }}
|
||||
@@ -0,0 +1,18 @@
|
||||
{{ with (.Site.GetPage "edge/edge-vectors") }}
|
||||
<section class="edge-vectors">
|
||||
<div class="container">
|
||||
<h2 class="edge-vectors__title">{{ .Params.title }}</h2>
|
||||
<div class="edge-vectors__cards row g-4 g-lg-0">
|
||||
{{ range $index, $element := .Params.cards }}
|
||||
<div class="edge-vectors__card col-12 col-lg-6">
|
||||
<div class="edge-vectors__card-info">
|
||||
<img class="edge-vectors__card-icon" src="{{ .icon.src }}" alt="{{ .icon.alt }}" />
|
||||
<h5 class="edge-vectors__card-title">{{ .title }}</h5>
|
||||
<p class="edge-vectors__card-description">{{ .description }}</p>
|
||||
</div>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{{ end }}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 198 KiB |
Reference in New Issue
Block a user