From c46a38f65eb9169cec8a5eac072cb1ac4426da90 Mon Sep 17 00:00:00 2001 From: nastyapash Date: Wed, 27 May 2026 00:26:47 +0300 Subject: [PATCH 1/8] update ai-agents page --- .../ai-agents/ai-agents-builder-patterns.md | 120 ++++++ .../content/ai-agents/ai-agents-cta-banner.md | 12 + .../content/ai-agents/ai-agents-features.md | 114 +++--- .../content/ai-agents/ai-agents-hero.md | 59 ++- .../ai-agents/ai-agents-how-it-works.md | 25 ++ .../ai-agents/ai-agents-integrations.md | 107 ++++-- .../content/ai-agents/ai-agents-proof.md | 17 + .../content/ai-agents/ai-agents-resources.md | 62 ++++ .../qdrant-2024/assets/css/default.scss | 7 + .../assets/css/partials/_cta-banner.scss | 11 + .../_ai-agents-builder-patterns.scss | 343 ++++++++++++++++++ .../ai-agents/_ai-agents-features.scss | 230 ++++++++++++ .../partials/ai-agents/_ai-agents-hero.scss | 256 +++++++++++++ .../ai-agents/_ai-agents-how-it-works.scss | 251 +++++++++++++ .../ai-agents/_ai-agents-integrations.scss | 115 ++++++ .../partials/ai-agents/_ai-agents-proof.scss | 61 ++++ .../ai-agents/_ai-agents-resources.scss | 71 ++++ .../qdrant-2024/assets/js/copy-code-new.js | 39 ++ .../qdrant-2024/layouts/ai-agents/list.html | 25 +- .../layouts/partials/ai-agents-features.html | 42 --- .../ai-agents/ai-agents-builder-patterns.html | 196 ++++++++++ .../ai-agents/ai-agents-features.html | 63 ++++ .../partials/ai-agents/ai-agents-hero.html | 68 ++++ .../ai-agents/ai-agents-how-it-works.html | 31 ++ .../ai-agents/ai-agents-integrations.html | 31 ++ .../partials/ai-agents/ai-agents-proof.html | 19 + .../ai-agents/ai-agents-resources.html | 25 ++ .../layouts/partials/cta-banner.html | 13 +- .../qdrant-2024/layouts/partials/js.html | 5 + .../static/icons/outline/boxes-purple.svg | 3 + .../static/icons/outline/brain-blue.svg | 3 + .../static/icons/outline/building-blue.svg | 3 + .../static/icons/outline/chef-hat-blue.svg | 3 + .../icons/outline/filter-blue-large.svg | 3 + .../static/icons/outline/gauge-blue.svg | 3 + .../icons/outline/git-branch-orange.svg | 3 + .../static/icons/outline/git-merge-blue.svg | 3 + .../static/icons/outline/rocket-blue-big.svg | 3 + .../static/icons/outline/target-green.svg | 5 + .../static/icons/outline/text-search-pink.svg | 3 + .../img/ai-agents-logos/claude-code.svg | 13 + .../static/img/ai-agents-logos/codex.svg | 11 + .../static/img/ai-agents-logos/cognee.svg | 4 + .../static/img/ai-agents-logos/crew-ai.svg | 6 + .../static/img/ai-agents-logos/cursor.svg | 20 + .../static/img/ai-agents-logos/dust.svg | 10 + .../static/img/ai-agents-logos/flowise.svg | 14 + .../static/img/ai-agents-logos/go.svg | 7 + .../static/img/ai-agents-logos/haystack.svg | 20 + .../static/img/ai-agents-logos/java.svg | 15 + .../static/img/ai-agents-logos/lang-chain.svg | 14 + .../img/ai-agents-logos/llama-index.svg | 13 + .../static/img/ai-agents-logos/lyzr.svg | 12 + .../static/img/ai-agents-logos/mastra.svg | 3 + .../static/img/ai-agents-logos/mem0.svg | 8 + .../static/img/ai-agents-logos/n8n.svg | 6 + .../static/img/ai-agents-logos/net.svg | 3 + .../static/img/ai-agents-logos/open-code.svg | 17 + .../static/img/ai-agents-logos/pi.svg | 4 + .../static/img/ai-agents-logos/python.svg | 11 + .../static/img/ai-agents-logos/rust.svg | 11 + .../static/img/ai-agents-logos/trustgraph.svg | 13 + .../static/img/ai-agents-logos/typescript.svg | 11 + .../static/img/ai-agents-logos/voiceflow.svg | 3 + .../static/img/ai-agents-memory.svg | 100 +++++ 65 files changed, 2644 insertions(+), 158 deletions(-) create mode 100644 qdrant-landing/content/ai-agents/ai-agents-builder-patterns.md create mode 100644 qdrant-landing/content/ai-agents/ai-agents-cta-banner.md create mode 100644 qdrant-landing/content/ai-agents/ai-agents-how-it-works.md create mode 100644 qdrant-landing/content/ai-agents/ai-agents-proof.md create mode 100644 qdrant-landing/content/ai-agents/ai-agents-resources.md create mode 100644 qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-builder-patterns.scss create mode 100644 qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-features.scss create mode 100644 qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-hero.scss create mode 100644 qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-how-it-works.scss create mode 100644 qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-integrations.scss create mode 100644 qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-proof.scss create mode 100644 qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-resources.scss create mode 100644 qdrant-landing/themes/qdrant-2024/assets/js/copy-code-new.js delete mode 100644 qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents-features.html create mode 100644 qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-builder-patterns.html create mode 100644 qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-features.html create mode 100644 qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-hero.html create mode 100644 qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-how-it-works.html create mode 100644 qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-integrations.html create mode 100644 qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-proof.html create mode 100644 qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-resources.html create mode 100644 qdrant-landing/themes/qdrant-2024/static/icons/outline/boxes-purple.svg create mode 100644 qdrant-landing/themes/qdrant-2024/static/icons/outline/brain-blue.svg create mode 100644 qdrant-landing/themes/qdrant-2024/static/icons/outline/building-blue.svg create mode 100644 qdrant-landing/themes/qdrant-2024/static/icons/outline/chef-hat-blue.svg create mode 100644 qdrant-landing/themes/qdrant-2024/static/icons/outline/filter-blue-large.svg create mode 100644 qdrant-landing/themes/qdrant-2024/static/icons/outline/gauge-blue.svg create mode 100644 qdrant-landing/themes/qdrant-2024/static/icons/outline/git-branch-orange.svg create mode 100644 qdrant-landing/themes/qdrant-2024/static/icons/outline/git-merge-blue.svg create mode 100644 qdrant-landing/themes/qdrant-2024/static/icons/outline/rocket-blue-big.svg create mode 100644 qdrant-landing/themes/qdrant-2024/static/icons/outline/target-green.svg create mode 100644 qdrant-landing/themes/qdrant-2024/static/icons/outline/text-search-pink.svg create mode 100755 qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/claude-code.svg create mode 100755 qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/codex.svg create mode 100755 qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/cognee.svg create mode 100755 qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/crew-ai.svg create mode 100755 qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/cursor.svg create mode 100755 qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/dust.svg create mode 100755 qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/flowise.svg create mode 100755 qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/go.svg create mode 100755 qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/haystack.svg create mode 100755 qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/java.svg create mode 100755 qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/lang-chain.svg create mode 100755 qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/llama-index.svg create mode 100755 qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/lyzr.svg create mode 100755 qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/mastra.svg create mode 100755 qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/mem0.svg create mode 100755 qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/n8n.svg create mode 100755 qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/net.svg create mode 100755 qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/open-code.svg create mode 100755 qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/pi.svg create mode 100755 qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/python.svg create mode 100755 qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/rust.svg create mode 100755 qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/trustgraph.svg create mode 100755 qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/typescript.svg create mode 100755 qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/voiceflow.svg create mode 100644 qdrant-landing/themes/qdrant-2024/static/img/ai-agents-memory.svg diff --git a/qdrant-landing/content/ai-agents/ai-agents-builder-patterns.md b/qdrant-landing/content/ai-agents/ai-agents-builder-patterns.md new file mode 100644 index 0000000000..7727b4bcdb --- /dev/null +++ b/qdrant-landing/content/ai-agents/ai-agents-builder-patterns.md @@ -0,0 +1,120 @@ +--- +subtitle: BUILDER PATTERNS +title: What Developers Build with Qdrant +description: Common agent architectures and the retrieval patterns behind them. +features: + - id: 0 + title: Retrieval-Augmented Generation + description: Your agent queries Qdrant for semantically relevant documents, passes them as context to the LLM, and generates grounded answers instead of hallucinating. Use hybrid search (dense + sparse vectors) to catch both semantic meaning and exact terms. Add payload filters to scope retrieval by source, date, or access level. + codeBar: rag_agent.py + code: | + # Hybrid search: dense + sparse + results = client.query_points( + collection_name="knowledge_base", + prefetch=[ + Prefetch(query=dense_vec, using="dense", limit=20), + Prefetch(query=sparse_vec, using="sparse", limit=20), + ], + query=FusionQuery( + fusion=Fusion.RRF + ), + limit=5 + ) + cardTitle: 75% + cardContent: Dust reduced RAM usage by 75% after migrating from in-memory retrieval to Qdrant for production RAG. + - id: 1 + title: Real-Time Voice Agents + description: Voice agents can't tolerate latency. Every millisecond in the retrieval loop compounds into awkward pauses. Qdrant's Rust-based engine delivers sub-25ms P99 retrieval so your conversational agent stays responsive.

Filter by session and speaker to retrieve only the current conversation's context without cross-talk between concurrent calls. + codeBar: voice_agent.py + code: | + # Low-latency session-scoped retrieval + context = client.query_points( + collection_name="call_memory", + query=embed(transcript_chunk), + query_filter=Filter( + must=[ + FieldCondition( + key="call_id", + match=MatchValue( + value=active_call + ) + ) + ] + ), + limit=3 + ) + cardTitle: 25ms + cardContent: Tavus achieved 25ms retrieval for conversational AI without awkward pauses. + - id: 2 + title: Customer Support Agents + description: Index your knowledge base, past tickets, and product docs. The support agent retrieves the most relevant resolution on the first pass, avoiding the loop-and-retry pattern that frustrates users. Use Qdrant's multi-tenancy (payload-based partitioning) to isolate each customer's data without deploying separate collections. + codeBar: support_agent.py + code: | + # Tenant-isolated knowledge retrieval  + answer = client.query_points( + collection_name="support_kb", + query=embed(ticket_text), + query_filter=Filter( + must=[ + FieldCondition( + key="tenant_id", + match=MatchValue( + value=org_id + ) + ) + ] + ), + limit=5 + ) + cardTitle: 90% + cardContent: Lyzr reduced latency by 90% serving support agents on Qdrant. + - id: 3 + title: Recommendation Agents + description: Embed user behavior, product attributes, and content metadata into Qdrant. Your recommendation agent queries with the user's current context and gets semantically relevant suggestions, not just collaborative filtering. Combine dense embeddings with sparse keyword vectors for hybrid recommendations that understand both "similar style" and "exact feature match." + codeBar: rec_agent.py + code: | + # Discovery: find items unlike dislikes + recs = client.discover( + collection_name="products", + target=user_preference_vec, + context=[ + ContextPair( + positive=liked_item_id, + negative=disliked_item_id, + ) + ], + limit=10 + ) + cardTitle: 1B+ + cardContent: Tripadvisor searches across billions of user-generated content pieces with Qdrant. + - id: 4 + title: Multi-Agent Shared Memory + description: Multiple agents (planner, researcher, executor) write to and read from a shared Qdrant collection. Each agent tags its outputs with role and step metadata, so downstream agents retrieve only the context they need.

