diff --git a/.claude/design-tokens.md b/.claude/design-tokens.md index 1fd2534..e2bade1 100644 --- a/.claude/design-tokens.md +++ b/.claude/design-tokens.md @@ -9,6 +9,7 @@ | 日期 | 版本 | 变更 | |------|------|------| +| 2026-06-05 | 2.1 | 全站 49/50 页面添加「← 返回知识库」导航链接；修复 3 个错误 href 路径；4 个沈阳顺义报告 + 到家业态分类添加侧栏目录；新增 §17 页面布局与导航规范 | | 2026-06-05 | 2.0 | 主设计系统从 Ant Design v5 迁移至 Fluent 2；品牌色 `#1677FF`→`#0078D4`；新增材质/动效/完整色彩阶梯/字体体系；`index.html` 同步重设计 | | ~2026-05 | 1.0 | 初始版本，基于 Ant Design v5 + 阿里云控制台风格 | @@ -557,6 +558,93 @@ Fluent 2 使用自有断点体系（取代 Ant Design 断点）： --- +## 17. 页面布局与导航规范 + +### 17.1 强制要求 + +**所有页面**（不含 `index.html` 首页本身）必须满足： + +| 要求 | 说明 | +|------|------| +| 返回链接 | 顶部固定导航栏内包含 `← 返回知识库` 链接，指向 `index.html` | +| 顶部导航栏 | 粘性顶栏（`position: sticky; top: 0; z-index: 100`），高度 64px | +| 统一路径规则 | 根级文件 `./index.html`，一级子目录 `../index.html`，二级子目录 `../../index.html` | + +### 17.2 报告页布局标准 + +**所有 `{主题}/报告/*.html` 报告页** 必须使用以下布局： + +``` +┌──────────────────────────────────────────┐ +│ Header Bar (sticky, 64px) │ +│ ← 返回知识库 报告标题 │ +├────────┬─────────────────────────────────┤ +│ Sidebar│ Main Content │ +│ 260px │ (flex: 1, max-width: 1200px) │ +│ │ │ +│ 目录 │ ## 章节 │ +│ · 1. │ ... │ +│ · 2. │ ## 章节 │ +│ · 3. │ ... │ +│ (sticky│ │ +│ TOC) │ │ +├────────┴─────────────────────────────────┤ +``` + +**核心 CSS 结构：** + +```css +.layout { display: flex; max-width: 1200px; margin: 0 auto; } +.sidebar { width: 260px; flex-shrink: 0; position: sticky; top: 64px; + height: calc(100vh - 64px); overflow-y: auto; + background: var(--bg-container); border-right: 1px solid var(--border); } +.sidebar a { /* 目录链接，需包含 .active 激活态样式 */ } +.main-content { flex: 1; padding: 32px 40px 64px; min-width: 0; } +``` + +**侧栏目录（TOC）规则：** +- 自动提取页面内所有 `

` 标题作为目录项 +- 每个 `

` 必须有 `id` 属性（作为锚点） +- 目录链接 `href` 指向对应 `#id` +- 激活项添加 `.active` 类（配合 IntersectionObserver 或手动标记） +- 移动端（≤768px）隐藏侧栏，全宽内容 + +### 17.3 非报告页（特殊布局） + +以下页面类型可使用简化布局，但必须保留顶部返回栏： + +| 页面类型 | 示例 | 最低要求 | +|----------|------|---------| +| 独立子站首页 | `mcp-services-guide/index.html` | 顶栏 + 返回链接 | +| 交互式演示 | `交互式演示/tetrahedron-interactive.html` | 页面顶部返回链接 | +| 演示文稿 | `YqBoot系统说明书/系统说明书-演示文稿.html` | 固定定位返回链接 | +| 个人简历 | `张德海_简历.html` | 页面顶部返回链接 | +| 系列索引页 | `深国际综合改革方案/index.html` | 顶栏 + 返回链接 | + +### 17.4 页面分类与布局要求 + +| 类别 | 特征 | 布局要求 | 文件数 | +|------|------|---------|--------| +| **标准报告页** | 使用 `var(--color-primary)` 等 Token | 顶栏 + 侧栏目录 + 主内容 | ~33 | +| **无侧栏报告页** | 有 Token 但缺侧栏 | 补齐侧栏目录 | ~10（逐步修复） | +| **自定义样式页** | 独立色板/布局 | 至少顶栏 + 返回链接 | ~4 | +| **特殊布局页** | Canvas/Reveal.js/简历 | 至少返回链接 | ~3 | + +### 17.5 页面创建检查清单 + +新建报告页时必须逐项检查： + +- [ ] 顶部固定导航栏（64px, sticky top:0） +- [ ] `← 返回知识库` 链接，href 按目录深度计算 +- [ ] 左侧 260px 侧栏，含按 `

