diff --git a/README.md b/README.md index 7474a1f0..a1449025 100644 --- a/README.md +++ b/README.md @@ -63,12 +63,12 @@ keeping the files under the user's control. - [2026.08] - Published the [ReMe blog](docs/en/reme-blog.md), an end-to-end introduction to its local-first memory architecture, self-evolving workflows, hybrid search, proactive discovery, and benchmark results. -- [2026.08] - Introduced [ReMe Studio](website/README.md), a local web workspace for browsing, editing, and searching +- [2026.08] - Introduced [ReMe Studio](https://reme.agentscope.io/?doc=studio-en), a local web workspace for browsing, editing, and searching memory files, chatting with the read-only ReMe Agent, inspecting the digest wikilink graph, and managing the local service. -- [2026.08] - [Experience-driven enhancement method](benchmark/toolmemory/README.md) of agent tool-use execution built +- [2026.08] - [Experience-driven enhancement method](https://reme.agentscope.io/?doc=toolmemory-en) of agent tool-use execution built on ReMe is available on [arXiv:2608.03403](https://arxiv.org/abs/2608.03403). -- [2026.07] - Introduced optional Cookbooks: [Daily Paper](cookbook/daily_paper/README.md) for paper discovery and - analysis, and [Auto Fin](cookbook/auto-fin/README.md) for researching the latest 24 hours of topic-related CLS news +- [2026.07] - Introduced optional Cookbooks: [Daily Paper](https://reme.agentscope.io/?doc=daily-paper-en) for paper discovery and + analysis, and [Auto Fin](https://reme.agentscope.io/?doc=auto-fin-en) for researching the latest 24 hours of topic-related CLS news with local-memory search and validated historical wikilinks. - [2026.07] - Our paper [Remember Me, Refine Me: A Dynamic Procedural Memory Framework for Experience-Driven Agent Evolution](https://aclanthology.org/2026.findings-acl.829/) @@ -171,7 +171,7 @@ npm run dev Then open . The development server uses `http://127.0.0.1:2333` by default; set `NEXT_PUBLIC_REME_API_URL` to connect to another ReMe HTTP service. Static-build and frontend configuration instructions are -in the [ReMe Studio guide](website/README.md). +in the [ReMe Studio guide](https://reme.agentscope.io/?doc=studio-en). ### 5-Minute Memory Demo @@ -222,7 +222,7 @@ These Markdown guides cover the main user workflows and the runtime contracts im | [Proactive](docs/en/proactive.md) | Read interest topics safely and integrate them into a host agent's decision flow. | | [Agent Integration Scenarios](docs/en/reme_scene.md) | Choose among CLI/SKILL.md, HTTP, MCP, and embedded Python integration. | | [Framework](docs/en/framework.md) | Understand Application, Job, Step, Component, service, configuration, and lifecycle boundaries. | -| [ReMe Studio](website/README.md) | Use, configure, develop, test, and build the web frontend. | +| [ReMe Studio](https://reme.agentscope.io/?doc=studio-en) | Use, configure, develop, test, and build the web frontend. | | [ReMe Blog](docs/en/reme-blog.md) | Read the product story, design rationale, examples, and benchmark summary. | ## 🧑‍🍳 Cookbooks @@ -233,8 +233,8 @@ another row in this table. | Cookbook | Capability | |-----------------------------------------------|---------------------------------------------------------------------------------------------------------------| -| [Daily Paper](cookbook/daily_paper/README.md) | Discover and rank papers, analyze PDFs with an agent, and generate file-native notes and a five-minute brief. | -| [Auto Fin](cookbook/auto-fin/README.md) | Fetch topic-related CLS news, search ReMe history, and generate wikilink-backed Markdown reports. | +| [Daily Paper](https://reme.agentscope.io/?doc=daily-paper-en) | Discover and rank papers, analyze PDFs with an agent, and generate file-native notes and a five-minute brief. | +| [Auto Fin](https://reme.agentscope.io/?doc=auto-fin-en) | Fetch topic-related CLS news, search ReMe history, and generate wikilink-backed Markdown reports. | ## 📁 Memory System @@ -338,12 +338,12 @@ benchmark. | Benchmark | Setting | Sample size | Agentic score | Focus | |--------------------------------------------------------------|--------------|-------------------------:|--------------:|--------------------------------------------------------------------| -| **[LongMemEval cleaned-s](benchmark/longmemeval/README.md)** | **Overall** | **500 questions** | **89.4%** | Cross-session retrieval, knowledge updates, and temporal reasoning | -| [BEAM](benchmark/beam/README.md) | 100K context | 20 cases / 400 questions | 66.1% | Ten types of long-context memory tasks | -| [BEAM](benchmark/beam/README.md) | 1M context | 35 cases / 700 questions | 65.0% | Ultra-long conversation settings | +| **[LongMemEval cleaned-s](https://reme.agentscope.io/?doc=longmemeval-en)** | **Overall** | **500 questions** | **89.4%** | Cross-session retrieval, knowledge updates, and temporal reasoning | +| [BEAM](https://reme.agentscope.io/?doc=beam-en) | 100K context | 20 cases / 400 questions | 66.1% | Ten types of long-context memory tasks | +| [BEAM](https://reme.agentscope.io/?doc=beam-en) | 1M context | 35 cases / 700 questions | 65.0% | Ultra-long conversation settings | ReMe also achieved a **0.580 PROC score across five user personas** in the repository's -[π-Bench evaluation](benchmark/pibench/README.md), 2.4% above NanoBot under the same test-model configuration. PROC +[π-Bench evaluation](https://reme.agentscope.io/?doc=pibench-en), 2.4% above NanoBot under the same test-model configuration. PROC measures proactive handling of hidden intent, clarification, cross-session preferences and conventions, task dependencies, and underspecified requests. diff --git a/README_ZH.md b/README_ZH.md index a5b07396..a1c6a7a7 100644 --- a/README_ZH.md +++ b/README_ZH.md @@ -55,13 +55,13 @@ Code 等 Agent 协作，在持续整理知识的同时，始终把文件控制 - [2026.08] - 发布 [ReMe 博客](docs/zh/reme-blog.md)，系统介绍本地优先的记忆架构、自进化工作流、混合检索、 主动发现与评测结果。 -- [2026.08] - 新增 [ReMe Studio](website/README_ZH.md)：用于浏览、编辑和搜索记忆文件，与只读 ReMe Agent +- [2026.08] - 新增 [ReMe Studio](https://reme.agentscope.io/?doc=studio-zh)：用于浏览、编辑和搜索记忆文件，与只读 ReMe Agent 对话，查看 digest wikilink 图，并管理本地服务。 - [2026.08] - 基于 ReMe 的智能体工具使用 - [经验驱动增强方法](benchmark/toolmemory/README_ZH.md)已发布，见 + [经验驱动增强方法](https://reme.agentscope.io/?doc=toolmemory-zh)已发布，见 [arXiv:2608.03403](https://arxiv.org/abs/2608.03403)。 -- [2026.07] - 新增可选 Cookbook 工作流：[每日论文](cookbook/daily_paper/README_ZH.md)用于论文发现与解析， - [Auto Fin](cookbook/auto-fin/README_ZH.md)用于研究最近 24 小时的主题相关财联社新闻，通过本地记忆搜索回顾历史材料并构建 +- [2026.07] - 新增可选 Cookbook 工作流：[每日论文](https://reme.agentscope.io/?doc=daily-paper-zh)用于论文发现与解析， + [Auto Fin](https://reme.agentscope.io/?doc=auto-fin-zh)用于研究最近 24 小时的主题相关财联社新闻，通过本地记忆搜索回顾历史材料并构建 wikilink。 - [2026.07] - 我们的论文 [Remember Me, Refine Me: A Dynamic Procedural Memory Framework for Experience-Driven Agent Evolution](https://aclanthology.org/2026.findings-acl.829/) @@ -163,7 +163,7 @@ npm run dev ``` 然后打开 。开发服务默认连接 `http://127.0.0.1:2333`；如需连接其他 ReMe HTTP -服务，请设置 `NEXT_PUBLIC_REME_API_URL`。静态构建和前端配置说明见 [ReMe Studio 指南](website/README_ZH.md)。 +服务，请设置 `NEXT_PUBLIC_REME_API_URL`。静态构建和前端配置说明见 [ReMe Studio 指南](https://reme.agentscope.io/?doc=studio-zh)。 ### 5 分钟记忆 Demo @@ -214,7 +214,7 @@ ReMe 会把 Agent 记忆保存为可读的 Markdown。 | [Proactive](docs/zh/proactive.md) | 安全读取兴趣主题，并将其接入宿主 Agent 的决策流程。 | | [Agent 接入场景](docs/zh/reme_scene.md) | 在 CLI/SKILL.md、HTTP、MCP 和嵌入式 Python 集成之间选择。 | | [框架说明](docs/zh/framework.md) | 理解 Application、Job、Step、Component、service、配置和生命周期边界。 | -| [ReMe Studio](website/README_ZH.md) | 使用、配置、开发、测试和构建 Web 前端。 | +| [ReMe Studio](https://reme.agentscope.io/?doc=studio-zh) | 使用、配置、开发、测试和构建 Web 前端。 | | [ReMe 博客](docs/zh/reme-blog.md) | 了解完整产品故事、设计动机、使用示例和评测摘要。 | ## 🧑‍🍳 Cookbooks @@ -224,8 +224,8 @@ cookbook 会继续在表格中按行追加。 | Cookbook | 能力 | |-----------------------------------------------|--------------------------------------------------------------------------------| -| [每日论文](cookbook/daily_paper/README_ZH.md) | 发现并排序论文，使用 Agent 解读 PDF，生成文件化论文笔记和五分钟简报。 | -| [Auto Fin](cookbook/auto-fin/README_ZH.md) | 拉取主题相关财联社新闻，搜索 ReMe 历史材料并生成带 wikilink 的 Markdown 报告。 | +| [每日论文](https://reme.agentscope.io/?doc=daily-paper-zh) | 发现并排序论文，使用 Agent 解读 PDF，生成文件化论文笔记和五分钟简报。 | +| [Auto Fin](https://reme.agentscope.io/?doc=auto-fin-zh) | 拉取主题相关财联社新闻，搜索 ReMe 历史材料并生成带 wikilink 的 Markdown 报告。 | ## 📁 记忆系统 @@ -320,11 +320,11 @@ ReMe 通过 Agent 多轮搜索与读取的方式，评测多会话和超长上 | 基准 | 设置 | 样本量 | Agentic 得分 | 主要检验内容 | |-----------------------------------------------------------------|-------------|------------------:|-------------:|--------------------------------| -| **[LongMemEval cleaned-s](benchmark/longmemeval/README_ZH.md)** | **整体** | **500 题** | **89.4%** | 跨会话检索、知识更新与时间推理 | -| [BEAM](benchmark/beam/README_ZH.md) | 100K 上下文 | 20 cases / 400 题 | 66.1% | 十类长上下文记忆任务 | -| [BEAM](benchmark/beam/README_ZH.md) | 1M 上下文 | 35 cases / 700 题 | 65.0% | 超长对话设置 | +| **[LongMemEval cleaned-s](https://reme.agentscope.io/?doc=longmemeval-zh)** | **整体** | **500 题** | **89.4%** | 跨会话检索、知识更新与时间推理 | +| [BEAM](https://reme.agentscope.io/?doc=beam-zh) | 100K 上下文 | 20 cases / 400 题 | 66.1% | 十类长上下文记忆任务 | +| [BEAM](https://reme.agentscope.io/?doc=beam-zh) | 1M 上下文 | 35 cases / 700 题 | 65.0% | 超长对话设置 | -在仓库的 [π-Bench 评测](benchmark/pibench/README_ZH.md)中，ReMe Agent 在 5 种用户角色上的平均 **PROC 得分为 0.580** +在仓库的 [π-Bench 评测](https://reme.agentscope.io/?doc=pibench-zh)中，ReMe Agent 在 5 种用户角色上的平均 **PROC 得分为 0.580** ，比相同测试模型配置的 NanoBot 高 2.4%。PROC 用于评估隐藏意图完成、针对性澄清、跨会话偏好和规范复用、跨任务依赖推断以及欠规格请求推进等主动性能力。 ## 🤝 Agent-friendly Integration diff --git a/github-pages/README.md b/github-pages/README.md index 391d7733..fca537ee 100644 --- a/github-pages/README.md +++ b/github-pages/README.md @@ -50,6 +50,9 @@ The build script reads the canonical repository files directly. Do not edit gene - `README.md` and `README_ZH.md`: project introductions - `docs/en/` and `docs/zh/`: English and Chinese guides - `docs/figure/`: documentation images +- `website/README.md` and `website/README_ZH.md`: ReMe Studio guide +- `cookbook/*/README*.md`: research workflow guides +- `benchmark/{beam,longmemeval,pibench,toolmemory}/README*.md`: benchmark guides and results - `skills/reme_memory/SKILL.md`: ReMe Memory skill guide - `AGENTS.md`: repository development guide diff --git a/github-pages/scripts/generate-content.mjs b/github-pages/scripts/generate-content.mjs index f8fedf14..e6957ada 100644 --- a/github-pages/scripts/generate-content.mjs +++ b/github-pages/scripts/generate-content.mjs @@ -51,6 +51,79 @@ const localizedTitles = { contributing: { zh: "开源与贡献", en: "Open Source and Contributing" }, }; +const productDocuments = [ + { + slug: "studio", + source: "website", + titles: { zh: "ReMe 工作台", en: "ReMe Studio" }, + descriptions: { + zh: "浏览、编辑和搜索本地记忆，并探索记忆图谱。", + en: "Browse, edit, search, and explore local memory from the web workspace.", + }, + group: "workspace", + }, + { + slug: "daily-paper", + source: "cookbook/daily_paper", + titles: { zh: "每日论文", en: "Daily Paper" }, + descriptions: { + zh: "发现论文、解析 PDF，并生成阅读笔记与每日简报。", + en: "Discover papers, analyze PDFs, and produce reading notes and a daily brief.", + }, + group: "cookbooks", + }, + { + slug: "auto-fin", + source: "cookbook/auto-fin", + titles: { zh: "财经研究", en: "Auto Fin" }, + descriptions: { + zh: "结合最新财联社新闻与本地历史记忆生成研究报告。", + en: "Research recent CLS news with historical context from local memory.", + }, + group: "cookbooks", + }, + { + slug: "beam", + source: "benchmark/beam", + titles: { zh: "BEAM", en: "BEAM" }, + descriptions: { + zh: "评测大规模记忆检索能力。", + en: "Evaluate memory retrieval at scale.", + }, + group: "benchmarks", + }, + { + slug: "longmemeval", + source: "benchmark/longmemeval", + titles: { zh: "LongMemEval", en: "LongMemEval" }, + descriptions: { + zh: "评测跨会话长期记忆问答能力。", + en: "Evaluate long-term, cross-session memory question answering.", + }, + group: "benchmarks", + }, + { + slug: "pibench", + source: "benchmark/pibench", + titles: { zh: "π-Bench", en: "π-Bench" }, + descriptions: { + zh: "评测带持久记忆的个人智能体。", + en: "Evaluate personal agents with persistent memory.", + }, + group: "benchmarks", + }, + { + slug: "toolmemory", + source: "benchmark/toolmemory", + titles: { zh: "Tool Memory / ExpG", en: "Tool Memory / ExpG" }, + descriptions: { + zh: "通过经验驱动的自适应指导增强 Agent 工具使用。", + en: "Improve agent tool use through experience-driven adaptive guidance.", + }, + group: "benchmarks", + }, +]; + const sharedDocuments = [ { id: "reme-memory-skill", @@ -118,6 +191,19 @@ async function buildManifest() { language, }); } + + for (const product of productDocuments) { + const filename = language === "zh" ? "README_ZH.md" : "README.md"; + documents.push({ + id: `${product.slug}-${language}`, + path: `${product.source}/${filename}`, + sourcePath: `${product.source}/${filename}`, + title: product.titles[language], + description: product.descriptions[language], + group: product.group, + language, + }); + } } return [...documents, ...sharedDocuments]; @@ -135,6 +221,14 @@ await cp(path.join(repoDir, "docs"), path.join(outputDir, "docs"), { recursive: true, filter: (source) => path.basename(source) !== ".DS_Store", }); +for (const product of productDocuments) { + await mkdir(path.join(outputDir, product.source), { recursive: true }); + for (const filename of ["README.md", "README_ZH.md"]) { + await cp(path.join(repoDir, product.source, filename), path.join(outputDir, product.source, filename)); + } +} +await mkdir(path.join(outputDir, "website", "public"), { recursive: true }); +await cp(path.join(repoDir, "website", "public", "og.png"), path.join(outputDir, "website", "public", "og.png")); await mkdir(path.join(outputDir, "skills", "reme_memory"), { recursive: true }); await cp( path.join(repoDir, "skills", "reme_memory", "SKILL.md"), diff --git a/github-pages/src/main.js b/github-pages/src/main.js index 23f60b4d..02734c5f 100644 --- a/github-pages/src/main.js +++ b/github-pages/src/main.js @@ -4,17 +4,17 @@ import "./styles.css"; const baseUrl = import.meta.env.BASE_URL; const repositoryUrl = "https://github.com/agentscope-ai/ReMe"; -const officialDocsUrl = "https://reme.agentscope.io"; const copy = { zh: { docs: "文档", + home: "首页", search: "搜索文档…", noResults: "没有找到匹配的文档", menu: "打开导航", toc: "本页目录", edit: "在 GitHub 查看源文件", - officialDocs: "官方文档", + quickStart: "快速开始", groups: { overview: "项目介绍", start: "开始使用", @@ -22,17 +22,21 @@ const copy = { automation: "自动化能力", concepts: "架构与场景", integration: "Agent 集成", + workspace: "工作区", + cookbooks: "研究工作流", + benchmarks: "评测", development: "开发者规范", }, }, en: { docs: "Documentation", + home: "Home", search: "Search documentation…", noResults: "No matching documents", menu: "Open navigation", toc: "On this page", edit: "View source on GitHub", - officialDocs: "Official docs", + quickStart: "Quick start", groups: { overview: "Introduction", start: "Get started", @@ -40,6 +44,9 @@ const copy = { automation: "Automation", concepts: "Architecture & scenarios", integration: "Agent integration", + workspace: "Workspace", + cookbooks: "Research workflows", + benchmarks: "Benchmarks", development: "Development", }, }, @@ -52,6 +59,43 @@ const state = { query: "", }; +const homeCopy = { + zh: { + eyebrow: "LOCAL-FIRST · FILE-NATIVE", + title: "让 Agent 真正记住，\n也让记忆始终属于你。", + description: "ReMe 将对话和资料沉淀为可读、可编辑、可检索、相互链接的 Markdown，并提供从工作区管理到主动研究的一整套工具。", + start: "快速开始", + project: "了解 ReMe", + explore: "按目标探索", + exploreDescription: "选择你现在想完成的事情。每个入口都直接连接到对应的完整文档。", + cards: [ + { id: "studio-zh", icon: "◫", label: "管理记忆", title: "ReMe 工作台", description: "在本地 Web 工作区中浏览、编辑、搜索记忆，并探索 wikilink 图谱。", tone: "mint" }, + { id: "daily-paper-zh", icon: "◌", label: "发现与分析", title: "每日论文", description: "从论文榜单筛选值得阅读的工作，解析 PDF，并生成笔记与五分钟简报。", tone: "blue" }, + { id: "auto-fin-zh", icon: "↗", label: "主题研究", title: "财经研究", description: "连接最新财联社新闻和本地历史记忆，生成可追溯的研究报告。", tone: "amber" }, + ], + benchmark: "验证记忆能力", + benchmarkDescription: "从检索规模、跨会话问答、个人智能体到工具经验，查看 ReMe 的四套评测与复现实验。", + benchmarkAction: "浏览全部评测", + }, + en: { + eyebrow: "LOCAL-FIRST · FILE-NATIVE", + title: "Memory that works for agents.\nFiles that remain yours.", + description: "ReMe turns conversations and resources into readable, editable, searchable, interconnected Markdown—with tools spanning workspace management and proactive research.", + start: "Quick start", + project: "Meet ReMe", + explore: "Explore by goal", + exploreDescription: "Start with what you want to accomplish. Every entry opens the complete guide.", + cards: [ + { id: "studio-en", icon: "◫", label: "Manage memory", title: "ReMe Studio", description: "Browse, edit, and search memory in a local web workspace, then explore its wikilink graph.", tone: "mint" }, + { id: "daily-paper-en", icon: "◌", label: "Discover & analyze", title: "Daily Paper", description: "Select useful papers from rankings, analyze PDFs, and create notes plus a five-minute brief.", tone: "blue" }, + { id: "auto-fin-en", icon: "↗", label: "Research topics", title: "Auto Fin", description: "Connect recent CLS news with historical local memory to produce traceable research reports.", tone: "amber" }, + ], + benchmark: "Validate memory systems", + benchmarkDescription: "Explore four reproducible evaluations covering retrieval scale, cross-session QA, personal agents, and tool-use experience.", + benchmarkAction: "Browse all benchmarks", + }, +}; + const app = document.querySelector("#app"); app.innerHTML = ` @@ -67,7 +111,7 @@ app.innerHTML = ` - + GitHub ↗ @@ -94,6 +138,7 @@ app.innerHTML = ` `; const sidebar = app.querySelector(".sidebar"); +const docsShell = app.querySelector(".docs-shell"); const documentNav = app.querySelector(".document-nav"); const article = app.querySelector(".article"); const toc = app.querySelector(".toc"); @@ -172,7 +217,10 @@ function documentTitle(document) { function renderChrome() { const labels = copy[state.language]; app.querySelector("[data-copy='docs']").textContent = labels.docs; - app.querySelector("[data-copy='officialDocs']").textContent = `${labels.officialDocs} ↗`; + const quickStartLink = app.querySelector("[data-copy='quickStart']"); + quickStartLink.textContent = `${labels.quickStart} →`; + quickStartLink.href = `?doc=${state.language}-quick_start`; + quickStartLink.dataset.doc = `${state.language}-quick_start`; searchInput.placeholder = labels.search; menuButton.textContent = labels.menu; document.documentElement.lang = state.language === "zh" ? "zh-CN" : "en"; @@ -190,11 +238,16 @@ function renderNavigation() { const groups = [...new Set(filtered.map((document) => document.group))]; if (!filtered.length) { - documentNav.innerHTML = `

${labels.noResults}

`; + documentNav.innerHTML = ` + ${labels.home} +

${labels.noResults}

+ `; return; } - documentNav.innerHTML = groups + documentNav.innerHTML = ` + ${labels.home} + ` + groups .map( (group) => `
@@ -213,6 +266,52 @@ function renderNavigation() { .join(""); } +function renderHome(pushHistory = true) { + const labels = homeCopy[state.language]; + state.activeDocument = null; + docsShell.classList.add("home-view"); + article.dataset.group = "home"; + renderNavigation(); + article.innerHTML = ` +
+

${labels.eyebrow}

+

${labels.title.replace("\n", "
")}

+

${labels.description}

+
+ ${labels.start} → + ${labels.project} +
+
+
+

01 / PRODUCT & WORKFLOWS

+

${labels.explore}

+

${labels.exploreDescription}

+
+ ${labels.cards.map((card) => ` + + ${card.icon} + ${card.label} + ${card.title} + ${card.description} + → + `).join("")} +
+
+
+
+

02 / BENCHMARKS

+

${labels.benchmark}

+

${labels.benchmarkDescription}

+
+ ${labels.benchmarkAction} → +
+ `; + toc.innerHTML = ""; + closeMenu(); + if (pushHistory) history.pushState({ home: true }, "", baseUrl); + window.scrollTo({ top: 0, behavior: "instant" }); +} + function renderToc() { const headings = [...article.querySelectorAll("h2, h3")]; if (!headings.length) { @@ -257,7 +356,13 @@ function rewriteRenderedUrls(document) { async function openDocument(id, pushHistory = true) { const fallbackId = state.language === "zh" ? "readme-zh" : "readme-en"; const document = state.documents.find((item) => item.id === id) || state.documents.find((item) => item.id === fallbackId); + if (document.language !== "shared" && document.language !== state.language) { + state.language = document.language; + localStorage.setItem("reme-docs-language", state.language); + renderChrome(); + } state.activeDocument = document; + docsShell.classList.remove("home-view"); article.dataset.group = document.group; renderNavigation(); article.innerHTML = `
`; @@ -301,6 +406,12 @@ function toggleMenu() { } app.addEventListener("click", (event) => { + const homeLink = event.target.closest("[data-home]"); + if (homeLink) { + event.preventDefault(); + renderHome(); + return; + } const documentLink = event.target.closest("[data-doc]"); if (documentLink) { event.preventDefault(); @@ -314,7 +425,7 @@ app.addEventListener("click", (event) => { state.query = ""; searchInput.value = ""; renderChrome(); - openDocument(state.language === "zh" ? "readme-zh" : "readme-en"); + renderHome(); } }); @@ -332,9 +443,15 @@ document.addEventListener("keydown", (event) => { }); backdrop.addEventListener("click", closeMenu); -window.addEventListener("popstate", (event) => openDocument(event.state?.doc || new URLSearchParams(location.search).get("doc"), false)); +window.addEventListener("popstate", (event) => { + const id = event.state?.doc || new URLSearchParams(location.search).get("doc"); + if (id) openDocument(id, false); + else renderHome(false); +}); const manifest = await fetch(`${baseUrl}content/manifest.json`).then((response) => response.json()); state.documents = manifest.documents; renderChrome(); -await openDocument(new URLSearchParams(location.search).get("doc"), false); +const initialDocument = new URLSearchParams(location.search).get("doc"); +if (initialDocument) await openDocument(initialDocument, false); +else renderHome(false); diff --git a/github-pages/src/styles.css b/github-pages/src/styles.css index d19696f0..803b463f 100644 --- a/github-pages/src/styles.css +++ b/github-pages/src/styles.css @@ -56,21 +56,26 @@ a { color: inherit; } .brand-divider { width: 1px; height: 20px; background: var(--line); margin-left: 2px; } .brand-section { color: var(--muted); font-weight: 520; } .top-actions { display: flex; align-items: center; gap: 18px; } -.github-link, .official-docs-link { color: #37443d; text-decoration: none; font-size: 13px; font-weight: 650; } -.github-link:hover, .official-docs-link:hover { color: var(--green); } -.official-docs-link { padding: 8px 12px; border: 1px solid #d7e5df; border-radius: 9px; background: rgba(255, 255, 255, 0.72); } +.github-link, .quick-start-link { color: #37443d; text-decoration: none; font-size: 13px; font-weight: 650; } +.github-link:hover, .quick-start-link:hover { color: var(--green); } +.quick-start-link { padding: 8px 12px; border: 1px solid #d7e5df; border-radius: 9px; background: rgba(255, 255, 255, 0.72); } .language-switch { display: flex; padding: 3px; border: 1px solid var(--line); border-radius: 9px; background: #f5f7f4; } .language-switch button { padding: 5px 9px; border: 0; border-radius: 6px; color: var(--muted); background: transparent; cursor: pointer; font-size: 12px; font-weight: 700; } .language-switch button.active { color: var(--ink); background: white; box-shadow: 0 1px 3px rgba(20, 40, 30, 0.1); } .menu-button { display: none; border: 1px solid var(--line); border-radius: 8px; background: white; padding: 7px 10px; cursor: pointer; } .docs-shell { display: grid; grid-template-columns: 276px minmax(0, 1fr) 224px; max-width: 1540px; min-height: 100vh; margin: 0 auto; padding-top: 66px; } +.docs-shell.home-view { grid-template-columns: 276px minmax(0, 1fr); } +.docs-shell.home-view .toc-panel { display: none; } .sidebar { position: sticky; top: 66px; height: calc(100vh - 66px); padding: 25px 20px 18px; overflow-y: auto; border-right: 1px solid var(--line); background: rgba(247, 250, 248, 0.78); } .search-box { display: flex; align-items: center; gap: 8px; height: 41px; padding: 0 11px; border: 1px solid #d8e3dd; border-radius: 11px; color: #7a857e; background: rgba(255, 255, 255, 0.84); box-shadow: 0 5px 18px rgba(29, 65, 48, 0.035); } .search-box:focus-within { border-color: #78aa8e; box-shadow: 0 0 0 3px rgba(22, 120, 76, 0.1); } .search-box input { width: 100%; border: 0; outline: 0; color: var(--ink); background: transparent; font-size: 13px; } .search-box kbd { padding: 2px 5px; border: 1px solid var(--line); border-radius: 4px; background: #f7f8f6; font-size: 10px; } .document-nav { padding: 12px 0 52px; } +.home-link { position: relative; display: block; margin-top: 9px; padding: 9px 10px 9px 13px; border-radius: 8px; color: #536058; text-decoration: none; font-size: 13px; } +.home-link:hover { color: var(--ink); background: #f0f3ef; } +.home-link.active { color: #086b5a; background: linear-gradient(90deg, #dff3ec, #eaf6f2); font-weight: 700; } .nav-group { margin-top: 21px; } .nav-group h2 { margin: 0 10px 7px; color: #8a948e; font-size: 10px; font-weight: 800; letter-spacing: 0.11em; text-transform: uppercase; } .nav-group a { position: relative; display: block; padding: 7px 10px 7px 13px; border-radius: 8px; color: #536058; text-decoration: none; font-size: 13px; line-height: 1.4; } @@ -83,6 +88,35 @@ a { color: inherit; } .article-wrap { min-width: 0; padding: 58px clamp(32px, 5.8vw, 86px) 100px; background: rgba(255, 255, 255, 0.94); } .article { width: 100%; max-width: 820px; margin: 0 auto; } +.article[data-group="home"] { max-width: 980px; } +.home-hero { padding: 34px 0 76px; } +.home-eyebrow, .section-kicker { margin: 0 0 17px; color: #12806d; font: 750 11px/1.4 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: 0.13em; } +.home-hero h1 { max-width: 800px; margin: 0; color: #102019; font-size: clamp(46px, 6.3vw, 76px); line-height: 0.99; letter-spacing: -0.055em; } +.home-lead { max-width: 720px; margin: 27px 0 0; color: #526159; font-size: 18px; line-height: 1.72; } +.home-actions { display: flex; flex-wrap: wrap; gap: 11px; margin-top: 31px; } +.home-actions a { padding: 11px 17px; border-radius: 10px; text-decoration: none; font-size: 14px; font-weight: 720; } +.primary-action { color: white; background: #087f6a; box-shadow: 0 8px 22px rgba(8, 127, 106, 0.2); } +.secondary-action { border: 1px solid #d5e2dc; color: #34443c; background: white; } +.home-explore { padding-top: 58px; border-top: 1px solid var(--line); } +.home-explore h2, .benchmark-callout h2 { margin: 0; color: #15251d; font-size: 30px; letter-spacing: -0.025em; } +.section-lead { max-width: 620px; margin: 10px 0 25px; color: var(--muted); line-height: 1.65; } +.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; } +.feature-card { position: relative; display: flex; min-height: 260px; flex-direction: column; padding: 23px; overflow: hidden; border: 1px solid #dce8e2; border-radius: 16px; color: var(--ink); background: linear-gradient(155deg, #fff, #f4faf7); text-decoration: none; transition: transform 160ms ease, box-shadow 160ms ease; } +.feature-card:hover { transform: translateY(-3px); box-shadow: 0 16px 34px rgba(29, 68, 49, 0.1); } +.feature-card.blue { background: linear-gradient(155deg, #fff, #f1f5ff); } +.feature-card.amber { background: linear-gradient(155deg, #fff, #fbf7ec); } +.feature-icon { display: grid; place-items: center; width: 42px; height: 42px; margin-bottom: 32px; border-radius: 12px; color: #08705e; background: #dbf2ea; font-size: 22px; } +.blue .feature-icon { color: #3156b8; background: #e5ebff; } +.amber .feature-icon { color: #9b6818; background: #f8eac8; } +.feature-label { margin-bottom: 7px; color: #718078; font: 700 10px/1.3 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: 0.08em; text-transform: uppercase; } +.feature-card strong { font-size: 20px; } +.feature-description { margin-top: 10px; color: #66736c; font-size: 13px; line-height: 1.6; } +.feature-arrow { position: absolute; right: 22px; bottom: 18px; color: #6a7870; font-size: 19px; } +.benchmark-callout { display: flex; align-items: end; justify-content: space-between; gap: 35px; margin-top: 62px; padding: 36px; border-radius: 17px; color: white; background: linear-gradient(125deg, #142a22, #1c473b); } +.benchmark-callout .section-kicker { color: #74d4bb; } +.benchmark-callout h2 { color: white; } +.benchmark-callout p:not(.section-kicker) { max-width: 610px; margin: 10px 0 0; color: #c3d4cd; line-height: 1.65; } +.benchmark-callout > a { flex: none; padding: 10px 14px; border: 1px solid rgba(255,255,255,.25); border-radius: 9px; color: white; text-decoration: none; font-size: 13px; font-weight: 700; } .article-meta { display: flex; gap: 8px; margin-bottom: 22px; color: #7d8d84; font: 600 11px/1.4 ui-monospace, SFMono-Regular, Menlo, monospace; } .article-meta span:first-child { padding: 3px 8px; border-radius: 999px; color: #08705e; background: #e6f5ef; } .markdown-body { color: #27332d; font-size: 16px; line-height: 1.78; } @@ -143,7 +177,7 @@ a { color: inherit; } @media (max-width: 760px) { .topbar { height: 60px; padding: 0 16px; } .brand-section, .brand-divider, .github-link { display: none; } - .official-docs-link { font-size: 12px; } + .quick-start-link { font-size: 12px; } .menu-button { display: block; max-width: 112px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .top-actions { gap: 9px; } .docs-shell { display: block; padding-top: 60px; } @@ -157,4 +191,10 @@ a { color: inherit; } .markdown-body h1 { font-size: 34px; } .markdown-body h2 { margin-top: 46px; font-size: 24px; } .article[data-group="overview"] .markdown-body > p:first-child img { max-width: 84%; } + .home-hero { padding: 20px 0 54px; } + .home-hero h1 { font-size: 43px; } + .home-lead { font-size: 16px; } + .feature-grid { grid-template-columns: 1fr; } + .feature-card { min-height: 225px; } + .benchmark-callout { align-items: flex-start; flex-direction: column; padding: 28px 24px; } }