Use payload filters to scope reads by agent role, workflow step, or timestamp to prevent context pollution across agents. + codeBar: multi_agent.py + code: | + # Executor reads planner's output + plan = client.query_points( + collection_name="workflow_memory", + query=embed(current_task), + query_filter=Filter( + must=[ + FieldCondition( + key="agent_role", + match=MatchValue( + value="planner" + ) + ), + FieldCondition( + key="workflow_id", + match=MatchValue( + value=wf_id + ) + ) + ] + ), + limit=10 + ) + cardTitle: 4x + cardContent: Voiceflow runs managed RAG on Qdrant, powering multi-step conversational workflows at scale. +sitemapExclude: true +--- diff --git a/qdrant-landing/content/ai-agents/ai-agents-cta-banner.md b/qdrant-landing/content/ai-agents/ai-agents-cta-banner.md new file mode 100644 index 0000000000..98a063c072 --- /dev/null +++ b/qdrant-landing/content/ai-agents/ai-agents-cta-banner.md @@ -0,0 +1,12 @@ +--- +type: cta-banner +title: Your Agents Deserve Better Retrieval +description: Start with the free tier. Scale to billions of vectors when you're ready. +button: + text: Start Building Free + url: / +secondaryButton: + text: Talk to an Engineer + url: / +sitemapExclude: true +--- \ No newline at end of file diff --git a/qdrant-landing/content/ai-agents/ai-agents-features.md b/qdrant-landing/content/ai-agents/ai-agents-features.md index f7c0d983a1..b92bd933c9 100644 --- a/qdrant-landing/content/ai-agents/ai-agents-features.md +++ b/qdrant-landing/content/ai-agents/ai-agents-features.md @@ -1,62 +1,60 @@ --- -image: - src: /img/ai-agents-dashboard-cloud.png - alt: Dashboard cloud -title: AI Agents with Qdrant -description: AI agents powered by Qdrant leverage advanced vector search to access and retrieve high-dimensional data in real-time, enabling intelligent, Agentic-RAG driven, multi-step decision-making across dynamic environments. -cases: -- id: 0 - title: Multimodal Data Handling - description: Qdrant enables AI agents to process and retrieve high-dimensional vectors from diverse data types (text, images, audio), supporting more comprehensive decision-making in multimodal environments. -- id: 1 - title: Adaptive Learning - description: Qdrant supports continuous learning by enabling efficient vector retrieval and updates, allowing agents to learn and evolve based on real-time interactions and new data points. -featuresTitle: Qdrant equips AI agents to adapt, learn, and collaborate efficiently. +subtitle: DEVELOPER TOOLS +title: Purpose-Built for Agent Builders +description: Tools and patterns that make agent memory a solved problem, not a research project. +button: + text: Start Building with Skills + url: /qdrant/skills +codeBar: SKILL.md +code: | + # Agent Memory Skill + # + # Give your agent persistent, filtered + # memory using Qdrant as the retrieval + # backend. + + # Setup + # pip install qdrant-client + + # Collection Schema + # vectors: + # dense: { size: 1536, distance: Cosine } + # sparse: { index: { on_disk: true } } + # payload_index: + # - session_id: keyword + # - agent_role: keyword + # - timestamp: integer + # - tool_name: keyword + + # Query Pattern + # Always filter by session_id + agent_role + # Use hybrid (dense+sparse) for knowledge + # Use dense-only for conversation history features: -- id: 0 - icon: - src: /icons/outline/precision-blue.svg - alt: Precision - title: Contextual Precision - description: Qdrant’s hybrid search combines semantic vector search, lexical search, and metadata filtering, enabling AI Agents to retrieve highly relevant and contextually precise information. This enhances decision-making by allowing agents to leverage both meaning-based and keyword-based strategies, ensuring accuracy and relevance for complex queries in dynamic environments. - link: - text: Hybrid Search - url: /articles/hybrid-search/ -- id: 1 - icon: - src: /icons/outline/multitenancy-blue.svg - alt: Multitenancy - title: Multi-Agent Systems - description: Qdrant’s scalability and multitenancy ensures that multiple agents can collaborate in distributed systems, enabling seamless coordination and communication - key for Agentic RAG workflows. - link: - text: Multitenancy - url: /articles/multitenancy/ -- id: 2 - icon: - src: /icons/outline/time-blue.svg - alt: Time - title: Real Time Decision Making - description: Qdrant’s real-time, advanced vector search enables AI agents to act instantly on live data, which is crucial for time-sensitive, autonomous decision-making. - link: - text: HNSW - url: /articles/filterable-hnsw/ -- id: 3 - icon: - src: /icons/outline/server-rack-blue.svg - alt: Server rack - title: Optimized CPU Performance for Embedding Processing - description: Qdrant’s architecture is optimized for high-throughput embedding processing, minimizing CPU load and preventing performance bottlenecks. This enables AI agents in Agentic RAG workflows to execute complex, multi-step tasks efficiently, ensuring smooth operation even at scale. - link: - text: Distributed Deployment - url: /documentation/distributed_deployment/ -- id: 4 - icon: - src: /icons/outline/speedometer-blue.svg - alt: Speedometer - title: Semantic Cache for Rapid Query Handling - description: Qdrant enhances AI agent efficiency with semantic caching, which preserves results of queries based on semantic equivalence rather than exact matches. This method reduces query processing times and system load by reusing previously computed answers, essential for high-throughput AI applications. - link: - text: Semantic Cache - url: /articles/semantic-cache-ai-data-retrieval/ + - id: 0 + icon: + src: /icons/outline/text-search-pink.svg + alt: Text search + content: Hybrid search combines dense embeddings with BM25 sparse vectors via reciprocal rank fusion + - id: 1 + icon: + src: /icons/outline/filter-blue-large.svg + alt: Filter + content: Payload filtering scopes retrieval by any metadata field without post-processing + - id: 2 + icon: + src: /icons/outline/boxes-purple.svg + alt: Boxes + content: Multi-vector support stores ColBERT token-level representations natively + - id: 3 + icon: + src: /icons/outline/target-green.svg + alt: Target + content: Quantization (scalar, binary, product) cuts memory 4x while preserving accuracy + - id: 4 + icon: + src: /icons/outline/git-branch-orange.svg + alt: Git branch + content: Real-time upserts let agents write new memories without index rebuild delays sitemapExclude: true --- diff --git a/qdrant-landing/content/ai-agents/ai-agents-hero.md b/qdrant-landing/content/ai-agents/ai-agents-hero.md index d48a9c6dbe..ce5b548385 100644 --- a/qdrant-landing/content/ai-agents/ai-agents-hero.md +++ b/qdrant-landing/content/ai-agents/ai-agents-hero.md @@ -1,14 +1,51 @@ --- -title: AI Agents -description: Unlock the full potential of your AI agents with Qdrant’s powerful vector search and scalable infrastructure, allowing them to handle complex tasks, adapt in real time, and drive smarter, data-driven outcomes across any environment. -startFree: - text: Get Started - url: https://cloud.qdrant.io/signup -learnMore: - text: Learn More - url: "#ai-agents" -image: - src: /img/vectors/vector-4.svg - alt: AI agents chat +subtitle: SOLUTIONS · AGENTIC AI +title: Give Your Agents Memory That Works +description: Store, retrieve, and reason over context with vector search. Drop Qdrant into your agent's retrieval loop in under 10 minutes. +containedButton: + text: Quickstart Guide + url: / +outlinedButton: + text: View Examples + url: / +codeBar: agent_memory.py +code: | + from qdrant_client import QdrantClient + from qdrant_client.models import Filter, FieldCondition, MatchValue + + # Connect to Qdrant + client = QdrantClient("localhost", port=6333) + + # Agent retrieves relevant context + results = client.query_points( + collection_name="agent_memory", + query=embed(user_message), + query_filter=Filter( + must=[ + FieldCondition( + key="session_id", + match=MatchValue(value=session) + ) + ] + ), + limit=5 + ) + + # Feed context to LLM + context = [r.payload["text"] for r in results.points] +logosTitle: Trusted by +logos: + - id: 0 + src: /img/ai-agents-logos/lyzr.svg + alt: Lyzr logo + - id: 1 + src: /img/ai-agents-logos/dust.svg + alt: Dust logo + - id: 2 + src: /img/ai-agents-logos/voiceflow.svg + alt: Voiceflow logo + - id: 3 + src: /img/ai-agents-logos/trustgraph.svg + alt: TrustGraph logo sitemapExclude: true --- \ No newline at end of file diff --git a/qdrant-landing/content/ai-agents/ai-agents-how-it-works.md b/qdrant-landing/content/ai-agents/ai-agents-how-it-works.md new file mode 100644 index 0000000000..6936350a1e --- /dev/null +++ b/qdrant-landing/content/ai-agents/ai-agents-how-it-works.md @@ -0,0 +1,25 @@ +--- +subtitle: HOW IT WORKS +title: Three Steps to Agent Memory +description: No infra team required. Go from zero to production retrieval in a single session. +steps: + - id: 0 + title: Store Context + description: Embed and upsert conversation history, documents, tool outputs, or any unstructured data your agent needs to remember. + code: | + client.upsert(collection, points) + - id: 1 + title: Retrieve with Filters + description: Combine semantic similarity with metadata filters (session, user, timestamp, tool) to get precisely scoped context every query. + code: | + client.query_points(query, filter) + - id: 2 + title: Feed to Your LLM + description: Inject retrieved context into your agent's prompt. Qdrant handles relevance ranking so your LLM generates grounded responses. + code: | + messages += [{"role": "system",...}] +image: + src: /img/ai-agents-memory.svg + alt: Vector Search for Agent Memory +sitemapExclude: true +--- \ No newline at end of file diff --git a/qdrant-landing/content/ai-agents/ai-agents-integrations.md b/qdrant-landing/content/ai-agents/ai-agents-integrations.md index 93e47217b4..224d078744 100644 --- a/qdrant-landing/content/ai-agents/ai-agents-integrations.md +++ b/qdrant-landing/content/ai-agents/ai-agents-integrations.md @@ -1,34 +1,83 @@ --- -title: Qdrant integrates with the leading AI Agent frameworks +subtitle: INTEGRATIONS +title: Drop into Your Existing Stack +description: First-class SDKs and framework integrations. No wrappers, no adapters. integrations: -- id: 0 - icon: - src: /img/integrations/integration-lang-graph.svg - alt: LangGraph logo - title: LangGraph - description: Framework for managing multi-LLM workflows with structured graphs for AI agents. - url: /documentation/frameworks/langgraph/ -- id: 1 - icon: - src: /img/integrations/integration-open-ai.svg - alt: Open AI logo - title: Swarm - description: Decentralized platform enabling collaboration among AI agents for task completion. - url: /documentation/frameworks/ -- id: 2 - icon: - src: /img/integrations/integration-crew-ai.svg - alt: Crew AI logo - title: CrewAI - description: Team-based AI agent collaboration system orchestrating multi-agent workflows efficiently. - url: /documentation/frameworks/crewai/ -- id: 3 - icon: - src: /img/integrations/integration-auto-gen.svg - alt: AutoGen logo - title: AutoGen - description: Automation tool for generating AI agent workflows and automating complex tasks. - url: /documentation/frameworks/autogen/ + - id: 0 + title: Orchestration Frameworks + logos: + - id: 0 + src: /img/ai-agents-logos/lang-chain.svg + alt: LangChain logo + - id: 1 + src: /img/ai-agents-logos/llama-index.svg + alt: LlamaIndex logo + - id: 2 + src: /img/ai-agents-logos/crew-ai.svg + alt: CrewAI logo + - id: 3 + src: /img/ai-agents-logos/mastra.svg + alt: Mastra logo + - id: 4 + src: /img/ai-agents-logos/haystack.svg + alt: Haystack logo + - id: 1 + title: No-Code / Low-Code + logos: + - id: 0 + src: /img/ai-agents-logos/n8n.svg + alt: N8n logo + - id: 1 + src: /img/ai-agents-logos/flowise.svg + alt: Flowise logo + - id: 2 + title: Agent Memory + logos: + - id: 0 + src: /img/ai-agents-logos/mem0.svg + alt: Mem0 logo + - id: 1 + src: /img/ai-agents-logos/cognee.svg + alt: Cognee logo + - id: 3 + title: SDKs + logos: + - id: 0 + src: /img/ai-agents-logos/python.svg + alt: Python logo + - id: 1 + src: /img/ai-agents-logos/typescript.svg + alt: Typescript logo + - id: 2 + src: /img/ai-agents-logos/rust.svg + alt: Rust logo + - id: 3 + src: /img/ai-agents-logos/go.svg + alt: Go logo + - id: 4 + src: /img/ai-agents-logos/net.svg + alt: .Net logo + - id: 5 + src: /img/ai-agents-logos/java.svg + alt: Java logo + - id: 4 + title: Coding Agents + logos: + - id: 0 + src: /img/ai-agents-logos/claude-code.svg + alt: ClaudeCode logo + - id: 1 + src: /img/ai-agents-logos/cursor.svg + alt: Cursor logo + - id: 2 + src: /img/ai-agents-logos/codex.svg + alt: Codex logo + - id: 3 + src: /img/ai-agents-logos/open-code.svg + alt: OpenCode logo + - id: 4 + src: /img/ai-agents-logos/pi.svg + alt: Pi logo sitemapExclude: true --- diff --git a/qdrant-landing/content/ai-agents/ai-agents-proof.md b/qdrant-landing/content/ai-agents/ai-agents-proof.md new file mode 100644 index 0000000000..4ef3896889 --- /dev/null +++ b/qdrant-landing/content/ai-agents/ai-agents-proof.md @@ -0,0 +1,17 @@ +--- +proofs: +- id: 0 + title: 29K+ + description: GitHub stars on the open-source engine +- id: 1 + title: 250M+ + description: Total downloads across all packages +- id: 2 + title: 60K + description: Developers in our community +- id: 3 + title: <5ms + description: P95 retrieval latency at production scale +sitemapExclude: true +--- + diff --git a/qdrant-landing/content/ai-agents/ai-agents-resources.md b/qdrant-landing/content/ai-agents/ai-agents-resources.md new file mode 100644 index 0000000000..385fa45b18 --- /dev/null +++ b/qdrant-landing/content/ai-agents/ai-agents-resources.md @@ -0,0 +1,62 @@ +--- +subtitle: RESOURCES +title: Start Building +description: Everything you need to go from prototype to production. +resources: +- id: 0 + icon: + src: /icons/outline/rocket-blue-big.svg + alt: Rocket + title: Quickstart Guide + description: Run your first query in under five minutes. + link: + url: /documentation/quickstart/ + text: Build Your First Collection +- id: 1 + icon: + src: /icons/outline/brain-blue.svg + alt: Brain + title: Agentic Vector Search + description: Build Performant, Scaled Agentic Vector Search + link: + url: /articles/agentic-builders-guide/ + text: Follow the Tutorial +- id: 2 + icon: + src: /icons/outline/git-merge-blue.svg + alt: Git-merge + title: Hybrid Search Guide + description: Combine dense and sparse vectors with reciprocal rank fusion for best-of-both retrieval. + link: + url: /articles/hybrid-search/ + text: Learn Hybrid Retrieval +- id: 3 + icon: + src: /icons/outline/chef-hat-blue.svg + alt: Chef hat + title: Agentic Skills + description: Use solutions architect knowledge encoded in a format that AI agents can navigate + link: + url: /blog/qdrant-skills-release/ + text: Explore Agent Patterns +- id: 4 + icon: + src: /icons/outline/gauge-blue.svg + alt: Gauge + title: Performance Tuning + description: Optimize latency, throughput, and memory for production agent workloads. + link: + url: /documentation/ops-optimization/optimize/ + text: Read the Performance Guide +- id: 5 + icon: + src: /icons/outline/building-blue.svg + alt: Building + title: Multi-Tenancy Patterns + description: Isolate agent memory per user or organization with payload-based partitioning. + link: + url: /documentation/manage-data/multitenancy/ + text: Read the Partitioning Guide +sitemapExclude: true +--- + diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/default.scss b/qdrant-landing/themes/qdrant-2024/assets/css/default.scss index eb48b1bcbe..99a9a173eb 100644 --- a/qdrant-landing/themes/qdrant-2024/assets/css/default.scss +++ b/qdrant-landing/themes/qdrant-2024/assets/css/default.scss @@ -66,6 +66,13 @@ @import 'partials/rag-evaluation-guide-features'; @import 'partials/progress-bar'; @import 'partials/table-of-contents'; +@import 'partials/ai-agents/ai-agents-builder-patterns'; +@import 'partials/ai-agents/ai-agents-features'; +@import 'partials/ai-agents/ai-agents-hero'; +@import 'partials/ai-agents/ai-agents-integrations'; +@import 'partials/ai-agents/ai-agents-how-it-works'; +@import 'partials/ai-agents/ai-agents-proof'; +@import 'partials/ai-agents/ai-agents-resources'; @import 'partials/ai-agents-webinar'; @import 'partials/ai-agents-get-started'; @import 'partials/ai-agents-video'; diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/partials/_cta-banner.scss b/qdrant-landing/themes/qdrant-2024/assets/css/partials/_cta-banner.scss index 6a6f89906b..338c64e721 100644 --- a/qdrant-landing/themes/qdrant-2024/assets/css/partials/_cta-banner.scss +++ b/qdrant-landing/themes/qdrant-2024/assets/css/partials/_cta-banner.scss @@ -100,6 +100,13 @@ letter-spacing: -0.2px; } } + + &__buttons { + display: flex; + flex-direction: column; + align-items: center; + gap: $spacer; + } &__button { white-space: nowrap; @@ -144,6 +151,10 @@ line-height: 1.5; } + &__buttons { + flex-direction: row; + } + &__illustration { &::before { display: none; diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-builder-patterns.scss b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-builder-patterns.scss new file mode 100644 index 0000000000..9c0e7eb5c2 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-builder-patterns.scss @@ -0,0 +1,343 @@ +@use '../../helpers/functions' as *; +@use 'sass:math'; + +.ai-agents-builder-patterns { + padding-bottom: $spacer * 5; + background-color: $neutral-94; + + &__header { + margin-bottom: $spacer * 4; + padding-top: $spacer * 5; + border-top: pxToRem(1) solid $neutral-80; + text-align: center; + } + + &__subtitle { + margin-bottom: $spacer; + font-family: 'Geist Mono', $font-family-monospace; + font-weight: $font-weight-medium; + font-size: $font-size-s; + line-height: $line-height-sm; + color: $neutral-30; + text-transform: uppercase; + } + + &__title { + margin-bottom: $spacer; + font-size: $h4-font-size; + line-height: $spacer * 3; + color: $neutral-20; + } + + &__description { + margin-bottom: 0; + color: $neutral-30; + } + + &__content { + display: flex; + flex-direction: column; + gap: 0; + } + + &__features { + display: flex; + flex-direction: column; + width: 100%; + } + + &__feature { + display: flex; + flex-direction: column; + padding: $spacer * 1.5 0; + border-bottom: pxToRem(1) solid $neutral-90; + cursor: pointer; + transition: border-color 0.2s ease; + overflow: hidden; + + &:first-child { + padding-top: 0; + } + + &-title { + font-size: $font-size-xl; + line-height: pxToRem(30); + font-weight: 600; + color: $neutral-20; + margin: 0; + } + + &-body { + max-height: 0; + opacity: 0; + overflow: hidden; + transition: + max-height 0.4s ease, + opacity 0.3s ease, + margin 0.3s ease; + margin-top: 0; + + .ai-agents-builder-patterns__feature--active & { + max-height: none; + opacity: 1; + margin-top: $spacer; + } + } + + &-description { + color: $neutral-30; + margin: 0; + } + } + + &__visual { + display: none + } + + &__visual-block { + display: none; + + &--mobile { + display: block; + } + + &:nth-of-type(1), &:nth-of-type(4) { + .ai-agents-builder-patterns__card { + border: pxToRem(1) solid $secondary-violet-70; + background-color: $secondary-violet-90; + + &-title { + color: $secondary-violet-50; + } + } + } + + &:nth-of-type(2), &:nth-of-type(5) { + .ai-agents-builder-patterns__card { + border: pxToRem(1) solid $secondary-blue-70; + background-color: $secondary-blue-90; + + &-title { + color: $secondary-blue-50; + } + } + } + + &:nth-of-type(3), &:nth-of-type(6) { + .ai-agents-builder-patterns__card { + border: pxToRem(1) solid $secondary-teal-70; + background-color: $secondary-teal-90; + + &-title { + color: $secondary-teal-50; + } + } + } + } + + &__code { + overflow: hidden; + width: 100%; + height: pxToRem(400); + margin-top: $spacer * 2.5; + border-radius: $spacer; + background-color: $neutral-90; + border-top: pxToRem(1) solid $neutral-90; + border-right: pxToRem(1) solid $neutral-90; + border-left: pxToRem(1) solid $neutral-90; + + &-header { + display: flex; + justify-content: space-between; + align-items: center; + height: $spacer * 2.5; + padding: 0 $spacer * 1.5; + background-color: $neutral-90; + border-bottom: pxToRem(1) solid $neutral-90; + } + + &-window-buttons { + display: flex; + gap: pxToRem(7); + + div { + height: pxToRem(8); + width: pxToRem(8); + border-radius: 50%; + } + + &__close { + background-color: $error-50; + } + + &__minimize { + background-color: $neutral-60; + } + + &__expand { + background-color: $success-50; + } + } + + &-bar { + margin-bottom: 0; + font-size: $font-size-s; + line-height: $line-height-sm; + color: $neutral-30; + } + + &-content { + display: flex; + align-items: flex-start; + height: pxToRem(360); + margin: 0 math.div($spacer, 4); + padding: pxToRem(28) pxToRem(20) pxToRem(28) pxToRem(28); + background: $neutral-98; + border-right: pxToRem(1) solid $neutral-98; + border-left: pxToRem(1) solid $neutral-98; + overflow-y: auto; + overflow-x: hidden; + word-break: break-word; + overflow-wrap: anywhere; + scrollbar-width: none; + -ms-overflow-style: none; + + &::-webkit-scrollbar { + width: 0; + height: 0; + } + + .highlight { + width: calc(100% - pxToRem(24)); + margin-bottom: 0; + background: transparent; + + pre { + display: block; + width: 100%; + padding: 0; + background: transparent; + white-space: pre-wrap; + overflow-x: hidden; + } + + code { + display: block; + width: 100%; + overflow-wrap: anywhere; + word-break: break-word; + + .line { + margin-bottom: 0; + } + + * { + font-size: $font-size-s; + line-height: $line-height-sm; + color: #28324D; + } + + .c1 { + color: #717C99; + } + + .s2, .nb { + color: #26A69A; + } + + .k, .kn { + color: #7E75FF; + } + + .mi { + color: #29B6F6; + } + } + } + + &-button { + display: flex; + justify-content: center; + align-items: center; + padding: pxToRem(7); + border: pxToRem(1) solid $neutral-90; + border-radius: math.div($spacer, 4); + background: $neutral-98; + + svg { + height: pxToRem(14); + width: pxToRem(14); + } + } + } + } + + &__card { + display: flex; + align-items: center; + gap: $spacer; + margin-top: $spacer; + padding: $spacer $spacer * 1.5; + border-radius: math.div($spacer, 2); + + &-title { + margin-bottom: 0; + font-size: $h5-font-size; + line-height: pxToRem(42); + font-weight: $font-weight-medium; + } + + &-content { + margin-bottom: 0; + font-family: 'Geist Mono', $font-family-monospace; + font-size: $font-size-xs; + line-height: pxToRem(18); + color: $neutral-30; + } + } + + @include media-breakpoint-up(lg) { + &__title { + font-size: $h3-font-size; + line-height: pxToRem(52); + } + + &__description { + margin-top: $spacer; + font-size: $font-size-l; + line-height: $line-height-lg; + } + + &__content { + flex-direction: row; + gap: $spacer * 5; + } + + &__visual { + display: block; + padding: $spacer; + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='540' height='526' viewBox='0 0 540 526' fill='none'%3E%3Crect width='540' height='526' fill='url(%23pattern0)'/%3E%3Cdefs%3E%3Cpattern id='pattern0' patternUnits='userSpaceOnUse' patternTransform='matrix(77 0 0 77 -0.5 -0.5)' viewBox='-0.5 -0.5 77 77' width='1' height='1' preserveAspectRatio='none'%3E%3Crect width='77' height='77' stroke='%23D4D9E6'/%3E%3C/pattern%3E%3C/defs%3E%3C/svg%3E"); + } + + &__visual-block { + display: none; + + &--active { + display: block; + } + + &--mobile { + display: none; + } + } + + &__features { + width: pxToRem(482); + flex-shrink: 0; + } + + &__code { + margin-top: 0; + } + } +} \ No newline at end of file diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-features.scss b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-features.scss new file mode 100644 index 0000000000..0f30732b6f --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-features.scss @@ -0,0 +1,230 @@ +@use '../../helpers/functions' as *; +@use 'sass:math'; + +.ai-agents-features { + padding-bottom: $spacer * 5; + background: radial-gradient( + 115.51% 123.53% at 50% -4.94%, + rgba(67, 37, 174, 0.00) 0%, + rgba(67, 37, 174, 0.00) 75%, + rgba(67, 37, 174, 0.80) 90%, + #6143E0 100%), + $neutral-10; + + &__header { + margin-bottom: $spacer * 4; + padding-top: $spacer * 5; + border-top: pxToRem(1) solid $neutral-30; + text-align: center; + } + + &__subtitle { + margin-bottom: $spacer; + font-family: 'Geist Mono', $font-family-monospace; + font-weight: $font-weight-medium; + font-size: $font-size-s; + line-height: $line-height-sm; + color: $neutral-70; + text-align: center; + text-transform: uppercase; + } + + &__title { + margin-bottom: $spacer; + text-align: center; + font-size: $h4-font-size; + line-height: $spacer * 3; + color: $neutral-98; + } + + &__description { + margin-bottom: $spacer; + text-align: center; + color: $neutral-70; + } + + &__code-container { + position: relative; + + &:after { + display: block; + content: ""; + position: absolute; + bottom: 0; + left: 0; + width: 100%; + height: pxToRem(240); + background: linear-gradient(180deg, rgba($neutral-10, 0) 4.25%, $neutral-10 88.85%); + } + } + + &__code { + overflow: hidden; + width: 100%; + height: pxToRem(520); + margin-bottom: $spacer * 4; + border-radius: $spacer; + background-color: $neutral-10; + border: pxToRem(1) solid $neutral-20; + + &-header { + display: flex; + justify-content: space-between; + align-items: center; + height: $spacer * 3; + padding: 0 $spacer * 1.5; + background-color: $neutral-10; + border-bottom: pxToRem(1) solid $neutral-20; + } + + &-window-buttons { + display: flex; + gap: pxToRem(6); + + div { + height: pxToRem(11); + width: pxToRem(11); + border-radius: 50%; + } + + &__close { + background-color: $error-50; + } + + &__minimize { + background-color: $neutral-60; + } + + &__expand { + background-color: $success-50; + } + } + + &-bar { + margin-bottom: 0; + font-size: $font-size-s; + line-height: $line-height-sm; + color: $neutral-100; + } + + &-content { + display: flex; + align-items: flex-start; + height: pxToRem(472); + margin: 0 math.div($spacer, 4); + padding: pxToRem(28) pxToRem(20) pxToRem(28) pxToRem(28); + background: linear-gradient($neutral-20, #0e1424); + border-right: pxToRem(1) solid $neutral-20; + border-left: pxToRem(1) solid $neutral-20; + overflow-y: auto; + overflow-x: hidden; + word-break: break-word; + overflow-wrap: anywhere; + scrollbar-width: none; + -ms-overflow-style: none; + + &::-webkit-scrollbar { + width: 0; + height: 0; + } + + .highlight { + width: calc(100% - pxToRem(24)); + margin-bottom: $spacer * 10; + background: transparent; + + pre { + display: block; + width: 100%; + padding: 0; + background: transparent; + white-space: pre-wrap; + overflow-x: hidden; + } + + code { + display: block; + width: 100%; + overflow-wrap: anywhere; + word-break: break-word; + + .line { + margin-bottom: 0; + } + + * { + font-size: $font-size-md; + line-height: $spacer * 1.5; + color: $neutral-94; + } + } + } + + &-button { + display: flex; + justify-content: center; + align-items: center; + padding: pxToRem(7); + border: pxToRem(1) solid $neutral-30; + border-radius: math.div($spacer, 4); + background: linear-gradient($neutral-20, #0e1424); + + svg { + height: pxToRem(14); + width: pxToRem(14); + } + } + } + } + + &__list { + display: flex; + flex-direction: column; + gap: $spacer * 2; + } + + &__item { + flex: 1; + + &-icon { + margin-bottom: math.div($spacer, 2); + height: $spacer * 1.5; + width: $spacer * 1.5; + } + + &-content { + margin-bottom: 0; + color: $neutral-80; + + b { + color: $neutral-98; + } + } + } + + @include media-breakpoint-up(lg) { + padding-bottom: $spacer * 10; + background: radial-gradient( + 115.51% 123.53% at 50% -9.94%, + rgba(67, 37, 174, 0.00) 0%, + rgba(67, 37, 174, 0.00) 75%, + rgba(67, 37, 174, 0.80) 90%, + #6143E0 100%), + $neutral-10; + + &__title { + font-size: $h3-font-size; + line-height: pxToRem(52); + } + + &__description { + font-size: $font-size-l; + line-height: $line-height-lg; + } + + &__list { + flex-direction: row; + gap: $spacer * 3; + } + } +} \ No newline at end of file diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-hero.scss b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-hero.scss new file mode 100644 index 0000000000..2f53bc1316 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-hero.scss @@ -0,0 +1,256 @@ +@use '../../helpers/functions' as *; +@use 'sass:math'; + +.ai-agents-hero { + padding-top: $spacer * 5; + padding-bottom: $spacer * 1.5; + background: url('/img/stars-pattern.png') $neutral-10; + overflow: hidden; + + &__subtitle { + margin-top: $spacer; + margin-bottom: $spacer; + font-family: 'Geist Mono', $font-family-monospace; + letter-spacing: pxToRem(2); + font-weight: $font-weight-medium; + font-size: $font-size-s; + line-height: $line-height-sm; + color: $neutral-80; + text-align: center; + text-transform: uppercase; + } + + &__title { + margin-bottom: $spacer; + color: $neutral-98; + font-size: $h5-font-size; + line-height: pxToRem(42); + text-align: center; + } + + &__description { + margin-bottom: 0; + color: $neutral-80; + text-align: center; + } + + &__buttons { + display: flex; + flex-direction: column; + gap: $spacer * 1.5; + margin-top: $spacer * 2; + align-items: center; + } + + &__code { + overflow: hidden; + width: 100%; + height: pxToRem(440); + margin-top: $spacer * 4; + border-radius: $spacer; + background-color: $neutral-10; + border: pxToRem(1) solid $neutral-20; + box-shadow: + pxToRem(179) pxToRem(179) pxToRem(71) 0 rgba(96, 71, 255, 0.00), + pxToRem(114) pxToRem(114) pxToRem(65) 0 rgba(96, 71, 255, 0.01), + pxToRem(64) pxToRem(64) pxToRem(55) 0 rgba(96, 71, 255, 0.05), + pxToRem(29) pxToRem(29) pxToRem(40) 0 rgba(96, 71, 255, 0.09), + pxToRem(7) pxToRem(7) pxToRem(22) 0 rgba(96, 71, 255, 0.10); + + &-header { + display: flex; + justify-content: space-between; + align-items: center; + height: $spacer * 2.5; + padding: 0 $spacer * 1.5; + background-color: $neutral-10; + border-bottom: pxToRem(1) solid $neutral-20; + } + + &-window-buttons { + display: flex; + gap: pxToRem(6); + + div { + height: pxToRem(11); + width: pxToRem(11); + border-radius: 50%; + } + + &__close { + background-color: $error-50; + } + + &__minimize { + background-color: $neutral-60; + } + + &__expand { + background-color: $success-50; + } + } + + &-bar { + margin-bottom: 0; + font-size: $font-size-s; + line-height: $line-height-sm; + color: $neutral-100; + } + + &-content { + display: flex; + align-items: flex-start; + height: pxToRem(400); + margin: 0 math.div($spacer, 4); + padding: pxToRem(28) pxToRem(20) pxToRem(28) pxToRem(28); + background: linear-gradient($neutral-20, #0e1424); + border-right: pxToRem(1) solid $neutral-20; + border-left: pxToRem(1) solid $neutral-20; + overflow-y: auto; + overflow-x: hidden; + word-break: break-word; + overflow-wrap: anywhere; + scrollbar-width: none; + -ms-overflow-style: none; + + &::-webkit-scrollbar { + width: 0; + height: 0; + } + + .highlight { + width: calc(100% - pxToRem(24)); + margin-bottom: 0; + background: transparent; + + pre { + display: block; + width: 100%; + padding: 0; + background: transparent; + white-space: pre-wrap; + overflow-x: hidden; + } + + code { + display: block; + width: 100%; + overflow-wrap: anywhere; + word-break: break-word; + + .line { + margin-bottom: 0; + } + + * { + font-size: $font-size-s; + line-height: $line-height-sm; + color: #C5C8C6; + } + + .c1 { + color: #717C99; + } + + .s2, .nb { + color: #26A69A; + } + + .k, .kn { + color: #7E75FF; + } + + .mi { + color: #29B6F6; + } + } + } + + &-button { + display: flex; + justify-content: center; + align-items: center; + padding: pxToRem(7); + border: pxToRem(1) solid $neutral-30; + border-radius: math.div($spacer, 4); + background: linear-gradient($neutral-20, #0e1424); + + svg { + height: pxToRem(14); + width: pxToRem(14); + } + } + } + } + + &__logos { + display: flex; + flex-direction: column; + justify-content: space-between; + align-items: center; + gap: $spacer * 1.5; + margin-top: $spacer * 5; + + &-title { + margin: 0; + font-family: 'Geist Mono', $font-family-monospace; + letter-spacing: pxToRem(2); + font-weight: $font-weight-medium; + font-size: $font-size-xs; + line-height: $line-height-sm; + text-transform: uppercase; + color: $neutral-98; + } + + &-list { + display: flex; + justify-content: center; + align-items: center; + flex-wrap: wrap; + } + + &-item { + display: flex; + justify-content: center; + align-items: center; + width: pxToRem(200); + height: $spacer * 3.5; + } + } + + @include media-breakpoint-up(lg) { + &__subtitle { + text-align: left; + } + + &__title { + font-size: $h2-font-size; + line-height: pxToRem(62); + text-align: left; + } + + &__description { + max-width: pxToRem(490); + font-size: $font-size-xl; + line-height: pxToRem(30); + text-align: left; + } + + &__buttons { + flex-direction: row; + } + + &__code { + margin-top: 0; + } + + &__logos { + flex-direction: row; + margin-top: $spacer * 9; + + &-list { + justify-content: flex-end; + } + } + } +} \ No newline at end of file diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-how-it-works.scss b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-how-it-works.scss new file mode 100644 index 0000000000..1b8f2ab32f --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-how-it-works.scss @@ -0,0 +1,251 @@ +@use '../../helpers/functions' as *; +@use 'sass:math'; + +.ai-agents-how-it-works { + padding-top: $spacer * 5; + padding-bottom: $spacer * 5; + background-color: $neutral-94; + overflow: hidden; + + &__subtitle { + margin-bottom: $spacer; + font-family: 'Geist Mono', $font-family-monospace; + font-weight: $font-weight-medium; + font-size: $font-size-s; + line-height: $line-height-sm; + color: $neutral-30; + text-align: center; + text-transform: uppercase; + } + + &__title { + margin-bottom: $spacer; + text-align: center; + font-size: $h4-font-size; + line-height: $spacer * 3; + color: $neutral-20; + } + + &__description { + margin-bottom: $spacer * 4; + text-align: center; + color: $neutral-30; + } + + &__cards { + margin-bottom: $spacer * 4; + display: flex; + flex-direction: column; + } + + &__card { + height: 100%; + position: relative; + + & > div { + height: 100%; + } + + &-index { + display: flex; + align-items: center; + justify-content: center; + height: $spacer * 2; + width: $spacer * 2.5; + margin-bottom: math.div($spacer, 2); + border-radius: pxToRem(2); + font-size: $font-size-l; + line-height: $line-height-lg; + font-weight: $font-weight-medium; + } + + &-line { + position: absolute; + top: 100%; + left: 50%; + transform: translate(-50%, 0); + height: $spacer * 4; + width: pxToRem(2); + z-index: 1; + + &:after, &:before { + display: block; + content: ""; + position: absolute; + left: calc((pxToRem(9) - pxToRem(2)) / 2 * -1); + width: pxToRem(9); + height: pxToRem(9); + border-radius: 50%; + border: 1px solid $neutral-90; + background: $neutral-98; + box-shadow: + pxToRem(3) pxToRem(4) pxToRem(1) 0 rgba(32, 34, 39, 0.00), + pxToRem(2) pxToRem(2) pxToRem(1) 0 rgba(32, 34, 39, 0.01), + pxToRem(1) pxToRem(1) pxToRem(1) 0 rgba(32, 34, 39, 0.05), + 0 pxToRem(1) pxToRem(1) 0 rgba(32, 34, 39, 0.09); + } + + &:before { + top: pxToRem(-5); + } + + &:after { + bottom: pxToRem(-5); + } + } + + &:nth-of-type(1) { + .ai-agents-how-it-works__card-index { + color: $secondary-violet-50; + border-radius: 2px; + border-top: math.div($spacer, 32) solid $secondary-violet-70; + border-right: math.div($spacer, 32) solid $secondary-violet-70; + background: $secondary-violet-90; + } + + .ai-agents-how-it-works__card-line { + background: linear-gradient(180deg, rgba($secondary-blue-50, 0.1) 0%, $secondary-blue-50 100%); + } + } + + &:nth-of-type(2) { + .ai-agents-how-it-works__card-index { + color: $secondary-blue-50; + border-radius: 2px; + border-top: math.div($spacer, 32) solid $secondary-blue-70; + border-right: math.div($spacer, 32) solid $secondary-blue-70; + background: $secondary-blue-90; + } + + .ai-agents-how-it-works__card-line { + background: linear-gradient(180deg, rgba($secondary-teal-50, 0.1) 0%, $secondary-teal-50 100%); + } + } + + &:nth-of-type(3) { + .ai-agents-how-it-works__card-index { + color: $secondary-teal-50; + border-radius: 2px; + border-top: math.div($spacer, 32) solid $secondary-teal-70; + border-right: math.div($spacer, 32) solid $secondary-teal-70; + background: $secondary-teal-90; + } + } + + &-title { + padding-bottom: $spacer; + margin-bottom: $spacer;font-size: $font-size-xl; + line-height: pxToRem(30); + color: $neutral-20; + border-bottom: pxToRem(1) solid $neutral-90; + } + + &-description { + margin-bottom: $spacer * 1.5; + color: $neutral-40; + } + + .highlight { + background: $neutral-94; + margin-bottom: 0; + + pre { + display: block; + width: 100%; + padding: pxToRem(12) pxToRem(6) pxToRem(12) math.div($spacer, 2); + background: transparent; + white-space: pre-wrap; + overflow-x: hidden; + border-radius: math.div($spacer, 2); + } + + code { + display: block; + width: 100%; + overflow-wrap: anywhere; + word-break: break-word; + + .line { + margin-bottom: 0; + } + + * { + font-size: $font-size-xs; + line-height: pxToRem(18); + color: $neutral-30; + } + + .nb { + color: #EF6C00; + } + + .s2 { + color: #009688; + } + } + } + } + + &__preview { + width: 100%; + + img { + width: 100%; + } + } + + @include media-breakpoint-up(lg) { + &__title { + font-size: $h3-font-size; + line-height: pxToRem(52); + } + + &__description { + margin-top: $spacer; + font-size: $font-size-l; + line-height: $line-height-lg; + } + + &__cards { + flex-direction: row; + justify-content: center; + } + + &__card { + &-line { + top: 50%; + left: 100%; + transform: translate(-50%, 0); + height: pxToRem(2); + width: $spacer * 4; + + &:after, &:before { + top: calc((pxToRem(9) - pxToRem(2)) / 2 * -1); + bottom: auto; + } + + &:before { + left: pxToRem(-5); + right: auto; + } + + &:after { + right: pxToRem(-5); + left: auto; + } + } + + &:nth-of-type(1) { + .ai-agents-how-it-works__card-line { + background: linear-gradient(90deg, rgba($secondary-blue-50, 0.1) 0%, $secondary-blue-50 100%); + } + } + + &:nth-of-type(2) { + .ai-agents-how-it-works__card-line { + background: linear-gradient(90deg, rgba($secondary-teal-50, 0.1) 0%, $secondary-teal-50 100%); + } + } + } + } +} \ No newline at end of file diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-integrations.scss b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-integrations.scss new file mode 100644 index 0000000000..0c69d8f700 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-integrations.scss @@ -0,0 +1,115 @@ +@use '../../helpers/functions' as *; + +.ai-agents-integrations { + padding-top: $spacer * 5; + padding-bottom: $spacer * 5; + position: relative; + background: radial-gradient( + 107.37% 114.83% at 50% 94.96%, + rgba(67, 37, 174, 0.00) 0%, + rgba(67, 37, 174, 0.00) 75%, + rgba(67, 37, 174, 0.80) 90%, + #6143E0 100%), + $neutral-10; + + &__subtitle { + margin-bottom: $spacer; + font-family: 'Geist Mono', $font-family-monospace; + font-weight: $font-weight-medium; + font-size: $font-size-s; + line-height: $line-height-sm; + color: $neutral-70; + text-align: center; + text-transform: uppercase; + } + + &__title { + margin-bottom: $spacer; + text-align: center; + font-size: $h4-font-size; + line-height: $spacer * 3; + color: $neutral-98; + } + + &__description { + margin-bottom: 0; + text-align: center; + color: $neutral-70; + } + + &__list { + display: flex; + flex-direction: column; + gap: $spacer * 4; + margin-top: $spacer * 4; + } + + &__block { + &-title { + margin-bottom: $spacer * 1.5; + font-size: $font-size-xl; + line-height: pxToRem(30); + font-weight: $font-weight-normal; + color: $neutral-98; + text-align: center; + } + + &-items { + display: flex; + flex-wrap: wrap; + } + + &-item { + display: flex; + justify-content: center; + align-items: center; + width: 50%; + height: $spacer * 5; + border: pxToRem(1) solid $neutral-20; + margin-top: pxToRem(-1); + margin-left: pxToRem(-1); + + img { + max-width: 100%; + } + } + } + + @include media-breakpoint-up(lg) { + &__header { + position: sticky; + top: pxToRem(140); + margin-bottom: $spacer * 5; + } + + &__subtitle { + text-align: left; + } + + &__title { + max-width: pxToRem(445); + font-size: $h3-font-size; + line-height: pxToRem(52); + text-align: left; + } + + &__description { + max-width: pxToRem(445); + font-size: $font-size-l; + line-height: $line-height-lg; + text-align: left; + } + + &__list { + margin-top: $spacer * 2.5; + } + + &__block { + &-title { + font-size: $h6-font-size; + line-height: pxToRem(34); + text-align: left; + } + } + } +} \ No newline at end of file diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-proof.scss b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-proof.scss new file mode 100644 index 0000000000..f1eeb6536a --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-proof.scss @@ -0,0 +1,61 @@ +@use '../../helpers/functions' as *; +@use 'sass:math'; + +.ai-agents-proof { + padding-top: $spacer * 5; + padding-bottom: $spacer * 5; + background-color: $neutral-94; + + &__items { + display: flex; + flex-direction: column; + } + + &__item { + flex: 1; + flex-shrink: 0; + + &-title { + margin-bottom: math.div($spacer, 2); + color: $secondary-blue-50; + font-size: $h3-font-size; + line-height: pxToRem(58); + font-weight: $font-weight-medium; + } + + &-description { + margin-bottom: 0; + font-size: $font-size-xl; + line-height: pxToRem(30); + font-weight: $font-weight-light; + color: $neutral-30; + } + } + + &__divider { + flex-shrink: 0; + width: 100%; + height: pxToRem(1); + margin: $spacer * 2 0; + background-color: $neutral-80; + } + + @include media-breakpoint-up(lg) { + padding-top: $spacer * 7; + padding-bottom: $spacer * 7; + + &__items { + flex-direction: row; + } + + &__item { + padding: $spacer 0; + } + + &__divider { + width: pxToRem(1); + height: auto; + margin: 0 $spacer * 3; + } + } +} \ No newline at end of file diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-resources.scss b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-resources.scss new file mode 100644 index 0000000000..c38a46ae5e --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-resources.scss @@ -0,0 +1,71 @@ +@use '../../helpers/functions' as *; + +.ai-agents-resources { + padding-bottom: $spacer * 4; + background-color: $neutral-94; + + &__header { + margin-bottom: $spacer * 5; + padding-top: $spacer * 4; + border-top: pxToRem(1) solid $neutral-80; + text-align: center; + } + + &__subtitle { + margin-bottom: $spacer; + font-family: 'Geist Mono', $font-family-monospace; + font-weight: $font-weight-medium; + font-size: $font-size-s; + line-height: $line-height-sm; + color: $neutral-30; + text-transform: uppercase; + } + + &__title { + margin-bottom: $spacer; + font-size: $h4-font-size; + line-height: $spacer * 3; + color: $neutral-20; + } + + &__description { + margin-bottom: $spacer * 4; + color: $neutral-30; + } + + &__card { + &-icon { + height: $spacer * 1.5; + width: $spacer * 1.5; + margin-bottom: $spacer * 1.5; + } + + &-title { + margin-bottom: $spacer; + font-size: $h6-font-size; + line-height: $spacer * 2; + color: $neutral-20; + } + + &-description { + margin-bottom: $spacer * 2.5; + color: $neutral-40; + } + + &-link { + margin-top: auto; + } + } + + @include media-breakpoint-up(lg) { + &__title { + font-size: $h3-font-size; + line-height: pxToRem(52); + } + + &__description { + font-size: $font-size-l; + line-height: $line-height-lg; + } + } +} \ No newline at end of file diff --git a/qdrant-landing/themes/qdrant-2024/assets/js/copy-code-new.js b/qdrant-landing/themes/qdrant-2024/assets/js/copy-code-new.js new file mode 100644 index 0000000000..f12ecb3c71 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/assets/js/copy-code-new.js @@ -0,0 +1,39 @@ +(function () { + const initCopyCode = (root = document) => { + root.querySelectorAll(".js-copy-code").forEach((wrap) => { + const btnCopy = wrap.querySelector(".js-copy-code__copy"); + const btnDone = wrap.querySelector(".js-copy-code__done"); + const codeEl = wrap.querySelector(".highlight code"); + + if (!btnCopy || !btnDone || !codeEl) return; + + btnCopy.type = "button"; + btnDone.type = "button"; + + const copyDisplay = getComputedStyle(btnCopy).display === "none" ? "inline-flex" : getComputedStyle(btnCopy).display; + const doneDisplay = getComputedStyle(btnDone).display === "none" ? copyDisplay : getComputedStyle(btnDone).display; + + btnDone.style.display = "none"; + + btnCopy.addEventListener("click", async () => { + const text = codeEl.textContent || ""; + + try { + await navigator.clipboard.writeText(text); + + btnCopy.style.display = "none"; + btnDone.style.display = doneDisplay; + + setTimeout(() => { + btnDone.style.display = "none"; + btnCopy.style.display = copyDisplay; + }, 1200); + } catch (e) { + console.error(e); + } + }); + }); + }; + + initCopyCode(document); +})(); \ No newline at end of file diff --git a/qdrant-landing/themes/qdrant-2024/layouts/ai-agents/list.html b/qdrant-landing/themes/qdrant-2024/layouts/ai-agents/list.html index af008ebf96..3f3ec8dd76 100644 --- a/qdrant-landing/themes/qdrant-2024/layouts/ai-agents/list.html +++ b/qdrant-landing/themes/qdrant-2024/layouts/ai-agents/list.html @@ -1,26 +1,21 @@ {{ define "main" }} {{ partial "site-header" . }} - {{ with (.Site.GetPage "/ai-agents/ai-agents-hero") }} - {{ partial "use-cases-vector-hero" . }} - {{ end }} + {{ partial "ai-agents/ai-agents-hero" . }} -
- {{ partial "ai-agents-features" . }} + {{ partial "ai-agents/ai-agents-how-it-works" . }} - {{ with (.Site.GetPage "/ai-agents/ai-agents-integrations") }} - {{ partial "use-cases-vector-integrations" (dict "context" . "class" "ai-agents-integrations") }} - {{ end }} + {{ partial "ai-agents/ai-agents-builder-patterns" . }} - {{ partial "ai-agents-webinar" . }} + {{ partial "ai-agents/ai-agents-integrations" . }} - {{ with (.Site.GetPage "/ai-agents/ai-agents-use-cases") }} - {{ partial "use-cases-vector-cases" (dict "context" . "class" "ai-agents-use-cases") }} - {{ end }} + {{ partial "ai-agents/ai-agents-features" . }} + + {{ partial "ai-agents/ai-agents-proof" . }} - {{ partial "ai-agents-video" . }} + {{ partial "ai-agents/ai-agents-resources" . }} - {{ with (.Site.GetPage "/ai-agents/ai-agents-get-started") }} - {{ partial "get-started-small" (dict "context" . "class" "ai-agents-get-started") }} + {{ with (.Site.GetPage "/ai-agents/ai-agents-cta-banner") }} + {{ partial "cta-banner" . }} {{ end }} {{ end }} diff --git a/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents-features.html b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents-features.html deleted file mode 100644 index 67f25576ec..0000000000 --- a/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents-features.html +++ /dev/null @@ -1,42 +0,0 @@ -{{ with (.Site.GetPage "/ai-agents/ai-agents-features") }} -
-
-
-
- {{ .Params.image.alt }} -
-
-

