From 0e0556f9022a388fb9b7d18673a6670833e3e894 Mon Sep 17 00:00:00 2001
From: sanbuphy <physicoada@gmail.com>
Date: Thu, 15 Jan 2026 13:05:33 +0800
Subject: [PATCH] docs: update terminal intro with macos guide and demo

---
 .../terminal-intro/TerminalOSDemo.vue         | 35 ++++++++++++++++++-
 docs/zh-cn/appendix/terminal-intro.md         | 34 +++++++++++++++++-
 2 files changed, 67 insertions(+), 2 deletions(-)

diff --git a/docs/.vitepress/theme/components/appendix/terminal-intro/TerminalOSDemo.vue b/docs/.vitepress/theme/components/appendix/terminal-intro/TerminalOSDemo.vue
index 715f850..768e5c3 100644
--- a/docs/.vitepress/theme/components/appendix/terminal-intro/TerminalOSDemo.vue
+++ b/docs/.vitepress/theme/components/appendix/terminal-intro/TerminalOSDemo.vue
@@ -80,6 +80,7 @@ const currentStepIndex = ref(-1)
 const osList = [
   { id: 'win-cmd', name: 'Windows CMD', icon: '🪟' },
   { id: 'win-ps', name: 'Windows PowerShell', icon: '⚡' },
+  { id: 'mac', name: 'macOS Terminal', icon: '🍎' },
   { id: 'linux', name: 'Linux Terminal', icon: '🐧' }
 ]
 
@@ -116,6 +117,20 @@ const configs = {
       { type: 'output', content: 'Hello World', delay: 100, explanation: '计算机乖乖地输出了 "Hello World"。' }
     ]
   },
+  'mac': {
+    title: 'user — -zsh — 80x24',
+    prompt: 'user@MacBook-Pro ~ % ',
+    demo: [
+      { type: 'explanation', content: '准备输入命令...' },
+      { type: 'command', content: 'ls -G', delay: 400, explanation: '输入 `ls` (List)。这是 Mac/Linux 系统用来**列出文件**的命令。`-G` 参数让输出带颜色。' },
+      { type: 'output', content: 'Desktop   Downloads   Movies    Music', delay: 100 },
+      { type: 'output', content: 'Documents Library     Pictures  Public', delay: 100, explanation: '系统列出了你的主目录下的文件夹。' },
+      { type: 'command', content: 'sw_vers', delay: 400, explanation: '输入 `sw_vers` (Software Version)。这是 macOS 特有的命令，查看**系统版本**。' },
+      { type: 'output', content: 'ProductName:		macOS', delay: 50 },
+      { type: 'output', content: 'ProductVersion:		15.1', delay: 50 },
+      { type: 'output', content: 'BuildVersion:		24B83', delay: 50, explanation: '系统返回了当前的 macOS 版本信息。' }
+    ]
+  },
   'linux': {
     title: 'user@hostname: ~',
     prompt: 'user@hostname:~$ ',
@@ -335,6 +350,23 @@ const nextStep = async () => {
 .terminal-window.linux .window-buttons .maximize { background: #27c93f; }
 
 /* Common Layout */
+.terminal-window.mac {
+  background: #1e1e1e;
+  color: #f0f0f0;
+  font-family: 'Menlo', monospace;
+}
+.terminal-window.mac .window-bar {
+  background: #3a3a3a;
+  border-bottom: 1px solid #222;
+  color: #ccc;
+}
+.terminal-window.mac .window-buttons .btn {
+  border-radius: 50%;
+}
+.terminal-window.mac .window-buttons .close { background: #ff5f56; }
+.terminal-window.mac .window-buttons .minimize { background: #ffbd2e; }
+.terminal-window.mac .window-buttons .maximize { background: #27c93f; }
+
 .window-bar {
   padding: 8px 12px;
   display: flex;
@@ -610,7 +642,8 @@ const nextStep = async () => {
   border-top-color: #ccc;
 }
 
-.terminal-window.linux .explanation-bar {
+.terminal-window.linux .explanation-bar,
+.terminal-window.mac .explanation-bar {
   background: #222;
   color: #ccc;
   border-top-color: #444;
diff --git a/docs/zh-cn/appendix/terminal-intro.md b/docs/zh-cn/appendix/terminal-intro.md
index 2c736e7..a2a2d71 100644
--- a/docs/zh-cn/appendix/terminal-intro.md
+++ b/docs/zh-cn/appendix/terminal-intro.md
@@ -2,9 +2,41 @@
 
 > 💡 **学习指南**：本章节旨在为零基础读者提供一个关于终端（Terminal）工作原理的系统性认知。无需具备计算机专业背景，我们将通过交互式演示，由浅入深地解析终端的运行机制。
 
+## 0. 快速上手：如何打开终端？
+
+在你开始学习之前，首先得找到它。终端是每个操作系统的“出厂标配”，你不需要安装任何软件就能使用它。
+
+::: info 🖥️ 不同系统的打开方式
+
+** macOS (苹果电脑)**
+1.  按下 `Command (⌘) + Space` 打开聚焦搜索（Spotlight）。
+2.  输入 `Terminal` 或 `终端`。
+3.  按回车键，你就会看到一个白底黑字（或黑底白字）的窗口。
+
+**🪟 Windows**
+*   **方法一 (CMD)**：按下 `Win + R`，输入 `cmd`，按回车。这是最古老的命令行。
+*   **方法二 (PowerShell)**：按下 `Win + R`，输入 `powershell`，按回车。这是更现代、功能更强大的终端。
+*   *建议：日常简单操作两者皆可，开发环境推荐使用 PowerShell 或安装 WSL (Windows Subsystem for Linux)。*
+
+**🐧 Linux**
+*   通常快捷键是 `Ctrl + Alt + T`。
+*   或者在应用菜单中搜索 `Terminal`。
+
+:::
+
+### 0.1 我们用终端做什么？
+
+你可能习惯了用鼠标双击打开文件夹、右键复制粘贴。但在开发者眼中，终端是更高效的瑞士军刀。我们主要用它做三件事：
+
+1.  **文件管理**：不需要打开层层叠叠的窗口，一句话就能找到藏得很深的文件，或者瞬间批量重命名一万张照片。
+2.  **环境搭建与程序运行**：安装 Python、Node.js，启动一个 Web 服务器，或者运行你刚写的代码。这些操作在图形界面下往往非常繁琐甚至无法完成。
+3.  **远程控制**：这是终端的**杀手锏**。你可以坐在星巴克，通过终端控制一台远在千里之外的数据中心服务器，就像它就在你面前一样。
+
+现在，你已经知道了它在哪以及它能做什么，接下来让我们看看它到底长什么样。
+
 ## 1. 概念界定：终端是什么？ (Definition)
 
-*不同操作系统下的终端长相不同，**命令方式也不同**。点击下方按钮切换查看，注意观察 Windows 和 Linux 是如何用不同的命令（如 `dir` vs `ls`）做同一件事的：*
+*不同操作系统下的终端长相不同，**命令方式也不同**。点击下方按钮切换查看，注意观察 macOS, Windows 和 Linux 是如何用不同的命令（如 `dir` vs `ls`）做同一件事的：*
 
 <TerminalOSDemo />