From 9dc4cf15ec1df4476cdd9a23d02252d35a837033 Mon Sep 17 00:00:00 2001 From: Alexey Rybak Date: Tue, 23 Sep 2025 15:49:21 -0700 Subject: [PATCH] docs: static content migration --- docs/_static/css/my_theme.css | 136 --------- docs/_static/js/detect_theme.js | 32 -- docs/_static/js/horizontal_nav.js | 44 --- docs/_static/js/keyboard_shortcuts.js | 14 - docs/source/conf.py | 156 ---------- docs/{_static => static}/llama-stack-logo.png | Bin docs/{_static => static}/llama-stack.png | Bin .../read_time_comparison_sqlite-vec-faiss.png | Bin ...write_time_comparison_sqlite-vec-faiss.png | Bin .../write_time_sequence_sqlite-vec-faiss.png | Bin docs/{_static => static}/remote_or_local.gif | Bin docs/{_static => static}/safety_system.webp | Bin .../src/components/HomepageFeatures/index.js | 64 ++++ .../HomepageFeatures/styles.module.css | 11 + docs/static/src/css/custom.css | 191 ++++++++++++ docs/static/src/pages/index.js | 163 ++++++++++ docs/static/src/pages/index.module.css | 283 ++++++++++++++++++ docs/static/src/pages/markdown-page.md | 7 + 18 files changed, 719 insertions(+), 382 deletions(-) delete mode 100644 docs/_static/css/my_theme.css delete mode 100644 docs/_static/js/detect_theme.js delete mode 100644 docs/_static/js/horizontal_nav.js delete mode 100644 docs/_static/js/keyboard_shortcuts.js delete mode 100644 docs/source/conf.py rename docs/{_static => static}/llama-stack-logo.png (100%) rename docs/{_static => static}/llama-stack.png (100%) rename docs/{_static => static}/providers/vector_io/read_time_comparison_sqlite-vec-faiss.png (100%) rename docs/{_static => static}/providers/vector_io/write_time_comparison_sqlite-vec-faiss.png (100%) rename docs/{_static => static}/providers/vector_io/write_time_sequence_sqlite-vec-faiss.png (100%) rename docs/{_static => static}/remote_or_local.gif (100%) rename docs/{_static => static}/safety_system.webp (100%) create mode 100644 docs/static/src/components/HomepageFeatures/index.js create mode 100644 docs/static/src/components/HomepageFeatures/styles.module.css create mode 100644 docs/static/src/css/custom.css create mode 100644 docs/static/src/pages/index.js create mode 100644 docs/static/src/pages/index.module.css create mode 100644 docs/static/src/pages/markdown-page.md diff --git a/docs/_static/css/my_theme.css b/docs/_static/css/my_theme.css deleted file mode 100644 index 7dcd97c9b..000000000 --- a/docs/_static/css/my_theme.css +++ /dev/null @@ -1,136 +0,0 @@ -@import url("theme.css"); - -/* Horizontal Navigation Bar */ -.horizontal-nav { - background-color: #ffffff; - border-bottom: 1px solid #e5e5e5; - padding: 0; - position: fixed; - top: 0; - left: 0; - right: 0; - z-index: 1050; - height: 50px; - box-shadow: 0 2px 4px rgba(0,0,0,0.1); -} - -[data-theme="dark"] .horizontal-nav { - background-color: #1a1a1a; - border-bottom: 1px solid #333; -} - -.horizontal-nav .nav-container { - max-width: 1200px; - margin: 0 auto; - display: flex; - align-items: center; - justify-content: space-between; - padding: 0 20px; - height: 100%; -} - -.horizontal-nav .nav-brand { - font-size: 18px; - font-weight: 600; - color: #333; - text-decoration: none; -} - -[data-theme="dark"] .horizontal-nav .nav-brand { - color: #fff; -} - -.horizontal-nav .nav-links { - display: flex; - align-items: center; - gap: 30px; - list-style: none; - margin: 0; - padding: 0; -} - -.horizontal-nav .nav-links a { - color: #666; - text-decoration: none; - font-size: 14px; - font-weight: 500; - padding: 8px 12px; - border-radius: 6px; - transition: all 0.2s ease; -} - -.horizontal-nav .nav-links a:hover, -.horizontal-nav .nav-links a.active { - color: #333; - background-color: #f5f5f5; -} - -.horizontal-nav .nav-links a.active { - font-weight: 600; -} - -[data-theme="dark"] .horizontal-nav .nav-links a { - color: #ccc; -} - -[data-theme="dark"] .horizontal-nav .nav-links a:hover, -[data-theme="dark"] .horizontal-nav .nav-links a.active { - color: #fff; - background-color: #333; -} - -.horizontal-nav .nav-links .github-link { - display: flex; - align-items: center; - gap: 6px; -} - -.horizontal-nav .nav-links .github-icon { - width: 16px; - height: 16px; - fill: currentColor; -} - -/* Adjust main content to account for fixed nav */ -.wy-nav-side { - top: 50px; - height: calc(100vh - 50px); -} - -.wy-nav-content-wrap { - margin-top: 50px; -} - -.wy-nav-content { - max-width: 90%; -} - -.wy-nav-side { - /* background: linear-gradient(45deg, #2980B9, #16A085); */ - background: linear-gradient(90deg, #332735, #1b263c); -} - -.wy-side-nav-search { - background-color: transparent !important; -} - -.hide-title h1 { - display: none; -} - -h2, h3, h4 { - font-weight: normal; -} -html[data-theme="dark"] .rst-content div[class^="highlight"] { - background-color: #0b0b0b; -} -pre { - white-space: pre-wrap !important; - word-break: break-all; -} - -[data-theme="dark"] .mermaid { - background-color: #f4f4f6 !important; - border-radius: 6px; - padding: 0.5em; - } diff --git a/docs/_static/js/detect_theme.js b/docs/_static/js/detect_theme.js deleted file mode 100644 index 712565ef7..000000000 --- a/docs/_static/js/detect_theme.js +++ /dev/null @@ -1,32 +0,0 @@ -document.addEventListener("DOMContentLoaded", function () { - const prefersDark = window.matchMedia("(prefers-color-scheme: dark)").matches; - const htmlElement = document.documentElement; - - // Check if theme is saved in localStorage - const savedTheme = localStorage.getItem("sphinx-rtd-theme"); - - if (savedTheme) { - // Use the saved theme preference - htmlElement.setAttribute("data-theme", savedTheme); - document.body.classList.toggle("dark", savedTheme === "dark"); - } else { - // Fall back to system preference - const theme = prefersDark ? "dark" : "light"; - htmlElement.setAttribute("data-theme", theme); - document.body.classList.toggle("dark", theme === "dark"); - // Save initial preference - localStorage.setItem("sphinx-rtd-theme", theme); - } - - // Listen for theme changes from the existing toggle - const observer = new MutationObserver(function(mutations) { - mutations.forEach(function(mutation) { - if (mutation.attributeName === "data-theme") { - const currentTheme = htmlElement.getAttribute("data-theme"); - localStorage.setItem("sphinx-rtd-theme", currentTheme); - } - }); - }); - - observer.observe(htmlElement, { attributes: true }); -}); diff --git a/docs/_static/js/horizontal_nav.js b/docs/_static/js/horizontal_nav.js deleted file mode 100644 index c2384f9d5..000000000 --- a/docs/_static/js/horizontal_nav.js +++ /dev/null @@ -1,44 +0,0 @@ -// Horizontal Navigation Bar for Llama Stack Documentation -document.addEventListener('DOMContentLoaded', function() { - // Create the horizontal navigation HTML - const navHTML = ` - - `; - - // Insert the navigation at the beginning of the body - document.body.insertAdjacentHTML('afterbegin', navHTML); - - // Update navigation links based on current page - updateActiveNav(); -}); - -function updateActiveNav() { - const currentPath = window.location.pathname; - const navLinks = document.querySelectorAll('.horizontal-nav .nav-links a'); - - navLinks.forEach(link => { - // Remove any existing active classes - link.classList.remove('active'); - - // Add active class based on current path - if (currentPath === '/' && link.getAttribute('href') === '/') { - link.classList.add('active'); - } else if (currentPath.includes('/references/api_reference/') && link.getAttribute('href').includes('api_reference')) { - link.classList.add('active'); - } - }); -} diff --git a/docs/_static/js/keyboard_shortcuts.js b/docs/_static/js/keyboard_shortcuts.js deleted file mode 100644 index 81d0b7c65..000000000 --- a/docs/_static/js/keyboard_shortcuts.js +++ /dev/null @@ -1,14 +0,0 @@ -document.addEventListener('keydown', function(event) { - // command+K or ctrl+K - if ((event.metaKey || event.ctrlKey) && event.key === 'k') { - event.preventDefault(); - document.querySelector('.search-input, .search-field, input[name="q"]').focus(); - } - - // forward slash - if (event.key === '/' && - !event.target.matches('input, textarea, select')) { - event.preventDefault(); - document.querySelector('.search-input, .search-field, input[name="q"]').focus(); - } -}); diff --git a/docs/source/conf.py b/docs/source/conf.py deleted file mode 100644 index 0cbddef31..000000000 --- a/docs/source/conf.py +++ /dev/null @@ -1,156 +0,0 @@ -# Copyright (c) Meta Platforms, Inc. and affiliates. -# All rights reserved. -# -# This source code is licensed under the terms described in the LICENSE file in -# the root directory of this source tree. - -# Configuration file for the Sphinx documentation builder. -# -# For the full list of built-in configuration values, see the documentation: -# https://www.sphinx-doc.org/en/master/usage/configuration.html - -# -- Project information ----------------------------------------------------- -# https://www.sphinx-doc.org/en/master/usage/configuration.html#project-information - -import json -from datetime import datetime -from pathlib import Path - -import requests -from docutils import nodes - -# Read version from pyproject.toml -with Path(__file__).parent.parent.parent.joinpath("pyproject.toml").open("rb") as f: - pypi_url = "https://pypi.org/pypi/llama-stack/json" - headers = { - 'User-Agent': 'pip/23.0.1 (python 3.11)', # Mimic pip's user agent - 'Accept': 'application/json' - } - version_tag = json.loads(requests.get(pypi_url, headers=headers).text)["info"]["version"] - print(f"{version_tag=}") - - # generate the full link including text and url here - llama_stack_version_url = ( - f"https://github.com/meta-llama/llama-stack/releases/tag/v{version_tag}" - ) - llama_stack_version_link = f"release notes" - -project = "llama-stack" -copyright = f"{datetime.now().year}, Meta" -author = "Meta" - -# -- General configuration --------------------------------------------------- -# https://www.sphinx-doc.org/en/master/usage/configuration.html#general-configuration - -extensions = [ - "myst_parser", - "sphinx_copybutton", - "sphinx_design", - "sphinx_rtd_theme", - "sphinx_rtd_dark_mode", - "sphinx_tabs.tabs", - "sphinxcontrib.redoc", - "sphinxcontrib.mermaid", - "sphinxcontrib.video", - "sphinx_reredirects" -] - -redirects = { - "providers/post_training/index": "../../advanced_apis/post_training/index.html", - "providers/eval/index": "../../advanced_apis/eval/index.html", - "providers/scoring/index": "../../advanced_apis/scoring/index.html", - "playground/index": "../../building_applications/playground/index.html", - "openai/index": "../../providers/index.html#openai-api-compatibility", - "introduction/index": "../concepts/index.html#llama-stack-architecture" -} - -myst_enable_extensions = ["colon_fence"] - -html_theme = "sphinx_rtd_theme" -html_use_relative_paths = True -templates_path = ["_templates"] -exclude_patterns = ["_build", "Thumbs.db", ".DS_Store"] - -myst_enable_extensions = [ - "amsmath", - "attrs_inline", - "attrs_block", - "colon_fence", - "deflist", - "dollarmath", - "fieldlist", - "html_admonition", - "html_image", - # "linkify", - "replacements", - "smartquotes", - "strikethrough", - "substitution", - "tasklist", -] - -myst_substitutions = { - "docker_hub": "https://hub.docker.com/repository/docker/llamastack", - "llama_stack_version": version_tag, - "llama_stack_version_link": llama_stack_version_link, -} - -suppress_warnings = ["myst.header"] - -# Copy button settings -copybutton_prompt_text = "$ " # for bash prompts -copybutton_prompt_is_regexp = True -copybutton_remove_prompts = True -copybutton_line_continuation_character = "\\" - -# Source suffix -source_suffix = { - ".rst": "restructuredtext", - ".md": "markdown", -} - -# -- Options for HTML output ------------------------------------------------- -# https://www.sphinx-doc.org/en/master/usage/configuration.html#options-for-html-output - -# html_theme = "alabaster" -html_theme_options = { - "canonical_url": "https://github.com/meta-llama/llama-stack", - "collapse_navigation": False, - # "style_nav_header_background": "#c3c9d4", - 'display_version': True, - 'version_selector': True, -} - -default_dark_mode = False - -html_static_path = ["../_static"] -# html_logo = "../_static/llama-stack-logo.png" -# html_style = "../_static/css/my_theme.css" - - -def setup(app): - app.add_css_file("css/my_theme.css") - app.add_js_file("js/detect_theme.js") - app.add_js_file("js/horizontal_nav.js") - app.add_js_file("js/keyboard_shortcuts.js") - - def dockerhub_role(name, rawtext, text, lineno, inliner, options={}, content=[]): - url = f"https://hub.docker.com/r/llamastack/{text}" - node = nodes.reference(rawtext, text, refuri=url, **options) - return [node], [] - - def repopath_role(name, rawtext, text, lineno, inliner, options={}, content=[]): - parts = text.split("::") - if len(parts) == 2: - link_text = parts[0] - url_path = parts[1] - else: - link_text = text - url_path = text - - url = f"https://github.com/meta-llama/llama-stack/tree/main/{url_path}" - node = nodes.reference(rawtext, link_text, refuri=url, **options) - return [node], [] - - app.add_role("dockerhub", dockerhub_role) - app.add_role("repopath", repopath_role) diff --git a/docs/_static/llama-stack-logo.png b/docs/static/llama-stack-logo.png similarity index 100% rename from docs/_static/llama-stack-logo.png rename to docs/static/llama-stack-logo.png diff --git a/docs/_static/llama-stack.png b/docs/static/llama-stack.png similarity index 100% rename from docs/_static/llama-stack.png rename to docs/static/llama-stack.png diff --git a/docs/_static/providers/vector_io/read_time_comparison_sqlite-vec-faiss.png b/docs/static/providers/vector_io/read_time_comparison_sqlite-vec-faiss.png similarity index 100% rename from docs/_static/providers/vector_io/read_time_comparison_sqlite-vec-faiss.png rename to docs/static/providers/vector_io/read_time_comparison_sqlite-vec-faiss.png diff --git a/docs/_static/providers/vector_io/write_time_comparison_sqlite-vec-faiss.png b/docs/static/providers/vector_io/write_time_comparison_sqlite-vec-faiss.png similarity index 100% rename from docs/_static/providers/vector_io/write_time_comparison_sqlite-vec-faiss.png rename to docs/static/providers/vector_io/write_time_comparison_sqlite-vec-faiss.png diff --git a/docs/_static/providers/vector_io/write_time_sequence_sqlite-vec-faiss.png b/docs/static/providers/vector_io/write_time_sequence_sqlite-vec-faiss.png similarity index 100% rename from docs/_static/providers/vector_io/write_time_sequence_sqlite-vec-faiss.png rename to docs/static/providers/vector_io/write_time_sequence_sqlite-vec-faiss.png diff --git a/docs/_static/remote_or_local.gif b/docs/static/remote_or_local.gif similarity index 100% rename from docs/_static/remote_or_local.gif rename to docs/static/remote_or_local.gif diff --git a/docs/_static/safety_system.webp b/docs/static/safety_system.webp similarity index 100% rename from docs/_static/safety_system.webp rename to docs/static/safety_system.webp diff --git a/docs/static/src/components/HomepageFeatures/index.js b/docs/static/src/components/HomepageFeatures/index.js new file mode 100644 index 000000000..78f410ba6 --- /dev/null +++ b/docs/static/src/components/HomepageFeatures/index.js @@ -0,0 +1,64 @@ +import React from 'react'; +import clsx from 'clsx'; +import styles from './styles.module.css'; + +const FeatureList = [ + { + title: 'Easy to Use', + Svg: require('@site/static/img/undraw_docusaurus_mountain.svg').default, + description: ( + <> + Docusaurus was designed from the ground up to be easily installed and + used to get your website up and running quickly. + + ), + }, + { + title: 'Focus on What Matters', + Svg: require('@site/static/img/undraw_docusaurus_tree.svg').default, + description: ( + <> + Docusaurus lets you focus on your docs, and we'll do the chores. Go + ahead and move your docs into the docs directory. + + ), + }, + { + title: 'Powered by React', + Svg: require('@site/static/img/undraw_docusaurus_react.svg').default, + description: ( + <> + Extend or customize your website layout by reusing React. Docusaurus can + be extended while reusing the same header and footer. + + ), + }, +]; + +function Feature({Svg, title, description}) { + return ( +
+
+ +
+
+

{title}

+

{description}

+
+
+ ); +} + +export default function HomepageFeatures() { + return ( +
+
+
+ {FeatureList.map((props, idx) => ( + + ))} +
+
+
+ ); +} diff --git a/docs/static/src/components/HomepageFeatures/styles.module.css b/docs/static/src/components/HomepageFeatures/styles.module.css new file mode 100644 index 000000000..b248eb2e5 --- /dev/null +++ b/docs/static/src/components/HomepageFeatures/styles.module.css @@ -0,0 +1,11 @@ +.features { + display: flex; + align-items: center; + padding: 2rem 0; + width: 100%; +} + +.featureSvg { + height: 200px; + width: 200px; +} diff --git a/docs/static/src/css/custom.css b/docs/static/src/css/custom.css new file mode 100644 index 000000000..0e4d95b9b --- /dev/null +++ b/docs/static/src/css/custom.css @@ -0,0 +1,191 @@ +/** + * Any CSS included here will be global. The classic template + * bundles Infima by default. Infima is a CSS framework designed to + * work well for content-centric websites. + */ + +/* You can override the default Infima variables here. */ +:root { + /* Llama Stack Original Theme - Based on llamastack.github.io */ + --ifm-color-primary: #4a4a68; + --ifm-color-primary-dark: #3a3a52; + --ifm-color-primary-darker: #332735; + --ifm-color-primary-darkest: #2b2129; + --ifm-color-primary-light: #5a5a7e; + --ifm-color-primary-lighter: #6a6a94; + --ifm-color-primary-lightest: #8080aa; + + /* Additional theme colors */ + --ifm-color-secondary: #1b263c; + --ifm-color-info: #2980b9; + --ifm-color-success: #16a085; + --ifm-color-warning: #f39c12; + --ifm-color-danger: #e74c3c; + + /* Background colors */ + --ifm-background-color: #ffffff; + --ifm-background-surface-color: #f8f9fa; + + /* Code and syntax highlighting */ + --ifm-code-font-size: 95%; + --ifm-pre-background: #1b263c; + --ifm-pre-color: #e1e5e9; + --docusaurus-highlighted-code-line-bg: rgba(51, 39, 53, 0.1); + + /* Link colors */ + --ifm-link-color: var(--ifm-color-primary); + --ifm-link-hover-color: var(--ifm-color-primary-darker); + + /* Navbar */ + --ifm-navbar-background-color: rgba(255, 255, 255, 0.95); + --ifm-navbar-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); + + /* Hero section gradient - matching original theme */ + --hero-gradient: linear-gradient(90deg, #332735 0%, #1b263c 100%); + + /* OpenAPI method colors */ + --openapi-code-blue: #2980b9; + --openapi-code-green: #16a085; + --openapi-code-orange: #f39c12; + --openapi-code-red: #e74c3c; + --openapi-code-purple: #332735; +} + +/* For readability concerns, you should choose a lighter palette in dark mode. */ +[data-theme='dark'] { + /* Dark theme primary colors - lighter versions of original theme */ + --ifm-color-primary: #8080aa; + --ifm-color-primary-dark: #6a6a94; + --ifm-color-primary-darker: #5a5a7e; + --ifm-color-primary-darkest: #4a4a68; + --ifm-color-primary-light: #9090ba; + --ifm-color-primary-lighter: #a0a0ca; + --ifm-color-primary-lightest: #b0b0da; + + /* Dark theme background colors */ + --ifm-background-color: #1a1a1a; + --ifm-background-surface-color: #2a2a2a; + + /* Dark theme navbar */ + --ifm-navbar-background-color: rgba(26, 26, 26, 0.95); + + /* Dark theme code highlighting */ + --docusaurus-highlighted-code-line-bg: rgba(51, 39, 53, 0.3); + + /* Dark theme text colors */ + --ifm-font-color-base: #e1e5e9; + --ifm-font-color-secondary: #a0a6ac; +} + +/* Sidebar Method labels */ +.api-method>.menu__link { + align-items: center; + justify-content: start; +} + +.api-method>.menu__link::before { + width: 50px; + height: 20px; + font-size: 12px; + line-height: 20px; + text-transform: uppercase; + font-weight: 600; + border-radius: 0.25rem; + border: 1px solid; + margin-right: var(--ifm-spacing-horizontal); + text-align: center; + flex-shrink: 0; + border-color: transparent; + color: white; +} + +.get>.menu__link::before { + content: "get"; + background-color: var(--ifm-color-primary); +} + +.put>.menu__link::before { + content: "put"; + background-color: var(--openapi-code-blue); +} + +.post>.menu__link::before { + content: "post"; + background-color: var(--openapi-code-green); +} + +.delete>.menu__link::before { + content: "del"; + background-color: var(--openapi-code-red); +} + +.patch>.menu__link::before { + content: "patch"; + background-color: var(--openapi-code-orange); +} + +.footer--dark { + --ifm-footer-link-color: #ffffff; + --ifm-footer-title-color: #ffffff; +} + +.footer--dark .footer__link-item { + color: #ffffff; +} + +.footer--dark .footer__title { + color: #ffffff; +} + +/* OpenAPI theme fixes for light mode readability */ +/* Version badge fixes */ +.openapi__version-badge, +.theme-doc-version-badge, +[class*="version-badge"], +[class*="versionBadge"] { + background-color: #ffffff !important; + color: #333333 !important; + border: 1px solid #d1d5db !important; +} + +/* OpenAPI method badges in light mode */ +.openapi__method-badge, +[class*="method-badge"] { + color: #ffffff !important; +} + +/* Button fixes for light mode */ +.openapi__button, +.theme-api-docs-demo-panel button, +[class*="api-docs"] button, +button[class*="button"], +.openapi-explorer__response-schema button, +.openapi-tabs__operation button { + color: #ffffff !important; +} + +.openapi__button:hover, +.theme-api-docs-demo-panel button:hover, +[class*="api-docs"] button:hover, +button[class*="button"]:hover, +.openapi-explorer__response-schema button:hover, +.openapi-tabs__operation button:hover { + color: #ffffff !important; +} + +/* Navigation buttons (Next/Previous) */ +.pagination-nav__link, +.pagination-nav__label { + color: #333333 !important; +} + +.pagination-nav__link--next, +.pagination-nav__link--prev { + background-color: #ffffff !important; + border: 1px solid #d1d5db !important; +} + +.pagination-nav__link--next:hover, +.pagination-nav__link--prev:hover { + background-color: #f3f4f6 !important; +} diff --git a/docs/static/src/pages/index.js b/docs/static/src/pages/index.js new file mode 100644 index 000000000..fe14e920c --- /dev/null +++ b/docs/static/src/pages/index.js @@ -0,0 +1,163 @@ +import React from 'react'; +import clsx from 'clsx'; +import Layout from '@theme/Layout'; +import Link from '@docusaurus/Link'; +import useDocusaurusContext from '@docusaurus/useDocusaurusContext'; +import styles from './index.module.css'; + +function HomepageHeader() { + const {siteConfig} = useDocusaurusContext(); + return ( +
+
+
+

Build AI Applications with Llama Stack

+

+ Unified APIs for Inference, RAG, Agents, Tools, Safety, and Telemetry +

+
+ + 🚀 Get Started + + + 📚 API Reference + +
+
+
+
+ ); +} + +function QuickStart() { + return ( +
+
+
+
+

Quick Start

+

+ Get up and running with Llama Stack in just a few commands. Build your first RAG application locally. +

+
+ 
{`# Install uv and start Ollama
+ollama run llama3.2:3b --keepalive 60m
+
+# Run Llama Stack server
+OLLAMA_URL=http://localhost:11434 \\
+  uv run --with llama-stack \\
+  llama stack build --distro starter \\
+  --image-type venv --run
+
+# Try the Python SDK
+from llama_stack_client import LlamaStackClient
+
+client = LlamaStackClient(
+  base_url="http://localhost:8321"
+)
+
+response = client.inference.chat_completion(
+  model="Llama3.2-3B-Instruct",
+  messages=[{
+    "role": "user",
+    "content": "What is machine learning?"
+  }]
+)`}
+
+
+
+

Why Llama Stack?

+
+
+
🔗
+
+

Unified APIs

+

One consistent interface for all your AI needs - inference, safety, agents, and more.

+
+
+
+
🔄
+
+

Provider Flexibility

+

Swap between providers without code changes. Start local, deploy anywhere.

+
+
+
+
🛡️
+
+

Production Ready

+

Built-in safety, monitoring, and evaluation tools for enterprise applications.

+
+
+
+
📱
+
+

Multi-Platform

+

SDKs for Python, Node.js, iOS, Android, and REST APIs for any language.

+
+
+
+
+
+
+
+ ); +} + +function CommunityLinks() { + return ( +
+
+
+

Join the Community

+

+ Connect with developers building the future of AI applications +

+
+ + ⭐ + Star on GitHub + + + 💬 + Join Discord + + + 📚 + Read Docs + +
+
+
+
+ ); +} + +export default function Home() { + const {siteConfig} = useDocusaurusContext(); + return ( + + +
+ + +
+ + ); +} diff --git a/docs/static/src/pages/index.module.css b/docs/static/src/pages/index.module.css new file mode 100644 index 000000000..c3681653b --- /dev/null +++ b/docs/static/src/pages/index.module.css @@ -0,0 +1,283 @@ +/** + * CSS files with the .module.css suffix will be treated as CSS modules + * and scoped locally. + */ + +.heroBanner { + padding: 4rem 0; + text-align: center; + position: relative; + overflow: hidden; + background: var(--hero-gradient); + color: white; + display: flex; + align-items: center; +} + +.heroBanner::before { + content: ''; + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.1) 0%, transparent 50%), + radial-gradient(circle at 70% 80%, rgba(255, 255, 255, 0.05) 0%, transparent 50%); + pointer-events: none; +} + +.heroContent { + max-width: 800px; + margin: 0 auto; +} + +.heroLogo { + height: 48px; + width: auto; + margin-bottom: 1.5rem; +} + +.heroTitle { + font-size: 2.8rem; + font-weight: 700; + margin-bottom: 1rem; + line-height: 1.2; +} + +.heroSubtitle { + font-size: 1.1rem; + font-weight: 400; + margin-bottom: 2rem; + opacity: 0.9; + line-height: 1.5; + max-width: 600px; + margin-left: auto; + margin-right: auto; +} + +.buttons { + display: flex; + align-items: center; + justify-content: center; + gap: 1rem; +} + +.heroBanner .getStartedButton { + background: white; + color: #332735; + border: 2px solid white; + font-weight: 600; + transition: all 0.3s ease; +} + +.heroBanner .getStartedButton:hover { + background: rgba(255, 255, 255, 0.9); + color: #2b2129; + border-color: rgba(255, 255, 255, 0.9); + transform: translateY(-2px); + box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15); +} + +.heroBanner .apiButton { + background: transparent; + color: white; + border: 2px solid white; + font-weight: 600; + transition: all 0.3s ease; +} + +.heroBanner .apiButton:hover { + background: white; + border-color: white; + color: #332735; + transform: translateY(-2px); +} + +/* Quick Start Section */ +.quickStart { + padding: 4rem 0; + background: var(--ifm-background-color); +} + +.sectionTitle { + font-size: 2rem; + font-weight: 600; + margin-bottom: 0.75rem; + color: var(--ifm-color-emphasis-800); +} + +.sectionDescription { + font-size: 1rem; + color: var(--ifm-color-emphasis-600); + margin-bottom: 1.5rem; + line-height: 1.5; +} + +.codeBlock { + background: var(--ifm-color-gray-900); + border-radius: 8px; + padding: 1.5rem; + margin-top: 1.5rem; + box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); +} + +.codeBlock pre { + margin: 0; + padding: 0; + background: none; + border: none; +} + +.codeBlock code { + color: var(--ifm-color-gray-100); + font-family: 'Fira Code', 'Consolas', 'Monaco', monospace; + font-size: 0.9rem; + line-height: 1.6; +} + +/* Features */ +.features { + display: flex; + flex-direction: column; + gap: 1rem; + margin-top: 1.5rem; +} + +.feature { + display: flex; + align-items: flex-start; + gap: 1rem; + padding: 1rem; + border-radius: 8px; + background: var(--ifm-color-gray-50); + border: 1px solid var(--ifm-color-gray-200); + transition: all 0.2s ease; +} + +.feature:hover { + transform: translateY(-2px); + box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1); + border-color: var(--ifm-color-primary-lighter); +} + +.featureIcon { + font-size: 2rem; + width: 3rem; + height: 3rem; + display: flex; + align-items: center; + justify-content: center; + background: var(--ifm-color-primary-lightest); + border-radius: 50%; + flex-shrink: 0; +} + +.feature h4 { + margin: 0 0 0.5rem 0; + font-size: 1.1rem; + font-weight: 600; + color: var(--ifm-color-emphasis-800); +} + +.feature p { + margin: 0; + color: var(--ifm-color-emphasis-600); + line-height: 1.5; +} + +/* Community Section */ +.community { + padding: 3rem 0; + background: var(--ifm-color-gray-50); + border-top: 1px solid var(--ifm-color-gray-200); +} + +.communityContent { + text-align: center; + max-width: 600px; + margin: 0 auto; +} + +.communityLinks { + display: flex; + justify-content: center; + gap: 1rem; + margin-top: 2rem; +} + +.communityButton { + display: flex; + align-items: center; + gap: 0.5rem; + font-weight: 600; + transition: all 0.3s ease; +} + +.communityButton:hover { + transform: translateY(-2px); + box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1); +} + +.communityIcon { + font-size: 1.2rem; +} + +/* Responsive Design */ +@media screen and (max-width: 996px) { + .heroBanner { + padding: 3rem 2rem; + } + + .heroTitle { + font-size: 2.2rem; + } + + .heroSubtitle { + font-size: 1rem; + } + + .buttons { + flex-direction: column; + gap: 1rem; + } + + .quickStart { + padding: 3rem 0; + } + + .sectionTitle { + font-size: 1.75rem; + } + + .communityLinks { + flex-direction: column; + align-items: center; + } + + .communityButton { + width: 200px; + justify-content: center; + } +} + +@media screen and (max-width: 768px) { + .heroLogo { + height: 40px; + } + + .heroTitle { + font-size: 1.8rem; + } + + .codeBlock { + padding: 1rem; + } + + .codeBlock code { + font-size: 0.8rem; + } + + .feature { + padding: 0.75rem; + } +} diff --git a/docs/static/src/pages/markdown-page.md b/docs/static/src/pages/markdown-page.md new file mode 100644 index 000000000..9756c5b66 --- /dev/null +++ b/docs/static/src/pages/markdown-page.md @@ -0,0 +1,7 @@ +--- +title: Markdown page example +--- + +# Markdown page example + +You don't need React to write simple standalone pages.