{{ .Params.title }}

-

{{ .Params.description }}

- {{ range .Params.cases }} -
-
{{ .title }}
-

{{ .description }}

-
- {{ end }} -
-
- -

{{ .Params.featuresTitle }}

- -
- {{ range $index, $element := .Params.features }} -
- - {{ .icon.alt }} -
{{ .title }}
-

{{ .description }}

- - {{ .link.text }} - - -
- {{ end }} -
-
-
-{{ end }} diff --git a/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-builder-patterns.html b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-builder-patterns.html new file mode 100644 index 0000000000..ed0fb8f6f3 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-builder-patterns.html @@ -0,0 +1,196 @@ +{{ with (.Site.GetPage "ai-agents/ai-agents-builder-patterns") }} +
+
+
+

{{ .Params.subtitle }}

+

{{ .Params.title }}

+

{{ .Params.description }}

+
+ +
+
+
+ {{ range $index, $feature := .Params.features }} +
+

{{ $feature.title }}

+
+

{{ $feature.description | safeHTML }}

+ + {{/* Visible only below lg */}} +
+
+
+
+
+
+
+
+

{{ .codeBar }}

+
+
+ {{ with .code }} + {{ $lang := $.Params.language | default "python" }} + {{ highlight . $lang "" }} + {{ end }} + + +
+
+ +
+
{{ .cardTitle }}
+

