From d758ddcb81a5c999439241f5a848984308f1ac19 Mon Sep 17 00:00:00 2001 From: nastyapash <38438810+nastyapash@users.noreply.github.com> Date: Thu, 14 Aug 2025 23:42:19 +0300 Subject: [PATCH] Add Course page (#1844) * Add Course page * Added shortcodes and buttons to navigate to the next page * move course images from layout * decouple documentation and course layout * decouple course sidebar * move accordion js handlers into global unconditional js * enable search on courses * allow nested courses * disable links for now --------- Co-authored-by: generall --- qdrant-landing/content/course/_index.md | 4 + .../content/course/essentials/_index.md | 109 ++++++++++++++ .../course/essentials/certification.md | 6 + .../content/course/essentials/day-0/_index.md | 13 ++ .../course/essentials/day-0/video-02.md | 9 ++ .../course/essentials/day-0/video-03.md | 9 ++ .../content/course/essentials/day-1/_index.md | 9 ++ .../course/essentials/day-1/video-02.md | 9 ++ .../content/course/essentials/day-2/_index.md | 9 ++ .../content/course/essentials/day-3/_index.md | 9 ++ .../content/course/essentials/day-4/_index.md | 9 ++ .../content/course/essentials/day-9/_index.md | 59 ++++++++ .../content/course/essentials/faq.md | 51 +++++++ .../content/headless/docs-header.md | 5 + .../courses/course-integrations/aparavi.svg | 6 + .../courses/course-integrations/camel-ai.svg | 3 + .../courses/course-integrations/crew-ai.svg | 3 + .../courses/course-integrations/haystack.svg | 3 + .../courses/course-integrations/jina.svg | 5 + .../courses/course-integrations/n8n.svg | 10 ++ .../courses/course-integrations/quotient.svg | 9 ++ .../course-integrations/superlinked.svg | 4 + .../course-integrations/tensorlake.svg | 4 + .../course-integrations/twelveLabs.svg | 30 ++++ .../course-integrations/unstructured.svg | 9 ++ .../courses/course-integrations/vectorize.svg | 5 + .../qdrant-2024/assets/css/_components.scss | 5 + .../assets/css/components/_accordion.scss | 65 ++++++++ .../assets/css/components/_cards-list.scss | 50 ++++++ .../assets/css/components/_course-card.scss | 55 +++++++ .../assets/css/components/_date.scss | 17 +++ .../assets/css/components/_list.scss | 33 ++++ .../css/partials/_table-of-contents.scss | 9 +- .../partials/documentation/_docs-footer.scss | 4 +- .../documentation/_documentation-menu.scss | 36 ++++- .../themes/qdrant-2024/assets/js/index.js | 21 +++ .../qdrant-2024/assets/js/search/search.js | 4 + .../qdrant-2024/layouts/_default/sitemap.xml | 9 ++ .../qdrant-2024/layouts/course/list.html | 11 ++ .../qdrant-2024/layouts/course/single.html | 11 ++ .../partials/course/content-layout.html | 74 +++++++++ .../layouts/partials/course/sidebar-menu.html | 142 ++++++++++++++++++ .../qdrant-2024/layouts/partials/css.html | 6 +- .../partials/documentation/footer.html | 5 + .../qdrant-2024/layouts/partials/js-head.html | 2 +- .../qdrant-2024/layouts/partials/js.html | 26 +--- .../layouts/partials/table-of-contents.html | 73 +++++---- .../layouts/shortcodes/accordion.html | 13 ++ .../layouts/shortcodes/cards-list.html | 12 ++ .../layouts/shortcodes/course-card.html | 16 ++ .../qdrant-2024/layouts/shortcodes/date.html | 4 + .../static/icons/outline/date-blue.svg | 10 ++ .../icons/outline/rocket-white-light.svg | 8 + .../static/icons/outline/training-white.svg | 10 ++ 54 files changed, 1069 insertions(+), 63 deletions(-) create mode 100644 qdrant-landing/content/course/_index.md create mode 100644 qdrant-landing/content/course/essentials/_index.md create mode 100644 qdrant-landing/content/course/essentials/certification.md create mode 100644 qdrant-landing/content/course/essentials/day-0/_index.md create mode 100644 qdrant-landing/content/course/essentials/day-0/video-02.md create mode 100644 qdrant-landing/content/course/essentials/day-0/video-03.md create mode 100644 qdrant-landing/content/course/essentials/day-1/_index.md create mode 100644 qdrant-landing/content/course/essentials/day-1/video-02.md create mode 100644 qdrant-landing/content/course/essentials/day-2/_index.md create mode 100644 qdrant-landing/content/course/essentials/day-3/_index.md create mode 100644 qdrant-landing/content/course/essentials/day-4/_index.md create mode 100644 qdrant-landing/content/course/essentials/day-9/_index.md create mode 100644 qdrant-landing/content/course/essentials/faq.md create mode 100644 qdrant-landing/static/courses/course-integrations/aparavi.svg create mode 100644 qdrant-landing/static/courses/course-integrations/camel-ai.svg create mode 100755 qdrant-landing/static/courses/course-integrations/crew-ai.svg create mode 100644 qdrant-landing/static/courses/course-integrations/haystack.svg create mode 100644 qdrant-landing/static/courses/course-integrations/jina.svg create mode 100644 qdrant-landing/static/courses/course-integrations/n8n.svg create mode 100644 qdrant-landing/static/courses/course-integrations/quotient.svg create mode 100644 qdrant-landing/static/courses/course-integrations/superlinked.svg create mode 100644 qdrant-landing/static/courses/course-integrations/tensorlake.svg create mode 100644 qdrant-landing/static/courses/course-integrations/twelveLabs.svg create mode 100644 qdrant-landing/static/courses/course-integrations/unstructured.svg create mode 100644 qdrant-landing/static/courses/course-integrations/vectorize.svg create mode 100644 qdrant-landing/themes/qdrant-2024/assets/css/components/_accordion.scss create mode 100644 qdrant-landing/themes/qdrant-2024/assets/css/components/_cards-list.scss create mode 100644 qdrant-landing/themes/qdrant-2024/assets/css/components/_course-card.scss create mode 100644 qdrant-landing/themes/qdrant-2024/assets/css/components/_date.scss create mode 100644 qdrant-landing/themes/qdrant-2024/assets/css/components/_list.scss create mode 100644 qdrant-landing/themes/qdrant-2024/layouts/course/list.html create mode 100644 qdrant-landing/themes/qdrant-2024/layouts/course/single.html create mode 100644 qdrant-landing/themes/qdrant-2024/layouts/partials/course/content-layout.html create mode 100644 qdrant-landing/themes/qdrant-2024/layouts/partials/course/sidebar-menu.html create mode 100644 qdrant-landing/themes/qdrant-2024/layouts/shortcodes/accordion.html create mode 100644 qdrant-landing/themes/qdrant-2024/layouts/shortcodes/cards-list.html create mode 100644 qdrant-landing/themes/qdrant-2024/layouts/shortcodes/course-card.html create mode 100644 qdrant-landing/themes/qdrant-2024/layouts/shortcodes/date.html create mode 100644 qdrant-landing/themes/qdrant-2024/static/icons/outline/date-blue.svg create mode 100644 qdrant-landing/themes/qdrant-2024/static/icons/outline/rocket-white-light.svg create mode 100644 qdrant-landing/themes/qdrant-2024/static/icons/outline/training-white.svg diff --git a/qdrant-landing/content/course/_index.md b/qdrant-landing/content/course/_index.md new file mode 100644 index 000000000..66effde92 --- /dev/null +++ b/qdrant-landing/content/course/_index.md @@ -0,0 +1,4 @@ +--- +--- + +# Welcome to Qdrant Courses \ No newline at end of file diff --git a/qdrant-landing/content/course/essentials/_index.md b/qdrant-landing/content/course/essentials/_index.md new file mode 100644 index 000000000..9ef75ceb3 --- /dev/null +++ b/qdrant-landing/content/course/essentials/_index.md @@ -0,0 +1,109 @@ +--- +title: Qdrant Essentials Course +page_title: Qdrant Essentials Course +description: The ultimate guide to production-grade vector search is here. And it’s free. +content: + sidebarTitle: Qdrant Essentials + menuTitle: + text: Course Overview + url: /course/essentials/ + getStarted: + text: Get Started + url: /course/essentials/day-0/ + nextButton: Continue to Next Video + nextDay: Complete + title: Qdrant Essentials Course + description: The ultimate guide to production-grade vector search is here. And it’s free. +partition: course +--- + +# Qdrant Essentials Course + +The ultimate guide to production-grade vector search is here. And it’s free. + +From your first vector upsert to optimizing high-performance retrieval at scale, this free course takes you from zero to production-ready. Learn how to build efficient vector search, fine-tune Qdrant for maximum performance, and keep your system lightweight, even when working with billions of vectors. + +{{< course-card +title="Skills you’ll gain:" +image="/icons/outline/training-white.svg" +type="wide-list">}} + +- Vector search fundamentals +- Performance optimization +- Hybrid and similarity search +- Portfolio project development + +{{< /course-card >}} + +## What Is the Course? + +No matter if you're exploring vector search for the first time or fine-tuning a large-scale RAG system, this free course gives you the practical foundation and advanced skills you need. + +Over 9 days (plus bonus content), you’ll build up from the fundamentals to advanced deployment strategies with Qdrant. Each module focuses on a single concept or capability, paired with a hands-on exercise to apply what you’ve learned. You will start with basics, build confidence, and gradually progress to complex topics.  + +Every day includes a hands-on exercise or mini-project, like creating a collection, uploading points, building a hybrid search pipeline, or tuning the HNSW index. + +At the end, you’ll bring everything together by building a full production-grade vector search application. You’ll graduate with a portfolio-worthy project, plus a deep understanding of how to apply Qdrant in production scenarios. + +## Course Overview + +{{< accordion >}} +- title: "Days 0: Setup, Orientation & “Hello Qdrant!”" + content: | + - Welcome & Course Orientation + - Environment Setup + - Mini “Hello Qdrant!” Demo + +- title: "Day 1: Core Qdrant Data Model & Vector Search 101" + content: Content + +- title: "Days 2: Indexing & Vector Storage Architecture" + content: Content + +- title: "Day 3: Hybrid Search" + content: Content + +- title: "Day 4: Optimizations & Query APIs" + content: Content +{{< /accordion >}} + +## Certificate of Completion + +image + +## Who Is the Course For? + +You! But really, this course is great for hands-on professionals who need to build or improve applications with semantic or hybrid search capabilities, or developers exploring vector databases for the first time. + +If your job title includes: + +- Machine Learning Engineer +- Backend Developer +- Data Engineer +- Search Engineer +- MLOps Engineer + +you’re in the right spot. + +## Pre-Reqs + +You don’t need prior Qdrant or vector database experience, but you should be comfortable with: +- Basic Python programming +- Running commands in your terminal +- Working with APIs or Python SDKs +- Some ML background (e.g., embeddings) + +Optional but helpful: +- Docker basics +- Experience with search systems or deploying applications + +{{< course-card +title="Why Start Today" +image="/icons/outline/rocket-white-light.svg" +link="/course/day-0/">}} + +- Seeing practical examples (e.g., hybrid search, sparse+dense vectors) +- Learning key deployment tactics (multi-node clusters, on-disk indexing, RBAC) +- Building a final portfolio-grade project to showcase + +{{< /course-card >}} diff --git a/qdrant-landing/content/course/essentials/certification.md b/qdrant-landing/content/course/essentials/certification.md new file mode 100644 index 000000000..95de4d9de --- /dev/null +++ b/qdrant-landing/content/course/essentials/certification.md @@ -0,0 +1,6 @@ +--- +title: Certification +url: /course/certification/ +--- + +# Certification diff --git a/qdrant-landing/content/course/essentials/day-0/_index.md b/qdrant-landing/content/course/essentials/day-0/_index.md new file mode 100644 index 000000000..d8af202fd --- /dev/null +++ b/qdrant-landing/content/course/essentials/day-0/_index.md @@ -0,0 +1,13 @@ +--- +title: Day 0 +isLesson: true +weight: 1 +--- + +{{< date >}} Day 0 {{< /date >}} + +# Setup, Orientation & “Hello Qdrant!” + +Welcome to Day 0! Today we’ll lay the foundation for everything in the course. Let’s get started with setting up your environment, and creating your first collection. By the end of this, you’ll have your first similarity search running! In total, the three videos are about 20 minutes total. + +## Video 01: Course Overview diff --git a/qdrant-landing/content/course/essentials/day-0/video-02.md b/qdrant-landing/content/course/essentials/day-0/video-02.md new file mode 100644 index 000000000..d3a511f4c --- /dev/null +++ b/qdrant-landing/content/course/essentials/day-0/video-02.md @@ -0,0 +1,9 @@ +--- +title: Video 02 +weight: 2 +--- + +{{< date >}} Day 0 {{< /date >}} + +# Video 02: Set Up Your Environment + diff --git a/qdrant-landing/content/course/essentials/day-0/video-03.md b/qdrant-landing/content/course/essentials/day-0/video-03.md new file mode 100644 index 000000000..feb96d353 --- /dev/null +++ b/qdrant-landing/content/course/essentials/day-0/video-03.md @@ -0,0 +1,9 @@ +--- +title: Video 03 +weight: 3 +--- + +{{< date >}} Day 0 {{< /date >}} + +# Video 03: Create a Collection + diff --git a/qdrant-landing/content/course/essentials/day-1/_index.md b/qdrant-landing/content/course/essentials/day-1/_index.md new file mode 100644 index 000000000..e37852126 --- /dev/null +++ b/qdrant-landing/content/course/essentials/day-1/_index.md @@ -0,0 +1,9 @@ +--- +title: Day 1 +isLesson: true +weight: 4 +--- + +{{< date >}} Day 1 {{< /date >}} + +# Day 1 diff --git a/qdrant-landing/content/course/essentials/day-1/video-02.md b/qdrant-landing/content/course/essentials/day-1/video-02.md new file mode 100644 index 000000000..4ca068e89 --- /dev/null +++ b/qdrant-landing/content/course/essentials/day-1/video-02.md @@ -0,0 +1,9 @@ +--- +title: Video 02 +weight: 5 +--- + +{{< date >}} Day 1 {{< /date >}} + +# Video 02: Set Up Your Environment + diff --git a/qdrant-landing/content/course/essentials/day-2/_index.md b/qdrant-landing/content/course/essentials/day-2/_index.md new file mode 100644 index 000000000..078a6af7d --- /dev/null +++ b/qdrant-landing/content/course/essentials/day-2/_index.md @@ -0,0 +1,9 @@ +--- +title: Day 2 +isLesson: true +weight: 6 +--- + +{{< date >}} Day 2 {{< /date >}} + +# Day 2 diff --git a/qdrant-landing/content/course/essentials/day-3/_index.md b/qdrant-landing/content/course/essentials/day-3/_index.md new file mode 100644 index 000000000..7709f3a5c --- /dev/null +++ b/qdrant-landing/content/course/essentials/day-3/_index.md @@ -0,0 +1,9 @@ +--- +title: Day 3 +isLesson: true +weight: 7 +--- + +{{< date >}} Day 3 {{< /date >}} + +# Day 3 diff --git a/qdrant-landing/content/course/essentials/day-4/_index.md b/qdrant-landing/content/course/essentials/day-4/_index.md new file mode 100644 index 000000000..31d948cb4 --- /dev/null +++ b/qdrant-landing/content/course/essentials/day-4/_index.md @@ -0,0 +1,9 @@ +--- +title: Day 4 +isLesson: true +weight: 8 +--- + +{{< date >}} Day 4 {{< /date >}} + +# Day 4 diff --git a/qdrant-landing/content/course/essentials/day-9/_index.md b/qdrant-landing/content/course/essentials/day-9/_index.md new file mode 100644 index 000000000..e08cb2a85 --- /dev/null +++ b/qdrant-landing/content/course/essentials/day-9/_index.md @@ -0,0 +1,59 @@ +--- +title: Day 9 (Bonus) +isLesson: true +weight: 9 +--- + +{{< date >}} Day 9 {{< /date >}} + +# Bonus: Advanced Configurations + +{{< cards-list >}} +- icon: /courses/course-integrations/crew-ai.svg + title: Building Agents with CrewAI and Qdrant + content: Qdrant is compatible with Cohere co.embed API. + +- icon: /courses/course-integrations/haystack.svg + title: Haystack + content: Qdrant is compatible with Cohere co.embed API. + +- icon: /courses/course-integrations/jina.svg + title: Jina + content: Qdrant is compatible with Cohere co.embed API. + +- icon: /courses/course-integrations/n8n.svg + title: n8n + content: Qdrant is compatible with Cohere co.embed API. + +- icon: /courses/course-integrations/camel-ai.svg + title: Camel-AI + content: Qdrant is compatible with Cohere co.embed API. + +- icon: /courses/course-integrations/tensorlake.svg + title: Tensorlake + content: Qdrant is compatible with Cohere co.embed API. + +- icon: /courses/course-integrations/vectorize.svg + title: Vectorize.io + content: Qdrant is compatible with Cohere co.embed API. + +- icon: /courses/course-integrations/unstructured.svg + title: Unstructured.io + content: Qdrant is compatible with Cohere co.embed API. + +- icon: /courses/course-integrations/quotient.svg + title: Quotient + content: Qdrant is compatible with Cohere co.embed API. + +- icon: /courses/course-integrations/superlinked.svg + title: Superlinked + content: Qdrant is compatible with Cohere co.embed API. + +- icon: /courses/course-integrations/twelveLabs.svg + title: TwelveLabs + content: Qdrant is compatible with Cohere co.embed API. + +- icon: /courses/course-integrations/aparavi.svg + title: APARAVI + content: Qdrant is compatible with Cohere co.embed API. +{{< /cards-list >}} diff --git a/qdrant-landing/content/course/essentials/faq.md b/qdrant-landing/content/course/essentials/faq.md new file mode 100644 index 000000000..c7a24f8df --- /dev/null +++ b/qdrant-landing/content/course/essentials/faq.md @@ -0,0 +1,51 @@ +--- +title: FAQ +url: /course/faq/ +--- + +# Qdrant Essentials Course FAQs + +## Who is this course for? + +Engineers and developers working with semantic or hybrid search, building LLM pipelines, or exploring vector databases for the first time. No prior experience with Qdrant or vector search is needed. + +## Is the course free? + +Yes, completely free. No credit card required. + +## Do I get a certificate of completion? + +Yes! But just watching the videos doesn’t quite get you there. You need to [[insert instructions]](/#) to obtain the certification. And, you’ll also have your project to add to your portfolio! + +## How much time should I spend on this course? + +Each “Day” of this course is designed to be completed in 1 day. Day 0 is the quickest, and then there are 8 days of content. So you are looking at a minimum of 9 days, but don’t forget about the bonus content. + +The good news is that you can take as much time as you need to complete the course since it is on-demand and at your own pace. + +## What tools do I need? + +Python, Docker, and optionally Qdrant Cloud. We walk you through setup on Day 0. + +## Can I use Qdrant locally or do I need a cloud account? + +You can do either. We support both local (via Docker) and Qdrant Cloud setups. + +## What if I get stuck or have a question? + +Join the Qdrant Discord. Our team and community are ready to help. + +## Where can I get the code for the course? + +Look at each Day’s page of content. You can also find them in this repo. + +{{< course-card +title="Why Start Today" +image="/icons/outline/rocket-white-light.svg" +link="/course/day-0/">}} + +- Seeing practical examples (e.g., hybrid search, sparse+dense vectors) +- Learning key deployment tactics (multi-node clusters, on-disk indexing, RBAC) +- Building a final portfolio-grade project to showcase + +{{< /course-card >}} diff --git a/qdrant-landing/content/headless/docs-header.md b/qdrant-landing/content/headless/docs-header.md index 626560b2e..d06d4b735 100644 --- a/qdrant-landing/content/headless/docs-header.md +++ b/qdrant-landing/content/headless/docs-header.md @@ -28,5 +28,10 @@ menuItems: url: https://api.qdrant.tech/api-reference external: true icon: roadmap-white.svg + # - id: menu-5 + # name: Course + # url: /course/ + # external: true +# icon: roadmap-white.svg sitemapExclude: true --- diff --git a/qdrant-landing/static/courses/course-integrations/aparavi.svg b/qdrant-landing/static/courses/course-integrations/aparavi.svg new file mode 100644 index 000000000..0603484b8 --- /dev/null +++ b/qdrant-landing/static/courses/course-integrations/aparavi.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/qdrant-landing/static/courses/course-integrations/camel-ai.svg b/qdrant-landing/static/courses/course-integrations/camel-ai.svg new file mode 100644 index 000000000..ef2106e2a --- /dev/null +++ b/qdrant-landing/static/courses/course-integrations/camel-ai.svg @@ -0,0 +1,3 @@ + + + diff --git a/qdrant-landing/static/courses/course-integrations/crew-ai.svg b/qdrant-landing/static/courses/course-integrations/crew-ai.svg new file mode 100755 index 000000000..ca7d0be94 --- /dev/null +++ b/qdrant-landing/static/courses/course-integrations/crew-ai.svg @@ -0,0 +1,3 @@ + + + diff --git a/qdrant-landing/static/courses/course-integrations/haystack.svg b/qdrant-landing/static/courses/course-integrations/haystack.svg new file mode 100644 index 000000000..337baa3d8 --- /dev/null +++ b/qdrant-landing/static/courses/course-integrations/haystack.svg @@ -0,0 +1,3 @@ + + + diff --git a/qdrant-landing/static/courses/course-integrations/jina.svg b/qdrant-landing/static/courses/course-integrations/jina.svg new file mode 100644 index 000000000..c2f40184a --- /dev/null +++ b/qdrant-landing/static/courses/course-integrations/jina.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/qdrant-landing/static/courses/course-integrations/n8n.svg b/qdrant-landing/static/courses/course-integrations/n8n.svg new file mode 100644 index 000000000..932e65c40 --- /dev/null +++ b/qdrant-landing/static/courses/course-integrations/n8n.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/qdrant-landing/static/courses/course-integrations/quotient.svg b/qdrant-landing/static/courses/course-integrations/quotient.svg new file mode 100644 index 000000000..714d200a8 --- /dev/null +++ b/qdrant-landing/static/courses/course-integrations/quotient.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/qdrant-landing/static/courses/course-integrations/superlinked.svg b/qdrant-landing/static/courses/course-integrations/superlinked.svg new file mode 100644 index 000000000..e7bde4d96 --- /dev/null +++ b/qdrant-landing/static/courses/course-integrations/superlinked.svg @@ -0,0 +1,4 @@ + + + + diff --git a/qdrant-landing/static/courses/course-integrations/tensorlake.svg b/qdrant-landing/static/courses/course-integrations/tensorlake.svg new file mode 100644 index 000000000..21a13a494 --- /dev/null +++ b/qdrant-landing/static/courses/course-integrations/tensorlake.svg @@ -0,0 +1,4 @@ + + + + diff --git a/qdrant-landing/static/courses/course-integrations/twelveLabs.svg b/qdrant-landing/static/courses/course-integrations/twelveLabs.svg new file mode 100644 index 000000000..a5294c163 --- /dev/null +++ b/qdrant-landing/static/courses/course-integrations/twelveLabs.svg @@ -0,0 +1,30 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/qdrant-landing/static/courses/course-integrations/unstructured.svg b/qdrant-landing/static/courses/course-integrations/unstructured.svg new file mode 100644 index 000000000..cd7a82032 --- /dev/null +++ b/qdrant-landing/static/courses/course-integrations/unstructured.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/qdrant-landing/static/courses/course-integrations/vectorize.svg b/qdrant-landing/static/courses/course-integrations/vectorize.svg new file mode 100644 index 000000000..d6bd26d9d --- /dev/null +++ b/qdrant-landing/static/courses/course-integrations/vectorize.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/_components.scss b/qdrant-landing/themes/qdrant-2024/assets/css/_components.scss index 9dfd913fd..6e1a8ed23 100644 --- a/qdrant-landing/themes/qdrant-2024/assets/css/_components.scss +++ b/qdrant-landing/themes/qdrant-2024/assets/css/_components.scss @@ -6,3 +6,8 @@ @import 'components/copy-btn'; @import 'components/lang-switcher'; @import 'components/alerts'; +@import 'components/list'; +@import 'components/cards-list'; +@import 'components/accordion'; +@import 'components/course-card'; +@import 'components/date'; diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/components/_accordion.scss b/qdrant-landing/themes/qdrant-2024/assets/css/components/_accordion.scss new file mode 100644 index 000000000..0591b98dd --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/assets/css/components/_accordion.scss @@ -0,0 +1,65 @@ +@use '../helpers/functions' as *; +@use 'sass:math'; + +.accordion-dark { + display: flex; + flex-direction: column; + gap: $spacer * 1.5; + width: 100%; + margin-bottom: $spacer * 2; + + &__item { + border: pxToRem(1) solid $neutral-20; + background: linear-gradient($neutral-20, #0e1424); + border-radius: pxToRem(12); + + &-header { + position: relative; + display: flex; + align-items: center; + margin-bottom: 0; + padding: $spacer * 2 $spacer * 4 $spacer * 2 $spacer * 2; + color: $neutral-94; + font-size: $font-size-l; + line-height: $line-height-lg; + font-weight: 500; + cursor: pointer; + + &:after { + content: ''; + display: block; + position: absolute; + right: $spacer * 2; + top: calc(50% - pxToRem(9)); + height: pxToRem(18); + width: pxToRem(16); + background-image: url("data:image/svg+xml,%3Csvg width='17' height='19' viewBox='0 0 17 19' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_10609_1497)'%3E%3Cpath d='M1.81787 6.50513L8.63605 13.3233L15.4542 6.50513' stroke='%23E1E5F0' stroke-width='1.36364' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_10609_1497'%3E%3Crect width='16.3636' height='16.3636' fill='white' transform='translate(0.63623 1.91431)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");background-position: center; + background-repeat: no-repeat; + background-size: cover; + } + } + + &-body { + max-height: 0; + overflow: hidden; + transition: max-height 0.2s ease-out; + + &-content { + padding: 0 $spacer * 2 $spacer * 2 $spacer * 2; + color: $neutral-70; + + ul { + li:not(:last-of-type) { + margin-bottom: pxToRem(10); + } + } + } + } + + &.active { + .accordion__item-header:after { + background-image: url("data:image/svg+xml,%3Csvg width='17' height='19' viewBox='0 0 17 19' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_10609_1581)'%3E%3Cpath d='M15.4546 13.3232L8.63641 6.50506L1.81823 13.3232' stroke='%23E1E5F0' stroke-width='1.36364' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_10609_1581'%3E%3Crect width='16.3636' height='16.3636' fill='white' transform='translate(0.63623 1.91418)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A"); + } + } + } +} diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/components/_cards-list.scss b/qdrant-landing/themes/qdrant-2024/assets/css/components/_cards-list.scss new file mode 100644 index 000000000..ece6c914e --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/assets/css/components/_cards-list.scss @@ -0,0 +1,50 @@ +@use '../helpers/functions' as *; +@use 'sass:math'; + +.cards-list { + display: flex; + flex-wrap: wrap; + gap: $spacer * 1.5 $spacer * 2; + + &__item { + display: flex; + align-items: flex-start; + gap: $spacer; + width: 100%; + padding: $spacer; + border: pxToRem(1) solid $neutral-20; + background: linear-gradient($neutral-20, #0e1424); + border-radius: pxToRem(12); + + &-content { + margin-bottom: 0; + font-size: $font-size-s; + line-height: $line-height-sm; + color: $neutral-70; + } + + &-title { + margin-bottom: math.div($spacer, 4); + font-size: $font-size-l; + line-height: $line-height-lg; + color: $neutral-98; + } + + img.cards-list__item-image { + flex-shrink: 0; + width: $spacer * 3; + height: auto; + margin: 0; + } + } + + @include media-breakpoint-up(lg) { + &__item { + width: calc(50% - $spacer); + padding: $spacer; + border: pxToRem(1) solid $neutral-20; + background: linear-gradient($neutral-20, #0e1424); + border-radius: pxToRem(12); + } + } +} diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/components/_course-card.scss b/qdrant-landing/themes/qdrant-2024/assets/css/components/_course-card.scss new file mode 100644 index 000000000..454d4749e --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/assets/css/components/_course-card.scss @@ -0,0 +1,55 @@ +@use '../helpers/functions' as *; +@use "sass:math"; + +.course-card { + width: 100%; + margin: $spacer * 2.5 0 $spacer; + padding: $spacer * 2; + border: pxToRem(1) solid $neutral-20; + background: linear-gradient($neutral-20, #0e1424); + border-radius: pxToRem(12); + + &__title { + display: flex; + justify-content: flex-start; + align-items: center; + gap: $spacer; + margin-bottom: $spacer * 1.5; + font-size: $font-size-xl; + line-height: pxToRem(30); + font-weight: 500; + color: $neutral-98; + } + + .course-card__title img { + display: block; + margin: 0; + height: pxToRem(20); + width: pxToRem(20); + } + + &__content { + color: $neutral-70; + + &.wide { + ul { + -webkit-column-count: 2; + -moz-column-count: 2; + column-count: 2; + column-gap: $spacer * 6; + margin-bottom: -$spacer * 1.5; + + li { + margin-bottom: $spacer * 1.5; + } + } + } + } + + &__button { + margin-top: $spacer * 1.5; + font-size: $font-size-s; + line-height: $line-height-sm; + font-weight: 500; + } +} diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/components/_date.scss b/qdrant-landing/themes/qdrant-2024/assets/css/components/_date.scss new file mode 100644 index 000000000..48e7199f3 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/assets/css/components/_date.scss @@ -0,0 +1,17 @@ +@use '../helpers/functions' as *; +@use "sass:math"; + +.date { + display: flex; + justify-content: flex-start; + align-items: center; + gap: math.div($spacer, 2); + margin-bottom: math.div($spacer, 2); + color: $secondary-blue-50; + + &-icon { + width: $spacer !important; + height: $spacer !important; + margin: 0 !important; + } +} diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/components/_list.scss b/qdrant-landing/themes/qdrant-2024/assets/css/components/_list.scss new file mode 100644 index 000000000..c61cff630 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/assets/css/components/_list.scss @@ -0,0 +1,33 @@ +@use '../helpers/functions' as *; +@use "sass:math"; + +.list { + color: $neutral-70; + + ul { + list-style: none; + margin-bottom: 0; + padding-left: 0; + + li { + position: relative; + padding-left: pxToRem(22); + + &:not(:last-of-type) { + margin-bottom: pxToRem(12); + } + + &:before { + content: ""; + position: absolute; + left: 0; + top: pxToRem(5); + width: pxToRem(14); + height: pxToRem(14); + background-image: url("data:image/svg+xml,%3Csvg width='14' height='15' viewBox='0 0 14 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_10609_1587)'%3E%3Cpath d='M12.6875 4.56921V10.9862L7 14.1942L1.3125 10.9862V4.56921L7 1.36121L12.6875 4.56921ZM9.53223 5.87976L6.05371 8.92371L4.08301 6.953L3.25781 7.77722L6.00098 10.5204L6.41113 10.161L10.3008 6.75867L10.7393 6.3739L9.97168 5.49597L9.53223 5.87976Z' fill='%238F98B3'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_10609_1587'%3E%3Crect width='14' height='14' fill='white' transform='translate(0 0.777832)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A"); + background-size: contain; + background-repeat: no-repeat; + } + } + } +} diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/partials/_table-of-contents.scss b/qdrant-landing/themes/qdrant-2024/assets/css/partials/_table-of-contents.scss index 1a2c1ba83..3177fede8 100644 --- a/qdrant-landing/themes/qdrant-2024/assets/css/partials/_table-of-contents.scss +++ b/qdrant-landing/themes/qdrant-2024/assets/css/partials/_table-of-contents.scss @@ -107,6 +107,13 @@ } } + &__button { + width: 100%; + font-size: $font-size-s; + line-height: $line-height-sm; + color: $neutral-100; + } + @include media-breakpoint-up(xl) { max-height: calc(100vh - 80px); width: pxToRem(232); @@ -134,7 +141,7 @@ color: $neutral-98; } - a { + a:not(.table-of-contents__button) { color: $neutral-70; transition: all 0.3s; &:hover { diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/partials/documentation/_docs-footer.scss b/qdrant-landing/themes/qdrant-2024/assets/css/partials/documentation/_docs-footer.scss index 126f9d644..d117a9e91 100644 --- a/qdrant-landing/themes/qdrant-2024/assets/css/partials/documentation/_docs-footer.scss +++ b/qdrant-landing/themes/qdrant-2024/assets/css/partials/documentation/_docs-footer.scss @@ -8,8 +8,7 @@ justify-content: center; align-items: center; padding: $spacer * 2.5 0; - border-top: 1px solid $neutral-20; - border-bottom: 1px solid $neutral-20; + border-top: pxToRem(1) solid $neutral-20; color: $neutral-98; h4 { @@ -22,6 +21,7 @@ } &__bottom { + border-top: pxToRem(1) solid $neutral-20; @extend .footer__bottom; } diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/partials/documentation/_documentation-menu.scss b/qdrant-landing/themes/qdrant-2024/assets/css/partials/documentation/_documentation-menu.scss index c2713400b..ff2d5b2ef 100644 --- a/qdrant-landing/themes/qdrant-2024/assets/css/partials/documentation/_documentation-menu.scss +++ b/qdrant-landing/themes/qdrant-2024/assets/css/partials/documentation/_documentation-menu.scss @@ -101,7 +101,7 @@ } &.active { - .docs-menu__links-group-heading>a { + &>.docs-menu__links-group-heading>a { font-weight: 600; background-color: $neutral-30; color: $neutral-90; @@ -177,6 +177,34 @@ } } + &__progress { + display: flex; + justify-content: space-between; + align-items: center; + padding: 0 math.div($spacer, 2); + + &-container { + width: pxToRem(168); + height: pxToRem(10); + background-color: $neutral-20; + border-radius: $spacer; + overflow: hidden; + } + + &-bar { + height: 100%; + border-radius: $spacer; + background-color: $primary-50; + } + + &-text { + margin-bottom: 0; + font-size: $font-size-xs; + line-height: $font-size-l; + color: $neutral-70; + } + } + @include media-breakpoint-up(xl) { display: block; height: calc(100vh - 80px); @@ -220,7 +248,7 @@ &__links-group { &.active { - .docs-menu__links-group-heading>a { + &>.docs-menu__links-group-heading>a { background-color: $neutral-20; } @@ -345,7 +373,7 @@ &__links-group { &.active { - .docs-menu__links-group-heading>a { + &>.docs-menu__links-group-heading>a { color: $neutral-30; } } @@ -376,4 +404,4 @@ } } } -} \ No newline at end of file +} diff --git a/qdrant-landing/themes/qdrant-2024/assets/js/index.js b/qdrant-landing/themes/qdrant-2024/assets/js/index.js index eff6f9301..059e02d5f 100644 --- a/qdrant-landing/themes/qdrant-2024/assets/js/index.js +++ b/qdrant-landing/themes/qdrant-2024/assets/js/index.js @@ -128,4 +128,25 @@ document.addEventListener('DOMContentLoaded', function () { window.location.href = url; }); }); + + function toggleAccordion() { + this.parentElement.classList.toggle('active'); + const panel = this.nextElementSibling; + if (panel.style.maxHeight) { + panel.style.maxHeight = null; + } else { + panel.style.maxHeight = panel.scrollHeight + 'px'; + } + } + + const accordionButtons = Array.from(document.getElementsByClassName('accordion__item-header')); + accordionButtons.forEach((el) => { + el.addEventListener('click', toggleAccordion); + }); + + const accordionDarkButtons = Array.from(document.getElementsByClassName('accordion-dark__item-header')); + accordionDarkButtons.forEach((el) => { + el.addEventListener('click', toggleAccordion); + }); + }); diff --git a/qdrant-landing/themes/qdrant-2024/assets/js/search/search.js b/qdrant-landing/themes/qdrant-2024/assets/js/search/search.js index 29c88bcb3..a177adec1 100644 --- a/qdrant-landing/themes/qdrant-2024/assets/js/search/search.js +++ b/qdrant-landing/themes/qdrant-2024/assets/js/search/search.js @@ -19,4 +19,8 @@ import 'qdrant-page-search/dist/js/search.min.js'; if (/blog/.test(window.location?.pathname)) { window.initQdrantSearch({ searchApiUrl: 'https://search.qdrant.tech/api/search', section: 'blog', partition: partition }); } + + if (/course/.test(window.location?.pathname)) { + window.initQdrantSearch({ searchApiUrl: 'https://search.qdrant.tech/api/search', section: 'course', partition: partition }); + } })(); diff --git a/qdrant-landing/themes/qdrant-2024/layouts/_default/sitemap.xml b/qdrant-landing/themes/qdrant-2024/layouts/_default/sitemap.xml index 82fb335d3..e87d83128 100644 --- a/qdrant-landing/themes/qdrant-2024/layouts/_default/sitemap.xml +++ b/qdrant-landing/themes/qdrant-2024/layouts/_default/sitemap.xml @@ -2,6 +2,15 @@ {{ range .Data.Pages }} + + + + {{ if eq .Section "course" }} + {{ continue }} + {{ end }} + + + {{- if and (or (eq (isset .Params "sitemapexclude") false) (ne .Params.sitemapExclude true)) (ne .Permalink "") }} {{ .Permalink }}{{ if not .Lastmod.IsZero }} diff --git a/qdrant-landing/themes/qdrant-2024/layouts/course/list.html b/qdrant-landing/themes/qdrant-2024/layouts/course/list.html new file mode 100644 index 000000000..a75dbe254 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/layouts/course/list.html @@ -0,0 +1,11 @@ + + + {{- partial "head.html" . -}} + +
+ {{ partial "documentation/header" . }} + {{ partial "course/content-layout" . }} +
+ + {{ partial "js.html" . }} + diff --git a/qdrant-landing/themes/qdrant-2024/layouts/course/single.html b/qdrant-landing/themes/qdrant-2024/layouts/course/single.html new file mode 100644 index 000000000..a75dbe254 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/layouts/course/single.html @@ -0,0 +1,11 @@ + + + {{- partial "head.html" . -}} + +
+ {{ partial "documentation/header" . }} + {{ partial "course/content-layout" . }} +
+ + {{ partial "js.html" . }} + diff --git a/qdrant-landing/themes/qdrant-2024/layouts/partials/course/content-layout.html b/qdrant-landing/themes/qdrant-2024/layouts/partials/course/content-layout.html new file mode 100644 index 000000000..192bfef07 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/layouts/partials/course/content-layout.html @@ -0,0 +1,74 @@ + +
+
+
+ {{ partial "course/sidebar-menu.html" (dict "context" .) }} + +
+
+
+ + {{ if not (eq .RelPermalink "/course/") }} + {{ partial "documentation/breadcrumbs" . }} + {{ end }} + +
+ {{ partial "article-content.html" . }} + + {{ $parent := .Parent }} + {{ if or (eq .Params.isLesson true) (eq $parent.Params.isLesson true) }} +
+ {{ $currentWeight := .Params.weight }} + {{ $targetWeight := add $currentWeight 1 }} + {{ $subject := site.GetPage "course" }} + + {{ $allLessons := where $subject.Pages ".Params.isLesson" true }} + + {{ $allVideos := slice }} + {{ range $lesson := $allLessons }} + {{ $allVideos = $allVideos | append $lesson.RegularPages }} + {{ end }} + + {{ $allPages := $allLessons }} + {{ range $p := $allVideos }} + {{ $allPages = $allPages | append $p }} + {{ end }} + + {{ $nextLesson := where $allPages ".Params.weight" $targetWeight }} + + {{ if gt (len $nextLesson) 0 }} + {{ $currentPage := . }} + {{ $siblings := $currentPage.Parent.RegularPages }} + + {{ $maxWeight := 0 }} + {{ range $p := $siblings }} + {{ if gt (int $p.Params.weight) $maxWeight }} + {{ $maxWeight = (int $p.Params.weight) }} + {{ end }} + {{ end }} + + {{ $next := index $nextLesson 0 }} + + {{ if eq (int $currentPage.Params.weight) $maxWeight }} + {{ $subject.Params.content.nextDay }} {{ .Parent.Title }} + {{ else }} + {{ $subject.Params.content.nextButton }} + {{ end }} + + {{ end }} +
+ {{ end }} +
+
+ + {{ partial "table-of-contents" . }} + + {{ partial "documentation/footer.html" . }} +
+
+
+
+
diff --git a/qdrant-landing/themes/qdrant-2024/layouts/partials/course/sidebar-menu.html b/qdrant-landing/themes/qdrant-2024/layouts/partials/course/sidebar-menu.html new file mode 100644 index 000000000..82c9cb441 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/layouts/partials/course/sidebar-menu.html @@ -0,0 +1,142 @@ +{{ $currentNode := .context }} + +
+
+ +
+
diff --git a/qdrant-landing/themes/qdrant-2024/layouts/partials/css.html b/qdrant-landing/themes/qdrant-2024/layouts/partials/css.html index 0c9f281fe..a1cc30cb4 100644 --- a/qdrant-landing/themes/qdrant-2024/layouts/partials/css.html +++ b/qdrant-landing/themes/qdrant-2024/layouts/partials/css.html @@ -6,7 +6,7 @@ {{ end }} -{{ if in (slice "blog" "docs" "documentation" "articles") .Section }} +{{ if in (slice "blog" "docs" "documentation" "articles" "course") .Section }} {{ $pageSearchCss := resources.Get "css/search/search.scss" | toCSS $opts | minify | resources.Fingerprint "sha512" }} {{ end }} @@ -21,7 +21,7 @@ /> {{ end }} -{{ if in (slice "docs" "documentation" "articles") .Section }} +{{ if in (slice "docs" "documentation" "articles" "course") .Section }} {{ $documentationCss := resources.Get "css/documentation.scss" | toCSS $opts | minify | resources.Fingerprint "sha512" }} {{ end }} -{{ if not (in (slice "hybrid-cloud" "docs" "documentation" "benchmarks") .Section) }} +{{ if not (in (slice "hybrid-cloud" "docs" "documentation" "course" "benchmarks") .Section) }} {{ $mainCss := resources.Get "css/main.scss" | toCSS $opts | minify | resources.Fingerprint "sha512" }} {{ end }} diff --git a/qdrant-landing/themes/qdrant-2024/layouts/partials/documentation/footer.html b/qdrant-landing/themes/qdrant-2024/layouts/partials/documentation/footer.html index 6cc314056..9da31c0d0 100644 --- a/qdrant-landing/themes/qdrant-2024/layouts/partials/documentation/footer.html +++ b/qdrant-landing/themes/qdrant-2024/layouts/partials/documentation/footer.html @@ -1,11 +1,16 @@ +{{ $currentPage := . }} + {{ with (.Site.GetPage "/headless/footer") }}