From f8188d1712bbb4edc33b494e321f1165379d7a7c Mon Sep 17 00:00:00 2001 From: ShawnSiao Date: Tue, 28 Jul 2026 14:19:36 +0800 Subject: [PATCH] docs: add beginner git tutorial example --- tutorial-demo/README.md | 30 +++++++++++++++ tutorial-demo/index.html | 34 +++++++++++++++++ tutorial-demo/styles.css | 80 ++++++++++++++++++++++++++++++++++++++++ 3 files changed, 144 insertions(+) create mode 100644 tutorial-demo/README.md create mode 100644 tutorial-demo/index.html create mode 100644 tutorial-demo/styles.css diff --git a/tutorial-demo/README.md b/tutorial-demo/README.md new file mode 100644 index 0000000..a5944e5 --- /dev/null +++ b/tutorial-demo/README.md @@ -0,0 +1,30 @@ +# Git 教程演示项目 + +这个目录配合三集中文视频教程使用： + +1. 使用 Commit 保存和恢复代码版本。 +2. 使用不同 Branch 隔离不同功能。 +3. 使用 Pull Request 把稳定代码合并到 `main`。 + +## 运行 + +直接用浏览器打开 `index.html`。 + +也可以在目录中启动一个本地服务器： + +```powershell +python -m http.server 8000 +``` + +然后访问 `http://localhost:8000`。 + +## 安全工作流 + +```text +修改前看状态 +修改后看 Diff +验证通过再 Commit +功能分支先走 PR +稳定代码才进 main +``` + diff --git a/tutorial-demo/index.html b/tutorial-demo/index.html new file mode 100644 index 0000000..1c4b8e8 --- /dev/null +++ b/tutorial-demo/index.html @@ -0,0 +1,34 @@ + + + + + + AI 项目控制台 + + + +
+

LEARN GIT

+

AI 项目控制台

+

先保存可用版本，再让 AI 继续修改。

+ +
+ +
+ 当前状态：稳定 +

基础页面已经通过人工检查。

+
+
+ +
+

三个固定动作

+
    +
  1. 修改前查看状态
    2. +
  2. 修改后检查 Diff
    3. +
  3. 验证通过再 Commit
    4. +
+
+
+ + + diff --git a/tutorial-demo/styles.css b/tutorial-demo/styles.css new file mode 100644 index 0000000..c1e9957 --- /dev/null +++ b/tutorial-demo/styles.css @@ -0,0 +1,80 @@ +:root { + color-scheme: light; + font-family: + Inter, "Microsoft YaHei", system-ui, -apple-system, BlinkMacSystemFont, + "Segoe UI", sans-serif; + background: #f6f2e9; + color: #171717; +} + +* { + box-sizing: border-box; +} + +body { + min-height: 100vh; + margin: 0; + display: grid; + place-items: center; + padding: 24px; +} + +.dashboard { + width: min(680px, 100%); + padding: 48px; + border: 2px solid #171717; + border-radius: 28px; + background: #fffdf8; + box-shadow: 12px 12px 0 #ff5a5f; +} + +.eyebrow { + margin: 0 0 12px; + color: #d83a40; + font-weight: 800; + letter-spacing: 0.16em; +} + +h1 { + margin: 0; + font-size: clamp(36px, 8vw, 72px); + line-height: 1; +} + +.summary { + margin: 20px 0 32px; + font-size: 20px; + line-height: 1.7; +} + +.status-card { + display: flex; + gap: 14px; + align-items: flex-start; + padding: 20px; + border-radius: 18px; + background: #e7f6ee; +} + +.status-card p { + margin: 6px 0 0; +} + +.status-dot { + width: 14px; + height: 14px; + margin-top: 5px; + border-radius: 50%; + background: #198754; + box-shadow: 0 0 0 6px rgb(25 135 84 / 14%); +} + +.rules { + margin-top: 32px; +} + +.rules li { + margin: 10px 0; + padding-left: 6px; +} +