{{ .cardContent | safeHTML }}

+
+
+
+
+ {{ end }} +
+ +
+ + {{/* Visible from lg up */}} + {{ range $index, $feature := .Params.features }} +
+
+
+
+
+
+
+
+

{{ .codeBar }}

+
+
+ {{ with .code }} + {{ $lang := $.Params.language | default "python" }} + {{ highlight . $lang "" }} + {{ end }} + + +
+
+ +
+
{{ .cardTitle }}
+

{{ .cardContent | safeHTML }}

+
+
+ {{ end }} +
+
+
+
+
+{{ end }} + + diff --git a/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-features.html b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-features.html new file mode 100644 index 0000000000..964a7b6662 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-features.html @@ -0,0 +1,63 @@ +{{ with (.Site.GetPage "/ai-agents/ai-agents-features") }} +
+
+
+
+
+

{{ .Params.subtitle }}

+

{{ .Params.title }}

+

{{ .Params.description }}

+ + {{ .Params.button.text }} + +
+ +
+
+
+
+
+
+
+
+

{{ .Params.codeBar }}

+
+
+ {{ with .Params.code }} + {{ $lang := $.Params.language | default "python" }} + {{ highlight . $lang "" }} + {{ end }} + + +
+
+
+ +
+ {{ range .Params.features }} +
+ {{ .icon.alt }} +

{{ .content | safeHTML }}

+
+ {{ end }} +
+
+
+
+
+{{ end }} diff --git a/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-hero.html b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-hero.html new file mode 100644 index 0000000000..7e21226ecd --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-hero.html @@ -0,0 +1,68 @@ +{{ with (.Site.GetPage "/ai-agents/ai-agents-hero") }} +
+
+
+
+

{{ .Params.subtitle }}

+

{{ .Params.title }}

+

{{ .Params.description }}

+
+ + {{ .Params.containedButton.text }} + + + {{ .Params.outlinedButton.text }} + +
+
+
+
+
+
+
+
+
+
+

{{ .Params.codeBar }}

+
+
+ {{ with .Params.code }} + {{ $lang := $.Params.language | default "python" }} + {{ highlight . $lang "" }} + {{ end }} + + +
+
+
+
+
+

{{ .Params.logosTitle }}

+
+ {{ range .Params.logos }} +
+ {{ .alt }} +
+ {{ end }} +
+
+
+
+
+
+{{ end }} \ No newline at end of file diff --git a/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-how-it-works.html b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-how-it-works.html new file mode 100644 index 0000000000..151b78cdb4 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-how-it-works.html @@ -0,0 +1,31 @@ +{{ with (.Site.GetPage "/ai-agents/ai-agents-how-it-works") }} +
+
+

{{ .Params.subtitle }}

+

{{ .Params.title }}

+

{{ .Params.description }}

+
+ {{ range $index, $step := .Params.steps }} +
+
+ 0{{ add $index 1 }} +
{{ .title }}
+

{{ .description }}

+ {{ with .code }} + {{ $lang := $.Params.language | default "python" }} + {{ highlight . $lang "" }} + {{ end }} + {{ $num := add $index 1 }} + {{ if or (eq $num 1) (eq $num 2) }} +
+ {{ end }} +
+
+ {{ end }} +
+
+ {{ .Params.image.alt }} +
+
+
+{{ end }} \ No newline at end of file diff --git a/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-integrations.html b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-integrations.html new file mode 100644 index 0000000000..efe70af6d0 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-integrations.html @@ -0,0 +1,31 @@ +{{ with (.Site.GetPage "/ai-agents/ai-agents-integrations") }} +
+
+
+
+
+

{{ .Params.subtitle }}

+

{{ .Params.title }}

+

{{ .Params.description }}

+
+
+
+
+ {{ range .Params.integrations }} +
+
{{ .title }}
+
+ {{ range .logos }} +
+ {{ .alt }} +
+ {{ end }} +
+
+ {{ end }} +
+
+
+
+
+{{ end }} \ No newline at end of file diff --git a/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-proof.html b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-proof.html new file mode 100644 index 0000000000..8b8d128336 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-proof.html @@ -0,0 +1,19 @@ +{{ with (.Site.GetPage "/ai-agents/ai-agents-proof") }} +
+
+
+ {{ $proofs := .Params.proofs }} + {{ $last := sub (len $proofs) 1 }} + {{ range $i, $proof := $proofs }} +
+

{{ $proof.title }}

+

{{ $proof.description }}

+
+ {{ if ne $i $last }} +
+ {{ end }} + {{ end }} +
+
+
+{{ end }} diff --git a/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-resources.html b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-resources.html new file mode 100644 index 0000000000..76f36f6e00 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-resources.html @@ -0,0 +1,25 @@ +{{ with (.Site.GetPage "/ai-agents/ai-agents-resources") }} +
+
+
+