` 标题生成的目录 +- [ ] 所有 `

` 有 `id` 锚点 +- [ ] 使用 CSS 变量（`var(--color-primary)` 等）而非硬编码颜色 +- [ ] 移动端（≤768px）隐藏侧栏，全宽布局 +- [ ] `font-family` 引用 `var(--fluent-font-family-text)` +- [ ] 内容区 `max-width: 1200px` 居中 + +--- + ## 参考资料 - [Fluent 2 Design System](https://fluent2.microsoft.design) diff --git a/Graphify 深度分析报告/代码/graphify-analysis.html b/Graphify 深度分析报告/代码/graphify-analysis.html index b54dec4..7f6bc4c 100644 --- a/Graphify 深度分析报告/代码/graphify-analysis.html +++ b/Graphify 深度分析报告/代码/graphify-analysis.html @@ -450,7 +450,7 @@ a { color: var(--color-primary); }
- ← 返回知识库 + ← 返回知识库

Graphify-rs 深度分析报告

22K+ Stars diff --git a/国内商业业态分类到家/报告/到家业态分类全景.html b/国内商业业态分类到家/报告/到家业态分类全景.html index aa3d996..10c79eb 100644 --- a/国内商业业态分类到家/报告/到家业态分类全景.html +++ b/国内商业业态分类到家/报告/到家业态分类全景.html @@ -160,6 +160,37 @@ td:first-child { font-weight: 600; white-space: nowrap; } thead th, tbody td { padding: 8px 10px; } .toc-grid { grid-template-columns: 1fr; } } + +/* ===== Sidebar Layout ===== */ +.layout { display: flex; max-width: 1200px; margin: 0 auto; min-height: calc(100vh - 64px); } +.sidebar { + width: 260px; flex-shrink: 0; background: var(--bg-container); + border-right: 1px solid var(--border); padding: 20px 0; + position: sticky; top: 64px; height: calc(100vh - 64px); overflow-y: auto; +} +.sidebar-title { + font-size: 11px; font-weight: 600; color: var(--text-tertiary); + text-transform: uppercase; letter-spacing: 0.8px; padding: 0 16px 12px; + border-bottom: 1px solid var(--border-light); margin: 0 8px 8px; +} +.sidebar a { + display: block; padding: 6px 16px; font-size: 13px; color: var(--text-secondary); + text-decoration: none; border-radius: 0 4px 4px 0; margin: 2px 8px 2px 0; + transition: background 0.12s ease, color 0.12s ease; +} +.sidebar a:hover { background: var(--bg-elevated); color: var(--text-primary); } +.sidebar a.active { background: var(--color-primary-bg); color: var(--color-primary); font-weight: 500; } +.main-content { flex: 1; padding: 32px 40px 64px; min-width: 0; } +.top-bar { height: 64px; background: var(--bg-container); border-bottom: 1px solid var(--border); display: flex; align-items: center; padding: 0 32px; position: sticky; top: 0; z-index: 100; box-shadow: var(--shadow-sm); } +.top-bar .back-link { margin-right: 16px; color: var(--color-primary); text-decoration: none; font-size: 14px; white-space: nowrap; } +.top-bar .back-link:hover { color: var(--color-primary-hover); } +.top-bar h1 { font-size: 18px; font-weight: 600; color: var(--text-primary); } +@media (max-width: 768px) { + .layout { flex-direction: column; } + .sidebar { display: none; } + .main-content { padding: 24px 16px; } +} + @@ -170,7 +201,7 @@ td:first-child { font-weight: 600; white-space: nowrap; } 配送上门 / 到家服务
-
+

目录

@@ -182,7 +213,7 @@ td:first-child { font-weight: 600; white-space: nowrap; }
-

核心差异总结

+

核心差异总结

到家业态 vs 常规到店业务的关键区别
@@ -202,7 +233,7 @@ td:first-child { font-weight: 600; white-space: nowrap; }
-

按履约时效分类

+

按履约时效分类

不同时效层级对应的业态与基础设施要求
@@ -219,7 +250,7 @@ td:first-child { font-weight: 600; white-space: nowrap; }
-

按商业模式分类

+

按商业模式分类

到家业态的主流商业运营模式
@@ -237,7 +268,7 @@ td:first-child { font-weight: 600; white-space: nowrap; }
-

按楼层收费参考

+

按楼层收费参考

社区便民配送类业态无电梯楼层加收标准（行业调研汇总）
@@ -404,7 +435,7 @@ function render() { section.className = 'section'; section.id = 'section-' + i; - let html = '

' + (i + 1) + '' + s.title + '

'; + let html = '

' + (i + 1) + '' + s.title + '

'; html += '
' + s.desc + '
'; html += '
'; for (const item of s.items) { diff --git a/沈阳顺义-数据-项目建设方案/报告/开源项目匹配度分析.html b/沈阳顺义-数据-项目建设方案/报告/开源项目匹配度分析.html index 0c0aca0..1b5d02f 100644 --- a/沈阳顺义-数据-项目建设方案/报告/开源项目匹配度分析.html +++ b/沈阳顺义-数据-项目建设方案/报告/开源项目匹配度分析.html @@ -83,20 +83,64 @@ code { font-family: 'SF Mono', 'Menlo', 'Monaco', 'Courier New', monospace; font .grid-2 { grid-template-columns: 1fr; } h2 { font-size: 20px; } } + +/* ===== Sidebar Layout ===== */ +.layout { display: flex; max-width: 1200px; margin: 0 auto; min-height: calc(100vh - 64px); } +.sidebar { + width: 260px; flex-shrink: 0; background: var(--bg-container); + border-right: 1px solid var(--border); padding: 20px 0; + position: sticky; top: 64px; height: calc(100vh - 64px); overflow-y: auto; +} +.sidebar-title { + font-size: 11px; font-weight: 600; color: var(--text-tertiary); + text-transform: uppercase; letter-spacing: 0.8px; padding: 0 16px 12px; + border-bottom: 1px solid var(--border-light); margin: 0 8px 8px; +} +.sidebar a { + display: block; padding: 6px 16px; font-size: 13px; color: var(--text-secondary); + text-decoration: none; border-radius: 0 4px 4px 0; margin: 2px 8px 2px 0; + transition: background 0.12s ease, color 0.12s ease; +} +.sidebar a:hover { background: var(--bg-elevated); color: var(--text-primary); } +.sidebar a.active { background: var(--color-primary-bg); color: var(--color-primary); font-weight: 500; } +.main-content { flex: 1; padding: 32px 40px 64px; min-width: 0; } +.top-bar { height: 64px; background: var(--bg-container); border-bottom: 1px solid var(--border); display: flex; align-items: center; padding: 0 32px; position: sticky; top: 0; z-index: 100; box-shadow: var(--shadow-sm); } +.top-bar .back-link { margin-right: 16px; color: var(--color-primary); text-decoration: none; font-size: 14px; white-space: nowrap; } +.top-bar .back-link:hover { color: var(--color-primary-hover); } +.top-bar h1 { font-size: 18px; font-weight: 600; color: var(--text-primary); } +@media (max-width: 768px) { + .layout { flex-direction: column; } + .sidebar { display: none; } + .main-content { padding: 24px 16px; } +} +
- ← 返回知识库 + ← 返回知识库

开源项目匹配度分析报告

+
+ +
-
+
-

1. 调研范围与方法

+

1. 调研范围与方法

深度分析 工程指南 @@ -125,7 +169,7 @@ code { font-family: 'SF Mono', 'Menlo', 'Monaco', 'Courier New', monospace; font

-

2. 物联网/设备管理平台匹配

+

2. 物联网/设备管理平台匹配

@@ -276,7 +320,7 @@ code { font-family: 'SF Mono', 'Menlo', 'Monaco', 'Courier New', monospace; font
-

3. 数据治理/数据服务平台匹配

+

3. 数据治理/数据服务平台匹配

@@ -385,7 +429,7 @@ code { font-family: 'SF Mono', 'Menlo', 'Monaco', 'Courier New', monospace; font
-

4. PHM/故障预测算法框架匹配

+

4. PHM/故障预测算法框架匹配

PHM（Prognostics and Health Management，故障预测与健康管理）是沈阳项目的核心业务场景。以下项目专注于算法/模型层面。 @@ -463,7 +507,7 @@ code { font-family: 'SF Mono', 'Menlo', 'Monaco', 'Courier New', monospace; font
-

5. 综合匹配矩阵

+

5. 综合匹配矩阵

以沈阳项目的 15 项核心能力为行，10 个开源项目为列，标注匹配情况：

业态核心业务代表平台与常规区别合规/资质相关开源项目
@@ -492,7 +536,7 @@ code { font-family: 'SF Mono', 'Menlo', 'Monaco', 'Courier New', monospace; font
-

6. 推荐组合方案

+

6. 推荐组合方案

单一开源项目无法覆盖沈阳项目全部需求。建议采用 「IoT 平台 + 数据中台 + 自研核心」的组合策略：

@@ -547,7 +591,7 @@ code { font-family: 'SF Mono', 'Menlo', 'Monaco', 'Courier New', monospace; font
-

7. 大厂高星项目驻点关注清单

+

7. 大厂高星项目驻点关注清单

建议持续跟踪以下项目动态，这些项目有活跃的大厂背景或高社区活跃度：

@@ -568,7 +612,7 @@ code { font-family: 'SF Mono', 'Menlo', 'Monaco', 'Courier New', monospace; font
-

8. 结论

+

8. 结论

核心结论：沈阳项目是一个「IoT 平台 + 数据中台 + PHM 算法管理」的三合一复合型平台，目前全球范围内没有单开源项目能完整覆盖。
@@ -590,5 +634,7 @@ code { font-family: 'SF Mono', 'Menlo', 'Monaco', 'Courier New', monospace; font
+ + diff --git a/沈阳顺义-数据-项目建设方案/报告/沈阳顺义数据项目建设方案解读.html b/沈阳顺义-数据-项目建设方案/报告/沈阳顺义数据项目建设方案解读.html index 29142be..d2030e6 100644 --- a/沈阳顺义-数据-项目建设方案/报告/沈阳顺义数据项目建设方案解读.html +++ b/沈阳顺义-数据-项目建设方案/报告/沈阳顺义数据项目建设方案解读.html @@ -79,20 +79,63 @@ code { font-family: 'SF Mono', 'Menlo', 'Monaco', 'Courier New', monospace; font .grid-2 { grid-template-columns: 1fr; } h2 { font-size: 20px; } } + +/* ===== Sidebar Layout ===== */ +.layout { display: flex; max-width: 1200px; margin: 0 auto; min-height: calc(100vh - 64px); } +.sidebar { + width: 260px; flex-shrink: 0; background: var(--bg-container); + border-right: 1px solid var(--border); padding: 20px 0; + position: sticky; top: 64px; height: calc(100vh - 64px); overflow-y: auto; +} +.sidebar-title { + font-size: 11px; font-weight: 600; color: var(--text-tertiary); + text-transform: uppercase; letter-spacing: 0.8px; padding: 0 16px 12px; + border-bottom: 1px solid var(--border-light); margin: 0 8px 8px; +} +.sidebar a { + display: block; padding: 6px 16px; font-size: 13px; color: var(--text-secondary); + text-decoration: none; border-radius: 0 4px 4px 0; margin: 2px 8px 2px 0; + transition: background 0.12s ease, color 0.12s ease; +} +.sidebar a:hover { background: var(--bg-elevated); color: var(--text-primary); } +.sidebar a.active { background: var(--color-primary-bg); color: var(--color-primary); font-weight: 500; } +.main-content { flex: 1; padding: 32px 40px 64px; min-width: 0; } +.top-bar { height: 64px; background: var(--bg-container); border-bottom: 1px solid var(--border); display: flex; align-items: center; padding: 0 32px; position: sticky; top: 0; z-index: 100; box-shadow: var(--shadow-sm); } +.top-bar .back-link { margin-right: 16px; color: var(--color-primary); text-decoration: none; font-size: 14px; white-space: nowrap; } +.top-bar .back-link:hover { color: var(--color-primary-hover); } +.top-bar h1 { font-size: 18px; font-weight: 600; color: var(--text-primary); } +@media (max-width: 768px) { + .layout { flex-direction: column; } + .sidebar { display: none; } + .main-content { padding: 24px 16px; } +} +
- ← 返回知识库 + ← 返回知识库

沈阳顺义数据项目建设方案解读报告

+
+ +
-
+
-

1. 项目概述

+

1. 项目概述

深度分析 工程指南 @@ -110,7 +153,7 @@ code { font-family: 'SF Mono', 'Menlo', 'Monaco', 'Courier New', monospace; font

-

2. 实际建设内容拆解

+

2. 实际建设内容拆解

方案包含 两大交付物：

@@ -177,7 +220,7 @@ code { font-family: 'SF Mono', 'Menlo', 'Monaco', 'Courier New', monospace; font
-

3. 新增需求详细分析

+

3. 新增需求详细分析

3.1 任务组成（新增需求文件明确）

@@ -235,7 +278,7 @@ code { font-family: 'SF Mono', 'Menlo', 'Monaco', 'Courier New', monospace; font
-

4. 审查意见与修改分析

+

4. 审查意见与修改分析

V1 建设方案文档中包含 20+ 条审查意见（标注为 [ 1:...][已修改] 格式），以下是关键意见分类分析：

4.1 结构性修改意见

@@ -276,7 +319,7 @@ code { font-family: 'SF Mono', 'Menlo', 'Monaco', 'Courier New', monospace; font
-

5. 交叉点与新增点识别

+

5. 交叉点与新增点识别

5.1 交叉点（V1方案与新增需求的重叠与差异）

项目出品方Stars关注理由匹配维度
@@ -366,7 +409,7 @@ code { font-family: 'SF Mono', 'Menlo', 'Monaco', 'Courier New', monospace; font
-

6. 技术栈与关键指标总览

+

6. 技术栈与关键指标总览

6.1 完整技术栈

@@ -420,7 +463,7 @@ code { font-family: 'SF Mono', 'Menlo', 'Monaco', 'Courier New', monospace; font
-

7. 总结与后续建议

+

7. 总结与后续建议

7.1 方案整体评价

V1 建设方案在数据接入、存储、服务、微服务架构、国产化适配等方面已有较完整的设计，审查意见大部分已修改到位。核心问题在于：

@@ -448,5 +491,7 @@ code { font-family: 'SF Mono', 'Menlo', 'Monaco', 'Courier New', monospace; font
+ +