{{ .Params.subtitle }}

+

{{ .Params.title }}

+

{{ .Params.description }}

+
+
+ {{ range .Params.resources }} +
+
+ {{ .icon.alt }} +
{{ .title }}
+

{{ .description }}

+
+ {{ .link.text }} +
+
+
+ {{ end }} +
+
+
+{{ end }} diff --git a/qdrant-landing/themes/qdrant-2024/layouts/partials/cta-banner.html b/qdrant-landing/themes/qdrant-2024/layouts/partials/cta-banner.html index 3ae5d96a11..63431a3727 100644 --- a/qdrant-landing/themes/qdrant-2024/layouts/partials/cta-banner.html +++ b/qdrant-landing/themes/qdrant-2024/layouts/partials/cta-banner.html @@ -10,9 +10,16 @@

{{ .Params.title | safeHTML }}

{{ if .Params.description }}

{{ .Params.description }}

{{ end }} - - {{ .Params.button.text }} - +
+ + {{ .Params.button.text }} + + {{ if .Params.secondaryButton }} + + {{ .Params.secondaryButton.text }} + + {{ end }} +
{{ partial "picture" (dict "src" $illustration.src "alt" $illustration.alt "loading" "lazy" "decoding" "async") }} diff --git a/qdrant-landing/themes/qdrant-2024/layouts/partials/js.html b/qdrant-landing/themes/qdrant-2024/layouts/partials/js.html index d2d2282bc7..3ba41dc929 100644 --- a/qdrant-landing/themes/qdrant-2024/layouts/partials/js.html +++ b/qdrant-landing/themes/qdrant-2024/layouts/partials/js.html @@ -122,6 +122,11 @@ {{ end }} +{{ if eq .Section "ai-agents" }} + {{ $copyCodeJs := resources.Get "/js/copy-code-new.js" | js.Build | minify | resources.Fingerprint "sha512" }} + +{{ end }} + {{ if in (slice "blog" "articles" "course" "learn" "benchmarks" "docs" "documentation") .Section }} diff --git a/qdrant-landing/themes/qdrant-2024/static/icons/outline/boxes-purple.svg b/qdrant-landing/themes/qdrant-2024/static/icons/outline/boxes-purple.svg new file mode 100644 index 0000000000..46ca46a9fa --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/icons/outline/boxes-purple.svg @@ -0,0 +1,3 @@ + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/icons/outline/brain-blue.svg b/qdrant-landing/themes/qdrant-2024/static/icons/outline/brain-blue.svg new file mode 100644 index 0000000000..549803836e --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/icons/outline/brain-blue.svg @@ -0,0 +1,3 @@ + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/icons/outline/building-blue.svg b/qdrant-landing/themes/qdrant-2024/static/icons/outline/building-blue.svg new file mode 100644 index 0000000000..a4b911f597 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/icons/outline/building-blue.svg @@ -0,0 +1,3 @@ + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/icons/outline/chef-hat-blue.svg b/qdrant-landing/themes/qdrant-2024/static/icons/outline/chef-hat-blue.svg new file mode 100644 index 0000000000..d6b39a4e8a --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/icons/outline/chef-hat-blue.svg @@ -0,0 +1,3 @@ + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/icons/outline/filter-blue-large.svg b/qdrant-landing/themes/qdrant-2024/static/icons/outline/filter-blue-large.svg new file mode 100644 index 0000000000..4f32474f71 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/icons/outline/filter-blue-large.svg @@ -0,0 +1,3 @@ + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/icons/outline/gauge-blue.svg b/qdrant-landing/themes/qdrant-2024/static/icons/outline/gauge-blue.svg new file mode 100644 index 0000000000..64dc195534 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/icons/outline/gauge-blue.svg @@ -0,0 +1,3 @@ + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/icons/outline/git-branch-orange.svg b/qdrant-landing/themes/qdrant-2024/static/icons/outline/git-branch-orange.svg new file mode 100644 index 0000000000..6e539aa2c8 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/icons/outline/git-branch-orange.svg @@ -0,0 +1,3 @@ + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/icons/outline/git-merge-blue.svg b/qdrant-landing/themes/qdrant-2024/static/icons/outline/git-merge-blue.svg new file mode 100644 index 0000000000..ef2f1e68b9 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/icons/outline/git-merge-blue.svg @@ -0,0 +1,3 @@ + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/icons/outline/rocket-blue-big.svg b/qdrant-landing/themes/qdrant-2024/static/icons/outline/rocket-blue-big.svg new file mode 100644 index 0000000000..5ce5f9ba12 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/icons/outline/rocket-blue-big.svg @@ -0,0 +1,3 @@ + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/icons/outline/target-green.svg b/qdrant-landing/themes/qdrant-2024/static/icons/outline/target-green.svg new file mode 100644 index 0000000000..144e9dcbae --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/icons/outline/target-green.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/icons/outline/text-search-pink.svg b/qdrant-landing/themes/qdrant-2024/static/icons/outline/text-search-pink.svg new file mode 100644 index 0000000000..6a8c950260 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/icons/outline/text-search-pink.svg @@ -0,0 +1,3 @@ + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/claude-code.svg b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/claude-code.svg new file mode 100755 index 0000000000..911075dd2f --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/claude-code.svg @@ -0,0 +1,13 @@ + + + + + + + + + + + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/codex.svg b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/codex.svg new file mode 100755 index 0000000000..2ddf0bc511 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/codex.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/cognee.svg b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/cognee.svg new file mode 100755 index 0000000000..d9b57e6c40 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/cognee.svg @@ -0,0 +1,4 @@ + + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/crew-ai.svg b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/crew-ai.svg new file mode 100755 index 0000000000..4770414575 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/crew-ai.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/cursor.svg b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/cursor.svg new file mode 100755 index 0000000000..a3e6cdfe3f --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/cursor.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + + + + + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/dust.svg b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/dust.svg new file mode 100755 index 0000000000..bf4423aa13 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/dust.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/flowise.svg b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/flowise.svg new file mode 100755 index 0000000000..0283d66b6c --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/flowise.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/go.svg b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/go.svg new file mode 100755 index 0000000000..38d6c36ce4 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/go.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/haystack.svg b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/haystack.svg new file mode 100755 index 0000000000..0229ddb691 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/haystack.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + + + + + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/java.svg b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/java.svg new file mode 100755 index 0000000000..5fa45c888b --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/java.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/lang-chain.svg b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/lang-chain.svg new file mode 100755 index 0000000000..e69d814b70 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/lang-chain.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/llama-index.svg b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/llama-index.svg new file mode 100755 index 0000000000..8be4581f24 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/llama-index.svg @@ -0,0 +1,13 @@ + + + + + + + + + + + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/lyzr.svg b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/lyzr.svg new file mode 100755 index 0000000000..198a05513d --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/lyzr.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/mastra.svg b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/mastra.svg new file mode 100755 index 0000000000..c4d5e4e678 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/mastra.svg @@ -0,0 +1,3 @@ + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/mem0.svg b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/mem0.svg new file mode 100755 index 0000000000..551c0cb918 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/mem0.svg @@ -0,0 +1,8 @@ + + + + + + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/n8n.svg b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/n8n.svg new file mode 100755 index 0000000000..4022d63a31 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/n8n.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/net.svg b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/net.svg new file mode 100755 index 0000000000..7fd2ee5f60 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/net.svg @@ -0,0 +1,3 @@ + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/open-code.svg b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/open-code.svg new file mode 100755 index 0000000000..ac89bb2dcc --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/open-code.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/pi.svg b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/pi.svg new file mode 100755 index 0000000000..84f979b204 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/pi.svg @@ -0,0 +1,4 @@ + + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/python.svg b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/python.svg new file mode 100755 index 0000000000..92853b133a --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/python.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/rust.svg b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/rust.svg new file mode 100755 index 0000000000..d3cd0260e6 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/rust.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/trustgraph.svg b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/trustgraph.svg new file mode 100755 index 0000000000..3ae07bfbb9 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/trustgraph.svg @@ -0,0 +1,13 @@ + + + + + + + + + + + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/typescript.svg b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/typescript.svg new file mode 100755 index 0000000000..611b802e33 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/typescript.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/voiceflow.svg b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/voiceflow.svg new file mode 100755 index 0000000000..6438607b5c --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-logos/voiceflow.svg @@ -0,0 +1,3 @@ + + + diff --git a/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-memory.svg b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-memory.svg new file mode 100644 index 0000000000..96e60e5519 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/static/img/ai-agents-memory.svg @@ -0,0 +1,100 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + From 98828e272e67318e915f7d63f90a0d170896c58e Mon Sep 17 00:00:00 2001 From: nastyapash Date: Wed, 27 May 2026 00:38:52 +0300 Subject: [PATCH 2/8] link fix --- qdrant-landing/content/ai-agents/ai-agents-features.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/qdrant-landing/content/ai-agents/ai-agents-features.md b/qdrant-landing/content/ai-agents/ai-agents-features.md index b92bd933c9..e67e45ddee 100644 --- a/qdrant-landing/content/ai-agents/ai-agents-features.md +++ b/qdrant-landing/content/ai-agents/ai-agents-features.md @@ -4,7 +4,7 @@ title: Purpose-Built for Agent Builders description: Tools and patterns that make agent memory a solved problem, not a research project. button: text: Start Building with Skills - url: /qdrant/skills + url: https://github.com/qdrant/skills codeBar: SKILL.md code: | # Agent Memory Skill From 7cc28f83b353fff5153109b780c2d1c9079fa451 Mon Sep 17 00:00:00 2001 From: nastyapash Date: Thu, 4 Jun 2026 00:54:43 +0300 Subject: [PATCH 3/8] update copy-code, add pause to slider, set slider height --- .../qdrant-2024/assets/js/copy-code-new.js | 39 ----- .../themes/qdrant-2024/assets/js/copy-code.js | 148 +++++++++++++----- .../ai-agents/ai-agents-builder-patterns.html | 53 ++++++- .../qdrant-2024/layouts/partials/js.html | 2 +- 4 files changed, 159 insertions(+), 83 deletions(-) delete mode 100644 qdrant-landing/themes/qdrant-2024/assets/js/copy-code-new.js diff --git a/qdrant-landing/themes/qdrant-2024/assets/js/copy-code-new.js b/qdrant-landing/themes/qdrant-2024/assets/js/copy-code-new.js deleted file mode 100644 index f12ecb3c71..0000000000 --- a/qdrant-landing/themes/qdrant-2024/assets/js/copy-code-new.js +++ /dev/null @@ -1,39 +0,0 @@ -(function () { - const initCopyCode = (root = document) => { - root.querySelectorAll(".js-copy-code").forEach((wrap) => { - const btnCopy = wrap.querySelector(".js-copy-code__copy"); - const btnDone = wrap.querySelector(".js-copy-code__done"); - const codeEl = wrap.querySelector(".highlight code"); - - if (!btnCopy || !btnDone || !codeEl) return; - - btnCopy.type = "button"; - btnDone.type = "button"; - - const copyDisplay = getComputedStyle(btnCopy).display === "none" ? "inline-flex" : getComputedStyle(btnCopy).display; - const doneDisplay = getComputedStyle(btnDone).display === "none" ? copyDisplay : getComputedStyle(btnDone).display; - - btnDone.style.display = "none"; - - btnCopy.addEventListener("click", async () => { - const text = codeEl.textContent || ""; - - try { - await navigator.clipboard.writeText(text); - - btnCopy.style.display = "none"; - btnDone.style.display = doneDisplay; - - setTimeout(() => { - btnDone.style.display = "none"; - btnCopy.style.display = copyDisplay; - }, 1200); - } catch (e) { - console.error(e); - } - }); - }); - }; - - initCopyCode(document); -})(); \ No newline at end of file diff --git a/qdrant-landing/themes/qdrant-2024/assets/js/copy-code.js b/qdrant-landing/themes/qdrant-2024/assets/js/copy-code.js index da7bb64944..79924d72c9 100644 --- a/qdrant-landing/themes/qdrant-2024/assets/js/copy-code.js +++ b/qdrant-landing/themes/qdrant-2024/assets/js/copy-code.js @@ -2,53 +2,117 @@ import ClipboardJS from 'clipboard'; import Popover from 'bootstrap/js/src/popover.js'; (function () { - let codeBlocks = document.querySelectorAll('.highlight > pre'); - - const codeClipboard = new ClipboardJS('.copy-code'); + let codeClipboard = null; const popoversMap = {}; - // adds copy buttons with specific id for each code block - for (let block of codeBlocks) { - const id = btoa(Math.random().toString()).substr(10, 5); - block.id = id; - - const icon = document.createElement('i'); - icon.role = 'tooltip'; - icon.title = 'Copy to clipboard'; - - const copyBtn = document.createElement('button'); - copyBtn.type = 'button'; - copyBtn.role = 'button'; - copyBtn.classList.add('d-inline-block', 'copy-code', 'lead'); - copyBtn.id = 'copy-popover-' + id; - copyBtn.dataset.clipboardTarget = '#' + id; - copyBtn.appendChild(icon); - block.after(copyBtn); - - popoversMap[id] = new Popover(copyBtn, { - content: 'Text copied!', - placement: 'left', - trigger: 'manual', - template: - '', + const initMarkupMode = (root = document) => { + root.querySelectorAll('.js-copy-code').forEach((wrap) => { + if (wrap.dataset.copyCodeInitialized) return; + + const btnCopy = wrap.querySelector('.js-copy-code__copy'); + const btnDone = wrap.querySelector('.js-copy-code__done'); + const codeEl = wrap.querySelector('.highlight code'); + + if (!btnCopy || !btnDone || !codeEl) return; + + wrap.dataset.copyCodeInitialized = 'true'; + + btnCopy.type = 'button'; + btnDone.type = 'button'; + + const copyDisplay = + getComputedStyle(btnCopy).display === 'none' + ? 'inline-flex' + : getComputedStyle(btnCopy).display; + const doneDisplay = + getComputedStyle(btnDone).display === 'none' + ? copyDisplay + : getComputedStyle(btnDone).display; + + btnDone.style.display = 'none'; + + btnCopy.addEventListener('click', async () => { + const text = codeEl.textContent || ''; + + try { + await navigator.clipboard.writeText(text); + + btnCopy.style.display = 'none'; + btnDone.style.display = doneDisplay; + + setTimeout(() => { + btnDone.style.display = 'none'; + btnCopy.style.display = copyDisplay; + }, 1200); + } catch (e) { + console.error(e); + } + }); }); - } + }; + + const initAutoInjectMode = (root = document) => { + root.querySelectorAll('.highlight > pre').forEach((block) => { + if (block.closest('.js-copy-code')) return; + if (block.dataset.copyCodeInitialized) return; + if (block.nextElementSibling?.classList.contains('copy-code')) return; + + block.dataset.copyCodeInitialized = 'true'; + + const id = btoa(Math.random().toString()).substr(10, 5); + block.id = id; + + const icon = document.createElement('i'); + icon.role = 'tooltip'; + icon.title = 'Copy to clipboard'; + + const copyBtn = document.createElement('button'); + copyBtn.type = 'button'; + copyBtn.role = 'button'; + copyBtn.classList.add('d-inline-block', 'copy-code', 'lead'); + copyBtn.id = 'copy-popover-' + id; + copyBtn.dataset.clipboardTarget = '#' + id; + copyBtn.appendChild(icon); + block.after(copyBtn); + + popoversMap[id] = new Popover(copyBtn, { + content: 'Text copied!', + placement: 'left', + trigger: 'manual', + template: + '', + }); + }); + + if (!codeClipboard) { + codeClipboard = new ClipboardJS('.copy-code'); + + codeClipboard.on('success', (e) => { + const targetId = e.trigger.dataset.clipboardTarget.slice(1); + const popover = popoversMap[targetId]; + + if (!popover) return; + + popover.show(); + + setTimeout(() => { + popover.hide(); + }, 2000); - codeClipboard.on('success', function (e) { - const targetId = e.trigger.dataset.clipboardTarget.slice(1); + e.clearSelection(); + }); - const popover = popoversMap[targetId]; - popover.show(); + codeClipboard.on('error', (e) => { + console.error('Action:', e.action); + console.error('Trigger:', e.trigger); + }); + } + }; - const t = setTimeout(() => { - popover.hide(); - clearTimeout(t); - }, 2000); - e.clearSelection(); - }); + const initCopyCode = (root = document) => { + initMarkupMode(root); + initAutoInjectMode(root); + }; - codeClipboard.on('error', function (e) { - console.error('Action:', e.action); - console.error('Trigger:', e.trigger); - }); + initCopyCode(document); }).call(this); diff --git a/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-builder-patterns.html b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-builder-patterns.html index ed0fb8f6f3..6ef2507877 100644 --- a/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-builder-patterns.html +++ b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-builder-patterns.html @@ -123,6 +123,8 @@
{{ .cardTitle }}
const blocks = section.querySelectorAll( ".ai-agents-builder-patterns__visual .ai-agents-builder-patterns__visual-block" ); + const featuresContainer = section.querySelector(".ai-agents-builder-patterns__features"); + const slider = section.querySelector(".ai-agents-builder-patterns__slider"); if (!features.length) return; const breakpoints = { lg: 992 }; @@ -174,10 +176,54 @@
{{ .cardTitle }}
} }; + const applyFeaturesMinHeight = () => { + if (!featuresContainer) return; + + const width = featuresContainer.offsetWidth; + if (!width) return; + + const clone = featuresContainer.cloneNode(true); + clone.setAttribute("aria-hidden", "true"); + clone.classList.add("ai-agents-builder-patterns__features--measure"); + Object.assign(clone.style, { + position: "absolute", + left: "-9999px", + top: "0", + visibility: "hidden", + pointerEvents: "none", + width: `${width}px`, + minHeight: "0", + }); + + section.appendChild(clone); + + const cloneFeatures = clone.querySelectorAll(".ai-agents-builder-patterns__feature"); + let maxHeight = 0; + + cloneFeatures.forEach((_, index) => { + cloneFeatures.forEach((feature) => { + feature.classList.remove("ai-agents-builder-patterns__feature--active"); + }); + cloneFeatures[index].classList.add("ai-agents-builder-patterns__feature--active"); + maxHeight = Math.max(maxHeight, clone.offsetHeight); + }); + + clone.remove(); + featuresContainer.style.minHeight = `${maxHeight}px`; + }; + + if (slider) { + slider.addEventListener("mouseenter", stopAutoplay); + slider.addEventListener("mouseleave", syncAutoplay); + } + + const isSliderHovered = () => slider?.matches(":hover"); features.forEach((feature, index) => { feature.addEventListener("click", () => { goToFeature(index); - startAutoplay(); + if (!isSliderHovered()) { + startAutoplay(); + } }); }); @@ -186,11 +232,16 @@
{{ .cardTitle }}
if (resizeRaf) return; resizeRaf = requestAnimationFrame(() => { resizeRaf = 0; + applyFeaturesMinHeight(); syncAutoplay(); }); }); goToFeature(0); + applyFeaturesMinHeight(); + if (document.fonts?.ready) { + document.fonts.ready.then(applyFeaturesMinHeight); + } syncAutoplay(); })(); diff --git a/qdrant-landing/themes/qdrant-2024/layouts/partials/js.html b/qdrant-landing/themes/qdrant-2024/layouts/partials/js.html index 3ba41dc929..3a5a1a010c 100644 --- a/qdrant-landing/themes/qdrant-2024/layouts/partials/js.html +++ b/qdrant-landing/themes/qdrant-2024/layouts/partials/js.html @@ -123,7 +123,7 @@ {{ end }} {{ if eq .Section "ai-agents" }} - {{ $copyCodeJs := resources.Get "/js/copy-code-new.js" | js.Build | minify | resources.Fingerprint "sha512" }} + {{ $copyCodeJs := resources.Get "/js/copy-code.js" | js.Build | minify | resources.Fingerprint "sha512" }} {{ end }} From 3f025fdc15c807e2add8c1fa42311641075d6b2a Mon Sep 17 00:00:00 2001 From: nastyapash Date: Thu, 4 Jun 2026 20:27:26 +0300 Subject: [PATCH 4/8] fix code block --- qdrant-landing/themes/qdrant-2024/assets/js/copy-code.js | 1 + .../layouts/partials/ai-agents/ai-agents-how-it-works.html | 2 +- 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/qdrant-landing/themes/qdrant-2024/assets/js/copy-code.js b/qdrant-landing/themes/qdrant-2024/assets/js/copy-code.js index 79924d72c9..5981ae484b 100644 --- a/qdrant-landing/themes/qdrant-2024/assets/js/copy-code.js +++ b/qdrant-landing/themes/qdrant-2024/assets/js/copy-code.js @@ -54,6 +54,7 @@ import Popover from 'bootstrap/js/src/popover.js'; const initAutoInjectMode = (root = document) => { root.querySelectorAll('.highlight > pre').forEach((block) => { if (block.closest('.js-copy-code')) return; + if (block.closest('.without-copy-code')) return; if (block.dataset.copyCodeInitialized) return; if (block.nextElementSibling?.classList.contains('copy-code')) return; diff --git a/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-how-it-works.html b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-how-it-works.html index 151b78cdb4..f4184ceaec 100644 --- a/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-how-it-works.html +++ b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-how-it-works.html @@ -7,7 +7,7 @@

{{ .Params.title }}

{{ range $index, $step := .Params.steps }}
-
+
0{{ add $index 1 }}
{{ .title }}

{{ .description }}

From c4348c4da0cab048469f27d91ce1a8cea9dc6af0 Mon Sep 17 00:00:00 2001 From: nastyapash Date: Thu, 4 Jun 2026 20:30:42 +0300 Subject: [PATCH 5/8] fix code block --- .../partials/ai-agents/ai-agents-how-it-works.html | 12 +++++++----- 1 file changed, 7 insertions(+), 5 deletions(-) diff --git a/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-how-it-works.html b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-how-it-works.html index f4184ceaec..2f0636a21f 100644 --- a/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-how-it-works.html +++ b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-how-it-works.html @@ -7,14 +7,16 @@

{{ .Params.title }}

{{ range $index, $step := .Params.steps }}
-
+
0{{ add $index 1 }}
{{ .title }}

{{ .description }}

- {{ with .code }} - {{ $lang := $.Params.language | default "python" }} - {{ highlight . $lang "" }} - {{ end }} +
+ {{ with .code }} + {{ $lang := $.Params.language | default "python" }} + {{ highlight . $lang "" }} + {{ end }} +
{{ $num := add $index 1 }} {{ if or (eq $num 1) (eq $num 2) }}
From d4e480556982a4a273b323ffb6eceb405249b00f Mon Sep 17 00:00:00 2001 From: trean Date: Thu, 11 Jun 2026 20:16:40 +0200 Subject: [PATCH 6/8] add links, extract code block to a partial --- .../content/ai-agents/ai-agents-cta-banner.md | 4 +- .../ai-agents/ai-agents-get-started.md | 11 --- .../content/ai-agents/ai-agents-hero.md | 4 +- .../content/ai-agents/ai-agents-use-cases.md | 48 ----------- .../content/ai-agents/ai-agents-video.md | 16 ---- .../content/ai-agents/ai-agents-webinar.md | 17 ---- .../qdrant-2024/assets/css/default.scss | 3 - .../css/partials/_ai-agents-get-started.scss | 24 ------ .../assets/css/partials/_ai-agents-video.scss | 48 ----------- .../css/partials/_ai-agents-webinar.scss | 41 --------- .../_ai-agents-builder-patterns.scss | 1 + .../ai-agents/_ai-agents-features.scss | 5 ++ .../partials/ai-agents/_ai-agents-hero.scss | 5 ++ .../layouts/partials/ai-agents-video.html | 14 ---- .../layouts/partials/ai-agents-webinar.html | 19 ----- .../ai-agents/ai-agents-builder-patterns.html | 84 ++++--------------- .../ai-agents/ai-agents-code-window.html | 45 ++++++++++ .../ai-agents/ai-agents-features.html | 44 ++-------- .../partials/ai-agents/ai-agents-hero.html | 42 ++-------- 19 files changed, 93 insertions(+), 382 deletions(-) delete mode 100644 qdrant-landing/content/ai-agents/ai-agents-get-started.md delete mode 100644 qdrant-landing/content/ai-agents/ai-agents-use-cases.md delete mode 100644 qdrant-landing/content/ai-agents/ai-agents-video.md delete mode 100644 qdrant-landing/content/ai-agents/ai-agents-webinar.md delete mode 100644 qdrant-landing/themes/qdrant-2024/assets/css/partials/_ai-agents-get-started.scss delete mode 100644 qdrant-landing/themes/qdrant-2024/assets/css/partials/_ai-agents-video.scss delete mode 100644 qdrant-landing/themes/qdrant-2024/assets/css/partials/_ai-agents-webinar.scss delete mode 100644 qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents-video.html delete mode 100644 qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents-webinar.html create mode 100644 qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-code-window.html diff --git a/qdrant-landing/content/ai-agents/ai-agents-cta-banner.md b/qdrant-landing/content/ai-agents/ai-agents-cta-banner.md index 98a063c072..8a5ab09289 100644 --- a/qdrant-landing/content/ai-agents/ai-agents-cta-banner.md +++ b/qdrant-landing/content/ai-agents/ai-agents-cta-banner.md @@ -4,9 +4,9 @@ title: Your Agents Deserve Better Retrieval description: Start with the free tier. Scale to billions of vectors when you're ready. button: text: Start Building Free - url: / + url: https://cloud.qdrant.io/signup # add params? secondaryButton: text: Talk to an Engineer - url: / + url: /contact-us/ sitemapExclude: true --- \ No newline at end of file diff --git a/qdrant-landing/content/ai-agents/ai-agents-get-started.md b/qdrant-landing/content/ai-agents/ai-agents-get-started.md deleted file mode 100644 index 7c0a6bfdae..0000000000 --- a/qdrant-landing/content/ai-agents/ai-agents-get-started.md +++ /dev/null @@ -1,11 +0,0 @@ ---- -title: Building AI agents? -description: Apply for the Qdrant for Startups program to access a 20% discount to Qdrant Cloud, our managed cloud service, perks from Hugging Face, LlamaIndex, and Airbyte, and much more. -button: - url: /qdrant-for-startups/ - text: Apply Now -image: - src: /img/ai-agent.svg - alt: AI agent -sitemapExclude: true ---- diff --git a/qdrant-landing/content/ai-agents/ai-agents-hero.md b/qdrant-landing/content/ai-agents/ai-agents-hero.md index ce5b548385..9d85744ecd 100644 --- a/qdrant-landing/content/ai-agents/ai-agents-hero.md +++ b/qdrant-landing/content/ai-agents/ai-agents-hero.md @@ -4,10 +4,10 @@ title: Give Your Agents Memory That Works description: Store, retrieve, and reason over context with vector search. Drop Qdrant into your agent's retrieval loop in under 10 minutes. containedButton: text: Quickstart Guide - url: / + url: /documentation/quickstart/ outlinedButton: text: View Examples - url: / + url: /blog/qdrant-skills-release/ codeBar: agent_memory.py code: | from qdrant_client import QdrantClient diff --git a/qdrant-landing/content/ai-agents/ai-agents-use-cases.md b/qdrant-landing/content/ai-agents/ai-agents-use-cases.md deleted file mode 100644 index cfd40aee97..0000000000 --- a/qdrant-landing/content/ai-agents/ai-agents-use-cases.md +++ /dev/null @@ -1,48 +0,0 @@ ---- -title: Learn how to get started with Qdrant for your AI Agent use case -features: -- id: 0 - image: - src: /img/ai-agents-use-cases/comparing-ai-agent-frameworks.svg - srcMobile: /img/ai-agents-use-cases/comparing-ai-agent-frameworks.svg - alt: Comparing AI agent frameworks - title: "Comparing AI Agent Frameworks: LangGraph, CrewAI, Swarm, and AutoGen" - description: This guide offers a comparison of key AI agent frameworks, highlighting their strengths and ideal use cases for developers. - link: - text: View Guide - url: /articles/agentic-rag/ -- id: 1 - image: - src: /img/ai-agents-use-cases/open-ai-agents.svg - srcMobile: /img/ai-agents-use-cases/open-ai-agents.svg - alt: Open AI agents - title: Building OpenAI Swarm Agents with Qdrant - description: Learn how to build OpenAI Swarm agents using Qdrant for fast, scalable vector search and real-time actions. - link: - text: Read the Docs - url: /documentation/frameworks/ -- id: 2 - image: - src: /img/ai-agents-use-cases/ai-scheduler.svg - srcMobile: /img/ai-agents-use-cases/ai-scheduler.svg - alt: AI scheduler - title: Building an AI Scheduler with Zoom, CrewAI, and Qdrant - description: Learn how to build an AI meeting scheduler with Zoom, LlamaIndex, and Qdrant, featuring a hands-on RAG recommendation engine code sample. - link: - text: View Tutorial - url: /documentation/agentic-rag-crewai-zoom/ -caseStudy: - logo: - src: /img/ai-agents-use-cases/customer-logo.svg - alt: Logo - title: "QA.tech Case Study: AI Agents for Web Testing" - description: QA.tech enhanced web app testing by deploying AI agents that mimic user interactions. To handle high-speed actions and make real-time decisions, they integrated Qdrant for scalable vector search, allowing for faster and more efficient data proc... - link: - text: Read Case Study - url: /blog/case-study-qatech/ - image: - src: /img/ai-agents-use-cases/case-study.png - alt: Preview -sitemapExclude: true ---- - diff --git a/qdrant-landing/content/ai-agents/ai-agents-video.md b/qdrant-landing/content/ai-agents/ai-agents-video.md deleted file mode 100644 index 4cd6291ba9..0000000000 --- a/qdrant-landing/content/ai-agents/ai-agents-video.md +++ /dev/null @@ -1,16 +0,0 @@ ---- -tag: - title: On-demand Webinar - icon: - src: /icons/outline/training-purple.svg - alt: Training -title: Building AI Agents for personalized recommendations with Qdrant and n8n -description: Learn in this video how to build an AI-powered recommendation system using Qdrant and n8n. It demonstrates how an AI agent retrieves data from Qdrant's vector search engine and leverages a large language model (LLM) to generate personalized recommendations based on user inputs. -link: - text: Watch Now - url: https://www.youtube.com/watch?v=O5mT8M7rqQQ -youtube: | - -sitemapExclude: true ---- - diff --git a/qdrant-landing/content/ai-agents/ai-agents-webinar.md b/qdrant-landing/content/ai-agents/ai-agents-webinar.md deleted file mode 100644 index 86c525274e..0000000000 --- a/qdrant-landing/content/ai-agents/ai-agents-webinar.md +++ /dev/null @@ -1,17 +0,0 @@ ---- -tag: - title: On-demand Webinar - icon: - src: /icons/outline/training-purple.svg - alt: Training -title: Building Agents with LlamaIndex & Qdrant -description: Ready to build more advanced AI agents? Watch this webinar to learn how to use LlamaIndex and Qdrant to create intelligent agents capable of handling complex, multi-modal queries in RAG-enabled systems. -link: - text: Watch Now - url: https://www.youtube.com/watch?v=3mWIFsooibQ -image: - src: /img/ai-agents-webinar.svg - alt: AI agents webinar -sitemapExclude: true ---- - diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/default.scss b/qdrant-landing/themes/qdrant-2024/assets/css/default.scss index 99a9a173eb..e43a07d0ea 100644 --- a/qdrant-landing/themes/qdrant-2024/assets/css/default.scss +++ b/qdrant-landing/themes/qdrant-2024/assets/css/default.scss @@ -73,9 +73,6 @@ @import 'partials/ai-agents/ai-agents-how-it-works'; @import 'partials/ai-agents/ai-agents-proof'; @import 'partials/ai-agents/ai-agents-resources'; -@import 'partials/ai-agents-webinar'; -@import 'partials/ai-agents-get-started'; -@import 'partials/ai-agents-video'; @import 'partials/tag'; @import 'partials/about-us-values'; @import 'partials/about-us-engineering-culture'; diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/partials/_ai-agents-get-started.scss b/qdrant-landing/themes/qdrant-2024/assets/css/partials/_ai-agents-get-started.scss deleted file mode 100644 index f39356cdd3..0000000000 --- a/qdrant-landing/themes/qdrant-2024/assets/css/partials/_ai-agents-get-started.scss +++ /dev/null @@ -1,24 +0,0 @@ -@use '../mixins/get-started-small' as get-started-small; - -.ai-agents-get-started { - @include get-started-small.base( - $spacer * 5, - $spacer * 4, - $spacer * 3.5, - $spacer * 2.5, - $neutral-94, - url('/img/stars-pattern.png') $neutral-10, - url('/img/stars-pattern.png') $neutral-10 - ); - - @include media-breakpoint-up(lg) { - &__text { - padding-top: $spacer * 2.5; - padding-bottom: $spacer * 2.5; - } - - &__image { - align-self: center; - } - } -} diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/partials/_ai-agents-video.scss b/qdrant-landing/themes/qdrant-2024/assets/css/partials/_ai-agents-video.scss deleted file mode 100644 index dfcfff965a..0000000000 --- a/qdrant-landing/themes/qdrant-2024/assets/css/partials/_ai-agents-video.scss +++ /dev/null @@ -1,48 +0,0 @@ -@use '../helpers/functions' as *; - -.ai-agents-video { - padding-top: $spacer * 4; - padding-bottom: $spacer * 4; - background-color: $neutral-94; - - &__content { - display: flex; - flex-direction: column; - align-items: center; - max-width: pxToRem(920); - margin: 0 auto; - gap: $spacer * 1.5; - text-align: center; - } - - &__title { - margin-bottom: 0; - font-size: $spacer * 2; - line-height: pxToRem(40); - color: $neutral-20; - } - - &__description { - margin-bottom: 0; - color: $neutral-20; - } - - .video { - max-width: none; - margin-top: $spacer * 3; - - iframe { - max-width: none; - } - } - - @include media-breakpoint-up(lg) { - padding-top: $spacer * 7.5; - padding-bottom: $spacer * 7.5; - - &__title { - font-size: $spacer * 2.5; - line-height: pxToRem(50); - } - } -} diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/partials/_ai-agents-webinar.scss b/qdrant-landing/themes/qdrant-2024/assets/css/partials/_ai-agents-webinar.scss deleted file mode 100644 index a50a3fae97..0000000000 --- a/qdrant-landing/themes/qdrant-2024/assets/css/partials/_ai-agents-webinar.scss +++ /dev/null @@ -1,41 +0,0 @@ -@use '../helpers/functions' as *; - -.ai-agents-webinar { - padding-top: $spacer * 4; - padding-bottom: $spacer * 4; - background-color: $neutral-94; - - .tag { - margin-bottom: $spacer * 1.5; - } - - &__title { - margin-bottom: $spacer * 1.5; - font-size: $spacer * 2; - line-height: pxToRem(40); - color: $neutral-20; - } - - &__description { - margin-bottom: $spacer * 1.5; - font-size: pxToRem(18); - line-height: pxToRem(27); - color: $neutral-20; - } - - &__image { - display: block; - width: 100%; - max-width: pxToRem(580); - margin: $spacer * 2.5 -1% -7% -4%; - } - - @include media-breakpoint-up(lg) { - padding-top: $spacer * 7.5; - padding-bottom: $spacer * 7.5; - - &__image { - margin-top: 0; - } - } -} diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-builder-patterns.scss b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-builder-patterns.scss index 9c0e7eb5c2..13515e50e7 100644 --- a/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-builder-patterns.scss +++ b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-builder-patterns.scss @@ -263,6 +263,7 @@ border: pxToRem(1) solid $neutral-90; border-radius: math.div($spacer, 4); background: $neutral-98; + color: #8F98B3; svg { height: pxToRem(14); diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-features.scss b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-features.scss index 0f30732b6f..c1e30eda02 100644 --- a/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-features.scss +++ b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-features.scss @@ -168,6 +168,11 @@ border: pxToRem(1) solid $neutral-30; border-radius: math.div($spacer, 4); background: linear-gradient($neutral-20, #0e1424); + color: #B4BACC; + + &.js-copy-code__done { + color: #F0F3FA; + } svg { height: pxToRem(14); diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-hero.scss b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-hero.scss index 2f53bc1316..3c016199f2 100644 --- a/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-hero.scss +++ b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-hero.scss @@ -174,6 +174,11 @@ border: pxToRem(1) solid $neutral-30; border-radius: math.div($spacer, 4); background: linear-gradient($neutral-20, #0e1424); + color: #B4BACC; + + &.js-copy-code__done { + color: #F0F3FA; + } svg { height: pxToRem(14); diff --git a/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents-video.html b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents-video.html deleted file mode 100644 index ca3325f623..0000000000 --- a/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents-video.html +++ /dev/null @@ -1,14 +0,0 @@ -{{ with (.Site.GetPage "/ai-agents/ai-agents-video") }} -
-
-
- {{ partial "tag" . }} -

{{ .Params.title }}

-

{{ .Params.description }}

- {{ .Params.link.text }} -
- - {{ partial "youtube-video" .Params.youtube }} -
-
-{{ end }} diff --git a/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents-webinar.html b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents-webinar.html deleted file mode 100644 index 26b10daebb..0000000000 --- a/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents-webinar.html +++ /dev/null @@ -1,19 +0,0 @@ -{{ with (.Site.GetPage "/ai-agents/ai-agents-webinar") }} -
-
-
-
- {{ partial "tag" . }} - - -

{{ .Params.title }}

-

{{ .Params.description }}

- {{ .Params.link.text }} -
-
- {{ .Params.image.alt }} -
-
-
-
-{{ end }} diff --git a/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-builder-patterns.html b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-builder-patterns.html index 6ef2507877..00a0c6ba6f 100644 --- a/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-builder-patterns.html +++ b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-builder-patterns.html @@ -1,4 +1,4 @@ -{{ with (.Site.GetPage "ai-agents/ai-agents-builder-patterns") }} +{{ with (.Site.GetPage "/ai-agents/ai-agents-builder-patterns") }}
@@ -18,39 +18,13 @@

{{ $feature.title }}

{{/* Visible only below lg */}}
-
-
-
-
-
-
-
-

{{ .codeBar }}

-
-
- {{ with .code }} - {{ $lang := $.Params.language | default "python" }} - {{ highlight . $lang "" }} - {{ end }} - - -
-
+ {{ partial "ai-agents/ai-agents-code-window" (dict + "block" "ai-agents-builder-patterns" + "codeBar" .codeBar + "code" .code + "language" ($.Params.language | default "python") + "id" (printf "bp-mobile-%d" $index) + ) }}
{{ .cardTitle }}
@@ -67,40 +41,14 @@
{{ .cardTitle }}
{{/* Visible from lg up */}} {{ range $index, $feature := .Params.features }}
-
-
-
-
-
-
-
-

{{ .codeBar }}

-
-
- {{ with .code }} - {{ $lang := $.Params.language | default "python" }} - {{ highlight . $lang "" }} - {{ end }} - - -
-
- + {{ partial "ai-agents/code-window" (dict + "block" "ai-agents-builder-patterns" + "codeBar" .codeBar + "code" .code + "language" ($.Params.language | default "python") + "id" (printf "bp-desktop-%d" $index) + ) }} +
{{ .cardTitle }}

{{ .cardContent | safeHTML }}

diff --git a/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-code-window.html b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-code-window.html new file mode 100644 index 0000000000..baf61f83e0 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-code-window.html @@ -0,0 +1,45 @@ +{{/* + Reusable code window with copy button for AI Agents sections. + + Params: + - block: BEM block prefix (e.g. "ai-agents-hero") + - codeBar: filename shown in the header + - code: source code string + - id: unique suffix for SVG clip-path IDs (required when multiple instances per page) + - language: optional, default "python" +*/}} +{{ $block := .block }} +{{ $clipId := printf "code-window-clip-%s" .id }} +{{ $lang := .language | default "python" }} +
+
+
+
+
+
+
+

{{ .codeBar }}

+
+
+ {{ with .code }} + {{ highlight . $lang "" }} + {{ end }} + + +
+
diff --git a/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-features.html b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-features.html index 964a7b6662..cbcf1186bb 100644 --- a/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-features.html +++ b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-features.html @@ -5,7 +5,7 @@

{{ .Params.subtitle }}

-

{{ .Params.title }}

+

{{ .Params.title }}

{{ .Params.description }}

{{ .Params.button.text }} @@ -13,41 +13,15 @@

{{ .Params.title }}

-
-
-
-
-
-
-
-

{{ .Params.codeBar }}

-
-
- {{ with .Params.code }} - {{ $lang := $.Params.language | default "python" }} - {{ highlight . $lang "" }} - {{ end }} - - -
-
+ {{ partial "ai-agents/ai-agents-code-window" (dict + "block" "ai-agents-features" + "codeBar" .Params.codeBar + "code" .Params.code + "language" (.Params.language | default "python") + "id" "features" + ) }}
- +
{{ range .Params.features }}
diff --git a/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-hero.html b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-hero.html index 7e21226ecd..cbf7b2c56c 100644 --- a/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-hero.html +++ b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-hero.html @@ -16,39 +16,13 @@

{{ .Params.title }}

-
-
-
-
-
-
-
-

{{ .Params.codeBar }}

-
-
- {{ with .Params.code }} - {{ $lang := $.Params.language | default "python" }} - {{ highlight . $lang "" }} - {{ end }} - - -
-
+ {{ partial "ai-agents/ai-agents-code-window" (dict + "block" "ai-agents-hero" + "codeBar" .Params.codeBar + "code" .Params.code + "language" (.Params.language | default "python") + "id" "hero" + ) }}
@@ -65,4 +39,4 @@

{{ .Params.title }}

-{{ end }} \ No newline at end of file +{{ end }} From 7cf8f1927fa06366a0fac751289ec3de3a422f3c Mon Sep 17 00:00:00 2001 From: trean Date: Thu, 11 Jun 2026 21:08:34 +0200 Subject: [PATCH 7/8] move code --- .../qdrant-2024/assets/css/default.scss | 8 +- .../_ai-agents-builder-patterns.scss | 12 +- .../ai-agents/_ai-agents-features.scss | 24 ++-- .../partials/ai-agents/_ai-agents-hero.scss | 28 ++-- .../ai-agents/_ai-agents-how-it-works.scss | 12 +- .../ai-agents/_ai-agents-integrations.scss | 8 +- .../ai-agents/_ai-agents-variables.scss | 17 +++ .../assets/css/partials/ai-agents/_index.scss | 8 ++ .../assets/js/ai-agents/builder-patterns.js | 129 +++++++++++++++++ .../qdrant-2024/assets/js/ai-agents/index.js | 4 + .../ai-agents/ai-agents-builder-patterns.html | 134 +----------------- .../qdrant-2024/layouts/partials/js.html | 4 +- 12 files changed, 204 insertions(+), 184 deletions(-) create mode 100644 qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-variables.scss create mode 100644 qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_index.scss create mode 100644 qdrant-landing/themes/qdrant-2024/assets/js/ai-agents/builder-patterns.js create mode 100644 qdrant-landing/themes/qdrant-2024/assets/js/ai-agents/index.js diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/default.scss b/qdrant-landing/themes/qdrant-2024/assets/css/default.scss index e43a07d0ea..c77f8c7f1d 100644 --- a/qdrant-landing/themes/qdrant-2024/assets/css/default.scss +++ b/qdrant-landing/themes/qdrant-2024/assets/css/default.scss @@ -66,13 +66,7 @@ @import 'partials/rag-evaluation-guide-features'; @import 'partials/progress-bar'; @import 'partials/table-of-contents'; -@import 'partials/ai-agents/ai-agents-builder-patterns'; -@import 'partials/ai-agents/ai-agents-features'; -@import 'partials/ai-agents/ai-agents-hero'; -@import 'partials/ai-agents/ai-agents-integrations'; -@import 'partials/ai-agents/ai-agents-how-it-works'; -@import 'partials/ai-agents/ai-agents-proof'; -@import 'partials/ai-agents/ai-agents-resources'; +@import 'partials/ai-agents/index'; @import 'partials/tag'; @import 'partials/about-us-values'; @import 'partials/about-us-engineering-culture'; diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-builder-patterns.scss b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-builder-patterns.scss index 13515e50e7..a8ba7299fc 100644 --- a/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-builder-patterns.scss +++ b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-builder-patterns.scss @@ -234,23 +234,23 @@ * { font-size: $font-size-s; line-height: $line-height-sm; - color: #28324D; + color: $neutral-30; } .c1 { - color: #717C99; + color: $neutral-60; } .s2, .nb { - color: #26A69A; + color: $ai-agents-code-string; } .k, .kn { - color: #7E75FF; + color: $ai-agents-code-keyword; } .mi { - color: #29B6F6; + color: $ai-agents-code-number; } } } @@ -263,7 +263,7 @@ border: pxToRem(1) solid $neutral-90; border-radius: math.div($spacer, 4); background: $neutral-98; - color: #8F98B3; + color: $neutral-70; svg { height: pxToRem(14); diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-features.scss b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-features.scss index c1e30eda02..ad11755f78 100644 --- a/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-features.scss +++ b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-features.scss @@ -5,10 +5,10 @@ padding-bottom: $spacer * 5; background: radial-gradient( 115.51% 123.53% at 50% -4.94%, - rgba(67, 37, 174, 0.00) 0%, - rgba(67, 37, 174, 0.00) 75%, - rgba(67, 37, 174, 0.80) 90%, - #6143E0 100%), + rgba($ai-agents-violet-gradient-base, 0) 0%, + rgba($ai-agents-violet-gradient-base, 0) 75%, + rgba($ai-agents-violet-gradient-base, 0.8) 90%, + $ai-agents-violet-gradient-end 100%), $neutral-10; &__header { @@ -113,7 +113,7 @@ height: pxToRem(472); margin: 0 math.div($spacer, 4); padding: pxToRem(28) pxToRem(20) pxToRem(28) pxToRem(28); - background: linear-gradient($neutral-20, #0e1424); + background: linear-gradient($neutral-20, $ai-agents-code-bg-end); border-right: pxToRem(1) solid $neutral-20; border-left: pxToRem(1) solid $neutral-20; overflow-y: auto; @@ -167,11 +167,11 @@ padding: pxToRem(7); border: pxToRem(1) solid $neutral-30; border-radius: math.div($spacer, 4); - background: linear-gradient($neutral-20, #0e1424); - color: #B4BACC; + background: linear-gradient($neutral-20, $ai-agents-code-bg-end); + color: $neutral-80; &.js-copy-code__done { - color: #F0F3FA; + color: $neutral-98; } svg { @@ -211,10 +211,10 @@ padding-bottom: $spacer * 10; background: radial-gradient( 115.51% 123.53% at 50% -9.94%, - rgba(67, 37, 174, 0.00) 0%, - rgba(67, 37, 174, 0.00) 75%, - rgba(67, 37, 174, 0.80) 90%, - #6143E0 100%), + rgba($ai-agents-violet-gradient-base, 0) 0%, + rgba($ai-agents-violet-gradient-base, 0) 75%, + rgba($ai-agents-violet-gradient-base, 0.8) 90%, + $ai-agents-violet-gradient-end 100%), $neutral-10; &__title { diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-hero.scss b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-hero.scss index 3c016199f2..49506baab0 100644 --- a/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-hero.scss +++ b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-hero.scss @@ -51,11 +51,11 @@ background-color: $neutral-10; border: pxToRem(1) solid $neutral-20; box-shadow: - pxToRem(179) pxToRem(179) pxToRem(71) 0 rgba(96, 71, 255, 0.00), - pxToRem(114) pxToRem(114) pxToRem(65) 0 rgba(96, 71, 255, 0.01), - pxToRem(64) pxToRem(64) pxToRem(55) 0 rgba(96, 71, 255, 0.05), - pxToRem(29) pxToRem(29) pxToRem(40) 0 rgba(96, 71, 255, 0.09), - pxToRem(7) pxToRem(7) pxToRem(22) 0 rgba(96, 71, 255, 0.10); + pxToRem(179) pxToRem(179) pxToRem(71) 0 rgba($ai-agents-violet-glow, 0), + pxToRem(114) pxToRem(114) pxToRem(65) 0 rgba($ai-agents-violet-glow, 0.01), + pxToRem(64) pxToRem(64) pxToRem(55) 0 rgba($ai-agents-violet-glow, 0.05), + pxToRem(29) pxToRem(29) pxToRem(40) 0 rgba($ai-agents-violet-glow, 0.09), + pxToRem(7) pxToRem(7) pxToRem(22) 0 rgba($ai-agents-violet-glow, 0.1); &-header { display: flex; @@ -103,7 +103,7 @@ height: pxToRem(400); margin: 0 math.div($spacer, 4); padding: pxToRem(28) pxToRem(20) pxToRem(28) pxToRem(28); - background: linear-gradient($neutral-20, #0e1424); + background: linear-gradient($neutral-20, $ai-agents-code-bg-end); border-right: pxToRem(1) solid $neutral-20; border-left: pxToRem(1) solid $neutral-20; overflow-y: auto; @@ -145,23 +145,23 @@ * { font-size: $font-size-s; line-height: $line-height-sm; - color: #C5C8C6; + color: $ai-agents-code-default-dark; } .c1 { - color: #717C99; + color: $neutral-60; } .s2, .nb { - color: #26A69A; + color: $ai-agents-code-string; } .k, .kn { - color: #7E75FF; + color: $ai-agents-code-keyword; } .mi { - color: #29B6F6; + color: $ai-agents-code-number; } } } @@ -173,11 +173,11 @@ padding: pxToRem(7); border: pxToRem(1) solid $neutral-30; border-radius: math.div($spacer, 4); - background: linear-gradient($neutral-20, #0e1424); - color: #B4BACC; + background: linear-gradient($neutral-20, $ai-agents-code-bg-end); + color: $neutral-80; &.js-copy-code__done { - color: #F0F3FA; + color: $neutral-98; } svg { diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-how-it-works.scss b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-how-it-works.scss index 1b8f2ab32f..6a4d31637d 100644 --- a/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-how-it-works.scss +++ b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-how-it-works.scss @@ -79,10 +79,10 @@ border: 1px solid $neutral-90; background: $neutral-98; box-shadow: - pxToRem(3) pxToRem(4) pxToRem(1) 0 rgba(32, 34, 39, 0.00), - pxToRem(2) pxToRem(2) pxToRem(1) 0 rgba(32, 34, 39, 0.01), - pxToRem(1) pxToRem(1) pxToRem(1) 0 rgba(32, 34, 39, 0.05), - 0 pxToRem(1) pxToRem(1) 0 rgba(32, 34, 39, 0.09); + pxToRem(3) pxToRem(4) pxToRem(1) 0 rgba($ai-agents-connector-shadow, 0), + pxToRem(2) pxToRem(2) pxToRem(1) 0 rgba($ai-agents-connector-shadow, 0.01), + pxToRem(1) pxToRem(1) pxToRem(1) 0 rgba($ai-agents-connector-shadow, 0.05), + 0 pxToRem(1) pxToRem(1) 0 rgba($ai-agents-connector-shadow, 0.09); } &:before { @@ -176,11 +176,11 @@ } .nb { - color: #EF6C00; + color: $ai-agents-code-builtin; } .s2 { - color: #009688; + color: $ai-agents-code-string-alt; } } } diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-integrations.scss b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-integrations.scss index 0c69d8f700..8fd3dabf41 100644 --- a/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-integrations.scss +++ b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-integrations.scss @@ -6,10 +6,10 @@ position: relative; background: radial-gradient( 107.37% 114.83% at 50% 94.96%, - rgba(67, 37, 174, 0.00) 0%, - rgba(67, 37, 174, 0.00) 75%, - rgba(67, 37, 174, 0.80) 90%, - #6143E0 100%), + rgba($ai-agents-violet-gradient-base, 0) 0%, + rgba($ai-agents-violet-gradient-base, 0) 75%, + rgba($ai-agents-violet-gradient-base, 0.8) 90%, + $ai-agents-violet-gradient-end 100%), $neutral-10; &__subtitle { diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-variables.scss b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-variables.scss new file mode 100644 index 0000000000..f9cc8416d9 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-variables.scss @@ -0,0 +1,17 @@ +// Ai-agents colors not defined in _theme-variables.scss + +$ai-agents-code-bg-end: #0e1424; + +$ai-agents-violet-gradient-base: #4325ae; +$ai-agents-violet-gradient-end: #6143e0; +$ai-agents-violet-glow: #6047ff; + +$ai-agents-connector-shadow: #202227; + +// syntax highlighting +$ai-agents-code-default-dark: #c5c8c6; +$ai-agents-code-string: #26a69a; +$ai-agents-code-keyword: #7e75ff; +$ai-agents-code-number: #29b6f6; +$ai-agents-code-builtin: #ef6c00; +$ai-agents-code-string-alt: #009688; diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_index.scss b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_index.scss new file mode 100644 index 0000000000..c6a4546559 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_index.scss @@ -0,0 +1,8 @@ +@import 'ai-agents-variables'; +@import 'ai-agents-builder-patterns'; +@import 'ai-agents-features'; +@import 'ai-agents-hero'; +@import 'ai-agents-integrations'; +@import 'ai-agents-how-it-works'; +@import 'ai-agents-proof'; +@import 'ai-agents-resources'; diff --git a/qdrant-landing/themes/qdrant-2024/assets/js/ai-agents/builder-patterns.js b/qdrant-landing/themes/qdrant-2024/assets/js/ai-agents/builder-patterns.js new file mode 100644 index 0000000000..7f3237c6af --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/assets/js/ai-agents/builder-patterns.js @@ -0,0 +1,129 @@ +export function initBuilderPatterns() { + const section = document.querySelector('.ai-agents-builder-patterns'); + if (!section) return; + + const features = section.querySelectorAll('.ai-agents-builder-patterns__feature'); + const blocks = section.querySelectorAll( + '.ai-agents-builder-patterns__visual .ai-agents-builder-patterns__visual-block', + ); + const featuresContainer = section.querySelector('.ai-agents-builder-patterns__features'); + const slider = section.querySelector('.ai-agents-builder-patterns__slider'); + if (!features.length) return; + + const breakpoints = { lg: 992 }; + + let currentIndex = 0; + let autoplayInterval = null; + const AUTOPLAY_DELAY = 5000; + + const isLgUp = () => window.innerWidth >= breakpoints.lg; + + const goToFeature = (index) => { + if (index < 0 || index >= features.length) return; + + features.forEach((feature) => { + feature.classList.remove('ai-agents-builder-patterns__feature--active'); + }); + + blocks.forEach((block) => { + block.classList.remove('ai-agents-builder-patterns__visual-block--active'); + }); + + features[index].classList.add('ai-agents-builder-patterns__feature--active'); + blocks[index]?.classList.add('ai-agents-builder-patterns__visual-block--active'); + + currentIndex = index; + }; + + const nextFeature = () => { + goToFeature((currentIndex + 1) % features.length); + }; + + const stopAutoplay = () => { + if (!autoplayInterval) return; + clearInterval(autoplayInterval); + autoplayInterval = null; + }; + + const startAutoplay = () => { + stopAutoplay(); + if (!isLgUp()) return; + autoplayInterval = setInterval(nextFeature, AUTOPLAY_DELAY); + }; + + const syncAutoplay = () => { + if (isLgUp()) { + startAutoplay(); + } else { + stopAutoplay(); + } + }; + + const applyFeaturesMinHeight = () => { + if (!featuresContainer) return; + + const width = featuresContainer.offsetWidth; + if (!width) return; + + const clone = featuresContainer.cloneNode(true); + clone.setAttribute('aria-hidden', 'true'); + clone.classList.add('ai-agents-builder-patterns__features--measure'); + Object.assign(clone.style, { + position: 'absolute', + left: '-9999px', + top: '0', + visibility: 'hidden', + pointerEvents: 'none', + width: `${width}px`, + minHeight: '0', + }); + + section.appendChild(clone); + + const cloneFeatures = clone.querySelectorAll('.ai-agents-builder-patterns__feature'); + let maxHeight = 0; + + cloneFeatures.forEach((_, index) => { + cloneFeatures.forEach((feature) => { + feature.classList.remove('ai-agents-builder-patterns__feature--active'); + }); + cloneFeatures[index].classList.add('ai-agents-builder-patterns__feature--active'); + maxHeight = Math.max(maxHeight, clone.offsetHeight); + }); + + clone.remove(); + featuresContainer.style.minHeight = `${maxHeight}px`; + }; + + if (slider) { + slider.addEventListener('mouseenter', stopAutoplay); + slider.addEventListener('mouseleave', syncAutoplay); + } + + const isSliderHovered = () => slider?.matches(':hover'); + features.forEach((feature, index) => { + feature.addEventListener('click', () => { + goToFeature(index); + if (!isSliderHovered()) { + startAutoplay(); + } + }); + }); + + let resizeRaf = 0; + window.addEventListener('resize', () => { + if (resizeRaf) return; + resizeRaf = requestAnimationFrame(() => { + resizeRaf = 0; + applyFeaturesMinHeight(); + syncAutoplay(); + }); + }); + + goToFeature(0); + applyFeaturesMinHeight(); + if (document.fonts?.ready) { + document.fonts.ready.then(applyFeaturesMinHeight); + } + syncAutoplay(); +} diff --git a/qdrant-landing/themes/qdrant-2024/assets/js/ai-agents/index.js b/qdrant-landing/themes/qdrant-2024/assets/js/ai-agents/index.js new file mode 100644 index 0000000000..a028b5b5e7 --- /dev/null +++ b/qdrant-landing/themes/qdrant-2024/assets/js/ai-agents/index.js @@ -0,0 +1,4 @@ +import '../copy-code.js'; +import { initBuilderPatterns } from './builder-patterns.js'; + +initBuilderPatterns(); diff --git a/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-builder-patterns.html b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-builder-patterns.html index 00a0c6ba6f..c0f141e143 100644 --- a/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-builder-patterns.html +++ b/qdrant-landing/themes/qdrant-2024/layouts/partials/ai-agents/ai-agents-builder-patterns.html @@ -41,7 +41,7 @@
{{ .cardTitle }}
{{/* Visible from lg up */}} {{ range $index, $feature := .Params.features }}
- {{ partial "ai-agents/code-window" (dict + {{ partial "ai-agents/ai-agents-code-window" (dict "block" "ai-agents-builder-patterns" "codeBar" .codeBar "code" .code @@ -61,135 +61,3 @@
{{ .cardTitle }}
{{ end }} - - diff --git a/qdrant-landing/themes/qdrant-2024/layouts/partials/js.html b/qdrant-landing/themes/qdrant-2024/layouts/partials/js.html index 3a5a1a010c..ba17f5904f 100644 --- a/qdrant-landing/themes/qdrant-2024/layouts/partials/js.html +++ b/qdrant-landing/themes/qdrant-2024/layouts/partials/js.html @@ -123,8 +123,8 @@ {{ end }} {{ if eq .Section "ai-agents" }} - {{ $copyCodeJs := resources.Get "/js/copy-code.js" | js.Build | minify | resources.Fingerprint "sha512" }} - + {{ $aiAgentsJs := resources.Get "js/ai-agents/index.js" | js.Build | minify | resources.Fingerprint "sha512" }} + {{ end }} {{ if in (slice "blog" "articles" "course" "learn" "benchmarks" "docs" "documentation") .Section }} From 4b3186ea66c3a4c1958cdba0f59614ec52df1a1f Mon Sep 17 00:00:00 2001 From: trean Date: Fri, 19 Jun 2026 12:59:15 +0200 Subject: [PATCH 8/8] fix carousel jump when partially in viewport --- .../_ai-agents-builder-patterns.scss | 2 + .../assets/js/ai-agents/builder-patterns.js | 156 ++++++++++++++---- 2 files changed, 126 insertions(+), 32 deletions(-) diff --git a/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-builder-patterns.scss b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-builder-patterns.scss index a8ba7299fc..fc94d2ffce 100644 --- a/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-builder-patterns.scss +++ b/qdrant-landing/themes/qdrant-2024/assets/css/partials/ai-agents/_ai-agents-builder-patterns.scss @@ -2,6 +2,8 @@ @use 'sass:math'; .ai-agents-builder-patterns { + // Prevent scroll anchoring from shifting the viewport when min-heights settle. + overflow-anchor: none; padding-bottom: $spacer * 5; background-color: $neutral-94; diff --git a/qdrant-landing/themes/qdrant-2024/assets/js/ai-agents/builder-patterns.js b/qdrant-landing/themes/qdrant-2024/assets/js/ai-agents/builder-patterns.js index 7f3237c6af..135b7e4548 100644 --- a/qdrant-landing/themes/qdrant-2024/assets/js/ai-agents/builder-patterns.js +++ b/qdrant-landing/themes/qdrant-2024/assets/js/ai-agents/builder-patterns.js @@ -7,6 +7,8 @@ export function initBuilderPatterns() { '.ai-agents-builder-patterns__visual .ai-agents-builder-patterns__visual-block', ); const featuresContainer = section.querySelector('.ai-agents-builder-patterns__features'); + const visualContainer = section.querySelector('.ai-agents-builder-patterns__visual'); + const content = section.querySelector('.ai-agents-builder-patterns__content'); const slider = section.querySelector('.ai-agents-builder-patterns__slider'); if (!features.length) return; @@ -14,7 +16,13 @@ export function initBuilderPatterns() { let currentIndex = 0; let autoplayInterval = null; + let isInView = true; + let heightsInitialized = false; + let lastMeasuredWidth = 0; + let wasLgUp = window.innerWidth >= breakpoints.lg; const AUTOPLAY_DELAY = 5000; + // Ignore sub-pixel scrollbar gutter oscillation (overlay scrollbars on macOS). + const WIDTH_CHANGE_THRESHOLD = 24; const isLgUp = () => window.innerWidth >= breakpoints.lg; @@ -47,27 +55,31 @@ export function initBuilderPatterns() { const startAutoplay = () => { stopAutoplay(); - if (!isLgUp()) return; + if (!isLgUp() || !isInView || slider?.matches(':hover')) return; autoplayInterval = setInterval(nextFeature, AUTOPLAY_DELAY); }; const syncAutoplay = () => { - if (isLgUp()) { - startAutoplay(); - } else { + if (!isLgUp() || !isInView) { stopAutoplay(); + return; } + startAutoplay(); }; - const applyFeaturesMinHeight = () => { - if (!featuresContainer) return; + const setMinHeight = (element, height) => { + if (!element || !height) return; + const next = `${height}px`; + if (element.style.minHeight === next) return; + element.style.minHeight = next; + }; - const width = featuresContainer.offsetWidth; - if (!width) return; + const measureOffscreenClone = (element, measure) => { + const width = element.offsetWidth; + if (!width) return 0; - const clone = featuresContainer.cloneNode(true); + const clone = element.cloneNode(true); clone.setAttribute('aria-hidden', 'true'); - clone.classList.add('ai-agents-builder-patterns__features--measure'); Object.assign(clone.style, { position: 'absolute', left: '-9999px', @@ -79,20 +91,67 @@ export function initBuilderPatterns() { }); section.appendChild(clone); + const maxHeight = measure(clone); + clone.remove(); - const cloneFeatures = clone.querySelectorAll('.ai-agents-builder-patterns__feature'); - let maxHeight = 0; + return maxHeight; + }; - cloneFeatures.forEach((_, index) => { - cloneFeatures.forEach((feature) => { - feature.classList.remove('ai-agents-builder-patterns__feature--active'); + const applyFeaturesMinHeight = () => { + if (!featuresContainer) return; + + const maxHeight = measureOffscreenClone(featuresContainer, (clone) => { + const cloneFeatures = clone.querySelectorAll('.ai-agents-builder-patterns__feature'); + let height = 0; + + cloneFeatures.forEach((_, index) => { + cloneFeatures.forEach((feature) => { + feature.classList.remove('ai-agents-builder-patterns__feature--active'); + }); + cloneFeatures[index].classList.add('ai-agents-builder-patterns__feature--active'); + height = Math.max(height, clone.offsetHeight); }); - cloneFeatures[index].classList.add('ai-agents-builder-patterns__feature--active'); - maxHeight = Math.max(maxHeight, clone.offsetHeight); + + return height; }); - clone.remove(); - featuresContainer.style.minHeight = `${maxHeight}px`; + setMinHeight(featuresContainer, maxHeight); + }; + + const applyVisualMinHeight = () => { + if (!visualContainer) return; + + if (!isLgUp()) { + visualContainer.style.removeProperty('min-height'); + return; + } + + const maxHeight = measureOffscreenClone(visualContainer, (clone) => { + const cloneBlocks = clone.querySelectorAll('.ai-agents-builder-patterns__visual-block'); + let height = 0; + + cloneBlocks.forEach((block) => { + block.style.display = 'block'; + height = Math.max(height, block.offsetHeight); + }); + + return height; + }); + + setMinHeight(visualContainer, maxHeight); + }; + + const applyLayoutHeights = () => { + applyFeaturesMinHeight(); + applyVisualMinHeight(); + }; + + const initLayoutHeights = () => { + applyLayoutHeights(); + heightsInitialized = true; + if (content) { + lastMeasuredWidth = Math.round(content.getBoundingClientRect().width); + } }; if (slider) { @@ -100,30 +159,63 @@ export function initBuilderPatterns() { slider.addEventListener('mouseleave', syncAutoplay); } - const isSliderHovered = () => slider?.matches(':hover'); features.forEach((feature, index) => { feature.addEventListener('click', () => { goToFeature(index); - if (!isSliderHovered()) { - startAutoplay(); - } + syncAutoplay(); }); }); - let resizeRaf = 0; + if (content && typeof ResizeObserver !== 'undefined') { + const resizeObserver = new ResizeObserver((entries) => { + if (!heightsInitialized) return; + + const width = Math.round(entries[0]?.contentRect.width ?? 0); + if (!width || Math.abs(width - lastMeasuredWidth) < WIDTH_CHANGE_THRESHOLD) return; + + lastMeasuredWidth = width; + applyLayoutHeights(); + }); + + resizeObserver.observe(content); + } + window.addEventListener('resize', () => { - if (resizeRaf) return; - resizeRaf = requestAnimationFrame(() => { - resizeRaf = 0; - applyFeaturesMinHeight(); + const lgUp = isLgUp(); + if (lgUp !== wasLgUp) { + wasLgUp = lgUp; + applyLayoutHeights(); + if (content) { + lastMeasuredWidth = Math.round(content.getBoundingClientRect().width); + } syncAutoplay(); - }); + } }); + if (typeof IntersectionObserver !== 'undefined') { + const visibilityObserver = new IntersectionObserver( + (entries) => { + isInView = entries[0]?.isIntersecting ?? false; + syncAutoplay(); + }, + { threshold: 0 }, + ); + + visibilityObserver.observe(section); + } + goToFeature(0); - applyFeaturesMinHeight(); - if (document.fonts?.ready) { - document.fonts.ready.then(applyFeaturesMinHeight); + + // Measure once after webfonts load. An earlier measure + later remeasure shifts + // min-heights while the section is on screen; scroll anchoring and + // `scroll-behavior: smooth` on then correct scroll position once. + if (document.fonts?.status === 'loaded') { + initLayoutHeights(); + } else if (document.fonts?.ready) { + document.fonts.ready.then(initLayoutHeights); + } else { + initLayoutHeights(); } + syncAutoplay(); }