docs: 新增 color-tokens 規範文件
This commit is contained in:
@@ -0,0 +1,70 @@
|
||||
---
|
||||
description: 全站 CSS color token 一覽與使用規範。
|
||||
alwaysApply: true
|
||||
---
|
||||
|
||||
# 【顏色 Token 規範】全站 CSS 變數一覽
|
||||
|
||||
所有顏色**必須**透過以下 token 引用，**禁止**在 CSS / HTML inline style 硬寫 hex 值（`rgba()` 中的透明度變化除外）。
|
||||
|
||||
## Token 總表（定義於 `assets/css/style.css` `:root`）
|
||||
|
||||
### 品牌色
|
||||
| Token | 值 | 用途 |
|
||||
|---|---|---|
|
||||
| `--color-brand` | `#ffcc00` | 主要強調色：按鈕、邊框、標題裝飾線 |
|
||||
| `--color-brand-light` | `#fceea7` | 淡黃底色、hover 背景 |
|
||||
| `--color-brand-dark` | `#4e492b` | 深棕黃文字、引言色 |
|
||||
|
||||
### 背景色
|
||||
| Token | 值 | 用途 |
|
||||
|---|---|---|
|
||||
| `--color-bg` | `#0a0a0a` | 全站頁面底色 |
|
||||
| `--color-bg-raised` | `#1a1a1a` | 導覽列、頁尾、深色卡片 |
|
||||
| `--color-bg-alt` | `#fcfaf2` | 淺色替代底（不常用） |
|
||||
|
||||
### 表面色（淺色內容區）
|
||||
| Token | 值 | 用途 |
|
||||
|---|---|---|
|
||||
| `--color-surface` | `#fffdf7` | section 底色 |
|
||||
| `--color-surface-soft` | `#fff9e8` | 卡片、暖白底 |
|
||||
|
||||
### 文字色
|
||||
| Token | 值 | 用途 |
|
||||
|---|---|---|
|
||||
| `--color-text` | `#333333` | 一般內文 |
|
||||
| `--color-text-dark` | `#1a1a1a` | 強調、標題文字 |
|
||||
| `--color-text-muted` | `#4d4d4d` | 次要說明文字 |
|
||||
| `--color-text-inverse` | `#f4f4f4` | 深色背景上的淺色文字 |
|
||||
|
||||
## 廢除名稱（禁止再使用）
|
||||
|
||||
以下為舊命名，已全數替換，不得復用：
|
||||
|
||||
`--primary` `--accent` `--yellow` `--light-yellow` `--dark-yellow`
|
||||
`--black` `--card-bg` `--deep-black` `--bg-alt`
|
||||
`--surface` `--surface-soft`
|
||||
`--text-color` `--text-main` `--text` `--text-muted` `--gray`
|
||||
|
||||
## 例外：`rgba()` 透明度變化
|
||||
|
||||
token 無法直接放入 `rgba()` 的色版參數，此情況保留 hex 硬寫：
|
||||
|
||||
```css
|
||||
/* ✅ 允許 */
|
||||
border: 1px solid rgba(255, 204, 0, 0.28);
|
||||
|
||||
/* ✅ 允許 */
|
||||
background: var(--color-brand);
|
||||
|
||||
/* ❌ 禁止 */
|
||||
background-color: #ffcc00;
|
||||
```
|
||||
|
||||
## 頁面 / 套件 scope token
|
||||
|
||||
以下為特定頁面內部使用的 scope token，不屬於全站規範，**不可**在其他頁面引用：
|
||||
|
||||
- `--lyrics-*`（歌詞頁）
|
||||
- `--njtw-*`（NJTW5 節目頁）
|
||||
- `--access-*`（演唱會票務狀態）
|
||||
+40
-39
@@ -1,39 +1,40 @@
|
||||
---
|
||||
description: 改檔後的 commit 規範、push 禁令與本機修復流程。
|
||||
globs: "*"
|
||||
alwaysApply: true
|
||||
---
|
||||
|
||||
# 【Git 完整規範】commit 格式・push 禁令・修復流程
|
||||
|
||||
## Commit：改完必附
|
||||
|
||||
只要本次對話中**有任何改檔、寫 Code、生成程式碼、調整結構的任務完成**，在回覆結尾**必須、強制、主動**附上 commit 指令，絕對不准等使用者開口要！
|
||||
|
||||
> ⚠️ **死線警告**：若本次對話完全沒有改動任何檔案、純屬聊天或觀念問答，則「不必」附上。
|
||||
|
||||
**禁止**為了附 commit 而跑 `git status`／`git diff`／`git log`；只貼指令，由站主在本機執行。
|
||||
|
||||
### 輸出格式（一字不差）：
|
||||
|
||||
```bash
|
||||
git add .
|
||||
git commit -m "type: 重點"
|
||||
```
|
||||
|
||||
| 項目 | 約定 |
|
||||
|------|------|
|
||||
| type | `feat`｜`fix`｜`style`｜`refactor`｜`chore` 五選一 |
|
||||
| 重點 | **15 字以內**（標點計入） |
|
||||
| add | **一律 `git add .`**，禁止只 add 單檔 |
|
||||
|
||||
## Push：禁止擅自執行
|
||||
|
||||
- **禁止 `git push`**，除非站主原句說「幫我 push」等。只貼 push 錯誤 ≠ 同意 push。
|
||||
- 修 push 失敗：只動本機（壓圖、`.gitignore`、`amend`／filter-branch **先問**），末尾只給站主：
|
||||
|
||||
```bash
|
||||
git push origin main
|
||||
```
|
||||
|
||||
- GitHub 單檔 **> 100 MB** 拒 push。`*.png.bak` 已在根 `.gitignore` 保護，`git add .` 不會送進備份檔。
|
||||
---
|
||||
description: 改檔後的 commit 規範、push 禁令與本機修復流程。
|
||||
globs: "*"
|
||||
alwaysApply: true
|
||||
---
|
||||
|
||||
# 【Git 完整規範】commit 格式・push 禁令・修復流程
|
||||
|
||||
## Commit：改完必附
|
||||
|
||||
只要本次對話中**有任何改檔、寫 Code、生成程式碼、調整結構的任務完成**，在回覆結尾**必須、強制、主動**附上 commit 指令，絕對不准等使用者開口要！
|
||||
|
||||
> ⚠️ **死線警告**：若本次對話完全沒有改動任何檔案、純屬聊天或觀念問答，則「不必」附上。
|
||||
|
||||
**禁止**在 sandbox（AI 執行環境）內執行**任何** `git` 指令，包含 `git add`、`git status`、`git diff`、`git log`；一律只輸出指令，由站主在本機執行。在 sandbox 跑 git 會留下 `index.lock` 殘檔，導致站主本機 git 卡住。
|
||||
|
||||
### 輸出格式（一字不差）：
|
||||
|
||||
```bash
|
||||
git add .
|
||||
git commit -m "type: 重點"
|
||||
```
|
||||
|
||||
| 項目 | 約定 |
|
||||
|------|------|
|
||||
| type | `feat`｜`fix`｜`style`｜`refactor`｜`chore` 五選一 |
|
||||
| 重點 | **15 字以內**（標點計入） |
|
||||
| add | **一律 `git add .`**，禁止只 add 單檔 |
|
||||
| 串接 | **禁止 `&&`**（站主環境為 PowerShell，不支援） |
|
||||
|
||||
## Push：禁止擅自執行
|
||||
|
||||
- **禁止 `git push`**，除非站主原句說「幫我 push」等。只貼 push 錯誤 ≠ 同意 push。
|
||||
- 修 push 失敗：只動本機（壓圖、`.gitignore`、`amend`／filter-branch **先問**），末尾只給站主：
|
||||
|
||||
```bash
|
||||
git push origin main
|
||||
```
|
||||
|
||||
- GitHub 單檔 **> 100 MB** 拒 push。`*.png.bak` 已在根 `.gitignore` 保護，`git add .` 不會送進備份檔。
|
||||
+134
-134
@@ -1,134 +1,134 @@
|
||||
---
|
||||
description: 全站導覽與籌備中（portal-nav.js、site-guide、開放邊界、刪錨點）
|
||||
alwaysApply: true
|
||||
---
|
||||
|
||||
# 【全站導覽邏輯】portal-nav.js・籌備中控制・site-guide 例外
|
||||
|
||||
之後**每新增一個要上線、可點的 HTML 頁面**，請一併完成導覽更新；規則都集中在 **`assets/js/portal-nav.js`**。
|
||||
|
||||
---
|
||||
|
||||
## 0. 兩個世界（最高優先，實作前必讀）
|
||||
|
||||
| 誰在看 | 哪一頁／哪塊 | 行為 |
|
||||
|--------|----------------|------|
|
||||
| **站主自己** | 僅 **`extra/site-guide.html`** | 頂欄必須 **`data-portal-nav data-portal-nav-all-open`**。腳本**不**對該頁頂欄套用籌備中；**不**對 `<main class="site-guide-main">` 內任何 `<a href>` 改寫。表上連結**全部要點得進**（由站主在 HTML 維護）。 |
|
||||
| **訪客／大家** | **除上列以外**的每一頁 | 頂欄＋**頁內所有 `<a href>`**（分頁列、內文等）依 `COMING_SOON_PAGES`、`INDEX_NAV_OPEN_HASHES` 鎖定；未公開者**一律標示「籌備中」**、不可點進。**禁止**在其他頁加 `data-portal-nav-all-open`。 |
|
||||
|
||||
**硬規則（違反＝做錯）**
|
||||
|
||||
1. **未經站主逐句同意**：不得從 `COMING_SOON_PAGES` **刪**檔名、不得擴充 `INDEX_NAV_OPEN_HASHES`、不得在 `buildPortalNavInnerHTML` **新增**可點項、不得把籌備中改成真 `href`、不得刪站主已同意列入頂欄的項。
|
||||
2. **「檔案在 repo」≠「可開放導覽」**；不得自行推論。
|
||||
3. **`totoga2/readable.html`（圖文好讀版，檔名 `readable.html`）**、**`variety/variety.html`**：站主**沒有明講對外開放**時，檔名**必須**留在 `COMING_SOON_PAGES`（訪客頂欄不可點進）。要開放時**只**能等站主說了再從 Set 移除。
|
||||
4. **「刪除／拿掉／不要了」**：若未寫明是**單一檔案**、**頂欄某一列**、**整段子選單**還是**整個資料夾**，**一律先問站主**，禁止自行擴大刪除範圍。
|
||||
5. **不確定**是否開放、連哪、是否例外：**先問站主再改**，不要猜。
|
||||
6. 站主說刪 **`某頁#錨點`**：見下方 **§8 頁面錨點刪除**（先改 DOM，再修死鏈；禁止只動導覽）。
|
||||
|
||||
---
|
||||
|
||||
## 1. 必做：把頁面掛進導覽 HTML
|
||||
|
||||
在 **`buildPortalNavInnerHTML`**（`assets/js/portal-nav.js`）裡維護連結：
|
||||
|
||||
- 依資訊架構放在對應的 **`<li>`** 底下；需要子選單時用 **`portal-submenu`**。
|
||||
- `href` 使用**站根相對路徑**（腳本會依當前頁深度加上前綴 `rp`）：例如 `` `${rp}variety/variety.html` ``、`` `${rp}index.html#section` ``。
|
||||
- Logo 列：`` `${rp}index.html` `` 與 `` `${rp}assets/images/logov.svg` ``。
|
||||
|
||||
新增或調整完後，所有帶 **`data-portal-nav`** 的 `<nav class="portal-nav">` 都會在載入腳本時被注入同一份 HTML。
|
||||
|
||||
---
|
||||
|
||||
## 1.1 未公開＝籌備中（全站一致）
|
||||
|
||||
- **站主沒說對外開放**的頁／錨點：在訪客可見處**不得**留可點的真實 `href`（頂欄、totoga2 分頁列、首頁內文、頁尾 CTA 皆同）。
|
||||
- 腳本標記為 `data-coming-soon="true"` 時：提示與頁內按鈕須讓讀者看見 **「籌備中」**（`portal-nav.js` 的 `COMING_SOON_LABEL`），不是改寫成別的隨機句。
|
||||
- **唯一例外**：`extra/site-guide.html` 的 `main.site-guide-main` 內連結（站主索引自用）；該頁頂欄 `data-portal-nav-all-open` 僅影響頂欄，**不**豁免主文以外區塊。
|
||||
|
||||
## 2. 可點 vs「籌備中」：`COMING_SOON_PAGES`
|
||||
|
||||
腳本會對導覽裡的連結做 **`applyComingSoonToNav`**：
|
||||
|
||||
- 若連結的**檔名**（小寫）出現在 **`COMING_SOON_PAGES`** 這個 `Set` 裡，該連結會被改成 **`href="#"`**、加上 **`data-coming-soon="true"`**，點擊無法前往（顯示隨機籌備中文案）。
|
||||
- **不要出現在 Set 裡**＝視為已開放，維持真實 `href`。
|
||||
|
||||
因此：
|
||||
|
||||
| 需求 | 做法 |
|
||||
|------|------|
|
||||
| 新頁要**正式開放** | 寫進 `buildPortalNavInnerHTML`（`assets/js/portal-nav.js`），並**確認檔名不在** `COMING_SOON_PAGES`。若曾暫時關閉，記得從 Set **刪除**該檔名。 |
|
||||
| 新頁先**占位、不開放** | 可選擇：仍寫進導覽，但把檔名**加進** `COMING_SOON_PAGES`；或暫時不要放進導覽。 |
|
||||
|
||||
（目前 Set 內含哪些檔，以 `assets/js/portal-nav.js` 為準；站主明講開放後才從 Set 移除該檔名，例如 `readable.html`。）
|
||||
|
||||
---
|
||||
|
||||
## 3. 首頁錨點：`INDEX_NAV_OPEN_HASHES`
|
||||
|
||||
指向 **`index.html#...`** 的連結，除了檔名判斷外，還會看 **錨點**：
|
||||
|
||||
- 若 `href` 是 `index.html#某錨點`，且該錨點**不在** **`INDEX_NAV_OPEN_HASHES`**，會被當成籌備中（與整頁關閉不同，是「這個錨點未開」）。
|
||||
- 新增首頁區塊且要從導覽直達時：在 **`INDEX_NAV_OPEN_HASHES`** 加上對應字串，例如 `"#story"`（**僅在使用者要求開放該錨點時**；若約定維持關閉則勿加入）。
|
||||
|
||||
---
|
||||
|
||||
## 3.1 索引頁頂欄全開（僅 `site-guide.html`）
|
||||
|
||||
- **`extra/site-guide.html`** 的 `<nav>` 使用 **`data-portal-nav data-portal-nav-all-open`** 時：注入後**不套用**籌備中，頂欄連結維持真實 `href`。主文 `main.site-guide-main` 內連結不由腳本改寫。
|
||||
- **禁止**在 `site-guide.html` 以外的頁面使用 `data-portal-nav-all-open`。
|
||||
|
||||
---
|
||||
|
||||
## 4. 新頁面 HTML 檢查清單
|
||||
|
||||
- 在 `<body>` 內適當位置放：
|
||||
|
||||
```html
|
||||
<nav class="portal-nav" aria-label="水晶男孩推廣部導覽" data-portal-nav></nav>
|
||||
```
|
||||
|
||||
- 在 `</body>` 前載入（順序可與現有頁一致）：
|
||||
|
||||
```html
|
||||
<script src="assets/js/portal-nav.js"></script>
|
||||
```
|
||||
|
||||
內頁（例如 `extra/`、`fallen/`、`member/`、`yellow-note/`、`variety/` 下）請用相對站根深度，例如：
|
||||
|
||||
```html
|
||||
<script src="../assets/js/portal-nav.js"></script>
|
||||
```
|
||||
|
||||
- 若該頁有 **`assets/js/particles.js`**／共用樣式（`assets/css/style.css` 等），比照其他內頁一併引入即可。
|
||||
|
||||
---
|
||||
|
||||
## 5. 刻意不進導覽的頁面
|
||||
|
||||
若某頁只給自己用（例如站內索引、草稿），**不要**寫進 `buildPortalNavInnerHTML` 即可；不必改 `COMING_SOON_PAGES`。
|
||||
|
||||
---
|
||||
|
||||
## 6. 改完請自檢
|
||||
|
||||
1. 從導覽點進新頁是否正常。
|
||||
2. 若應為開放頁，確認不會變成「尚無開放」、不會被改成 `href="#"`。
|
||||
3. 若為首頁錨點，確認已加入 `INDEX_NAV_OPEN_HASHES`（若有需要）。
|
||||
|
||||
---
|
||||
|
||||
## 7. 頁面錨點刪除（`某頁.html#id`）
|
||||
|
||||
指該 HTML 裡 **`id="…"` 的那一區**／`<section>`，不是刪整檔、不是刪資料夾、不是刪頂欄整段「全員發瘋」，也不是擅自改 `COMING_SOON_PAGES`（除非原句一併交代）。
|
||||
|
||||
1. **先**在目標頁拿掉該 DOM。
|
||||
2. **再**修仍指向死錨的 `href`（最小必要）。
|
||||
3. **禁止**只改 `portal-nav.js`／`site-guide.html` 卻不刪頁內區塊。
|
||||
|
||||
錨點拿掉後，書籤網址列仍可能顯示 `#…`，不代表 DOM 還在。header 大標 ≠ 已刪的 `#id` 區塊。「刪除」範圍不清 → **先問**。
|
||||
|
||||
## 名詞
|
||||
|
||||
- **頂欄**：`portal-nav.js` 注入的 `<nav class="portal-nav" data-portal-nav>`。
|
||||
- **全站索引**：`extra/site-guide.html`（可列草稿；**不等於**頂欄要掛）。
|
||||
- **程式真值**：`assets/js/portal-nav.js`（`COMING_SOON_LABEL`＝「籌備中」）。
|
||||
---
|
||||
description: 全站導覽與籌備中（portal-nav.js、site-guide、開放邊界、刪錨點）
|
||||
alwaysApply: true
|
||||
---
|
||||
|
||||
# 【全站導覽邏輯】portal-nav.js・籌備中控制・site-guide 例外
|
||||
|
||||
之後**每新增一個要上線、可點的 HTML 頁面**，請一併完成導覽更新；規則都集中在 **`assets/js/portal-nav.js`**。
|
||||
|
||||
---
|
||||
|
||||
## 0. 兩個世界（最高優先，實作前必讀）
|
||||
|
||||
| 誰在看 | 哪一頁／哪塊 | 行為 |
|
||||
|--------|----------------|------|
|
||||
| **站主自己** | 僅 **`extra/site-guide.html`** | 頂欄必須 **`data-portal-nav data-portal-nav-all-open`**。腳本**不**對該頁頂欄套用籌備中；**不**對 `<main class="site-guide-main">` 內任何 `<a href>` 改寫。表上連結**全部要點得進**（由站主在 HTML 維護）。 |
|
||||
| **訪客／大家** | **除上列以外**的每一頁 | 頂欄＋**頁內所有 `<a href>`**（分頁列、內文等）依 `COMING_SOON_PAGES`、`INDEX_NAV_OPEN_HASHES` 鎖定；未公開者**一律標示「籌備中」**、不可點進。**禁止**在其他頁加 `data-portal-nav-all-open`。 |
|
||||
|
||||
**硬規則（違反＝做錯）**
|
||||
|
||||
1. **未經站主逐句同意**：不得從 `COMING_SOON_PAGES` **刪**檔名、不得擴充 `INDEX_NAV_OPEN_HASHES`、不得在 `buildPortalNavInnerHTML` **新增**可點項、不得把籌備中改成真 `href`、不得刪站主已同意列入頂欄的項。
|
||||
2. **「檔案在 repo」≠「可開放導覽」**；不得自行推論。
|
||||
3. **`totoga2/readable.html`（圖文好讀版，檔名 `readable.html`）**、**`variety/variety.html`**：站主**沒有明講對外開放**時，檔名**必須**留在 `COMING_SOON_PAGES`（訪客頂欄不可點進）。要開放時**只**能等站主說了再從 Set 移除。
|
||||
4. **「刪除／拿掉／不要了」**：若未寫明是**單一檔案**、**頂欄某一列**、**整段子選單**還是**整個資料夾**，**一律先問站主**，禁止自行擴大刪除範圍。
|
||||
5. **不確定**是否開放、連哪、是否例外：**先問站主再改**，不要猜。
|
||||
6. 站主說刪 **`某頁#錨點`**：見下方 **§8 頁面錨點刪除**（先改 DOM，再修死鏈；禁止只動導覽）。
|
||||
|
||||
---
|
||||
|
||||
## 1. 必做：把頁面掛進導覽 HTML
|
||||
|
||||
在 **`buildPortalNavInnerHTML`**（`assets/js/portal-nav.js`）裡維護連結：
|
||||
|
||||
- 依資訊架構放在對應的 **`<li>`** 底下；需要子選單時用 **`portal-submenu`**。
|
||||
- `href` 使用**站根相對路徑**（腳本會依當前頁深度加上前綴 `rp`）：例如 `` `${rp}variety/variety.html` ``、`` `${rp}index.html#section` ``。
|
||||
- Logo 列：`` `${rp}index.html` `` 與 `` `${rp}assets/images/logov.svg` ``。
|
||||
|
||||
新增或調整完後，所有帶 **`data-portal-nav`** 的 `<nav class="portal-nav">` 都會在載入腳本時被注入同一份 HTML。
|
||||
|
||||
---
|
||||
|
||||
## 1.1 未公開＝籌備中（全站一致）
|
||||
|
||||
- **站主沒說對外開放**的頁／錨點：在訪客可見處**不得**留可點的真實 `href`（頂欄、totoga2 分頁列、首頁內文、頁尾 CTA 皆同）。
|
||||
- 腳本標記為 `data-coming-soon="true"` 時：提示與頁內按鈕須讓讀者看見 **「籌備中」**（`portal-nav.js` 的 `COMING_SOON_LABEL`），不是改寫成別的隨機句。
|
||||
- **唯一例外**：`extra/site-guide.html` 的 `main.site-guide-main` 內連結（站主索引自用）；該頁頂欄 `data-portal-nav-all-open` 僅影響頂欄，**不**豁免主文以外區塊。
|
||||
|
||||
## 2. 可點 vs「籌備中」：`COMING_SOON_PAGES`
|
||||
|
||||
腳本會對導覽裡的連結做 **`applyComingSoonToNav`**：
|
||||
|
||||
- 若連結的**檔名**（小寫）出現在 **`COMING_SOON_PAGES`** 這個 `Set` 裡，該連結會被改成 **`href="#"`**、加上 **`data-coming-soon="true"`**，點擊無法前往（顯示隨機籌備中文案）。
|
||||
- **不要出現在 Set 裡**＝視為已開放，維持真實 `href`。
|
||||
|
||||
因此：
|
||||
|
||||
| 需求 | 做法 |
|
||||
|------|------|
|
||||
| 新頁要**正式開放** | 寫進 `buildPortalNavInnerHTML`（`assets/js/portal-nav.js`），並**確認檔名不在** `COMING_SOON_PAGES`。若曾暫時關閉，記得從 Set **刪除**該檔名。 |
|
||||
| 新頁先**占位、不開放** | 可選擇：仍寫進導覽，但把檔名**加進** `COMING_SOON_PAGES`；或暫時不要放進導覽。 |
|
||||
|
||||
（目前 Set 內含哪些檔，以 `assets/js/portal-nav.js` 為準；站主明講開放後才從 Set 移除該檔名，例如 `readable.html`。）
|
||||
|
||||
---
|
||||
|
||||
## 3. 首頁錨點：`INDEX_NAV_OPEN_HASHES`
|
||||
|
||||
指向 **`index.html#...`** 的連結，除了檔名判斷外，還會看 **錨點**：
|
||||
|
||||
- 若 `href` 是 `index.html#某錨點`，且該錨點**不在** **`INDEX_NAV_OPEN_HASHES`**，會被當成籌備中（與整頁關閉不同，是「這個錨點未開」）。
|
||||
- 新增首頁區塊且要從導覽直達時：在 **`INDEX_NAV_OPEN_HASHES`** 加上對應字串，例如 `"#story"`（**僅在使用者要求開放該錨點時**；若約定維持關閉則勿加入）。
|
||||
|
||||
---
|
||||
|
||||
## 3.1 索引頁頂欄全開（僅 `site-guide.html`）
|
||||
|
||||
- **`extra/site-guide.html`** 的 `<nav>` 使用 **`data-portal-nav data-portal-nav-all-open`** 時：注入後**不套用**籌備中，頂欄連結維持真實 `href`。主文 `main.site-guide-main` 內連結不由腳本改寫。
|
||||
- **禁止**在 `site-guide.html` 以外的頁面使用 `data-portal-nav-all-open`。
|
||||
|
||||
---
|
||||
|
||||
## 4. 新頁面 HTML 檢查清單
|
||||
|
||||
- 在 `<body>` 內適當位置放：
|
||||
|
||||
```html
|
||||
<nav class="portal-nav" aria-label="水晶男孩推廣部導覽" data-portal-nav></nav>
|
||||
```
|
||||
|
||||
- 在 `</body>` 前載入（順序可與現有頁一致）：
|
||||
|
||||
```html
|
||||
<script src="assets/js/portal-nav.js"></script>
|
||||
```
|
||||
|
||||
內頁（例如 `extra/`、`fallen/`、`member/`、`yellow-note/`、`variety/` 下）請用相對站根深度，例如：
|
||||
|
||||
```html
|
||||
<script src="../assets/js/portal-nav.js"></script>
|
||||
```
|
||||
|
||||
- 若該頁有 **`assets/js/particles.js`**／共用樣式（`assets/css/style.css` 等），比照其他內頁一併引入即可。
|
||||
|
||||
---
|
||||
|
||||
## 5. 刻意不進導覽的頁面
|
||||
|
||||
若某頁只給自己用（例如站內索引、草稿），**不要**寫進 `buildPortalNavInnerHTML` 即可；不必改 `COMING_SOON_PAGES`。
|
||||
|
||||
---
|
||||
|
||||
## 6. 改完請自檢
|
||||
|
||||
1. 從導覽點進新頁是否正常。
|
||||
2. 若應為開放頁，確認不會變成「尚無開放」、不會被改成 `href="#"`。
|
||||
3. 若為首頁錨點，確認已加入 `INDEX_NAV_OPEN_HASHES`（若有需要）。
|
||||
|
||||
---
|
||||
|
||||
## 7. 頁面錨點刪除（`某頁.html#id`）
|
||||
|
||||
指該 HTML 裡 **`id="…"` 的那一區**／`<section>`，不是刪整檔、不是刪資料夾、不是刪頂欄整段「全員發瘋」，也不是擅自改 `COMING_SOON_PAGES`（除非原句一併交代）。
|
||||
|
||||
1. **先**在目標頁拿掉該 DOM。
|
||||
2. **再**修仍指向死錨的 `href`（最小必要）。
|
||||
3. **禁止**只改 `portal-nav.js`／`site-guide.html` 卻不刪頁內區塊。
|
||||
|
||||
錨點拿掉後，書籤網址列仍可能顯示 `#…`，不代表 DOM 還在。header 大標 ≠ 已刪的 `#id` 區塊。「刪除」範圍不清 → **先問**。
|
||||
|
||||
## 名詞
|
||||
|
||||
- **頂欄**：`portal-nav.js` 注入的 `<nav class="portal-nav" data-portal-nav>`。
|
||||
- **全站索引**：`extra/site-guide.html`（可列草稿；**不等於**頂欄要掛）。
|
||||
- **程式真值**：`assets/js/portal-nav.js`（`COMING_SOON_LABEL`＝「籌備中」）。
|
||||
@@ -1,45 +1,45 @@
|
||||
---
|
||||
description: 全站對讀者文案語調（index body 開頭至 timeline data-era=2016.05）
|
||||
alwaysApply: true
|
||||
---
|
||||
|
||||
# 【文案調性】全站對訪客語感母本與禁止事項
|
||||
|
||||
撰寫或改寫**給訪客看的內文**時，語感對齊母本（站主指定範圍）：
|
||||
|
||||
## 母本
|
||||
|
||||
**檔案** `index.html`：`<body>` 起 → `#timeline` 內 **`article[data-era="2016.05"]` 全文止**（含錨點句）。
|
||||
|
||||
| 區塊 | 說明 |
|
||||
|------|------|
|
||||
| `header#origin` | Hero |
|
||||
| `nav.portal-nav` | 頂欄 |
|
||||
| `#start` | 入坑 |
|
||||
| `#mission` | 初衷 |
|
||||
| `#timeline` | 至 1997 → 2000 → 2016 → **2016.05** |
|
||||
|
||||
**不納入** 2016.05 之後的 timeline 與 body 後段。
|
||||
|
||||
## 錨點句（2016.05）
|
||||
|
||||
> 原來大家只是換個方式一起變老，這份情誼早已超越了表演。
|
||||
|
||||
須承接入坑 → 初衷 → 四節時間軸，勿只複誦此句。
|
||||
|
||||
## 語感
|
||||
|
||||
站主 2016 入坑、藝廊式創作；盛世 → 休止 → 合體 → 落地。溫柔、具體、遺憾與釋懷並寫。
|
||||
|
||||
## 避免
|
||||
|
||||
- 只抄 timeline 末段或錨點句。
|
||||
- 2016.05 之後當母本。
|
||||
- 讀者向技術說明（除非站主明講）。
|
||||
- 單頁 intro 硬拼整條首頁時間軸；該頁先說**該頁主題**（如六六歌2 電子書），語感對齊即可。
|
||||
|
||||
## 六六歌2 單頁 intro
|
||||
|
||||
- 採用版見 `totoga2/ebook.html`（「四月那場重逢…」）。
|
||||
- 勿 FlipHTML5／PDF 操作說明。
|
||||
- 四入口順序：**時間軸 → 電子書 → 圖文好讀版 → 影片**。
|
||||
---
|
||||
description: 全站對讀者文案語調（index body 開頭至 timeline data-era=2016.05）
|
||||
alwaysApply: true
|
||||
---
|
||||
|
||||
# 【文案調性】全站對訪客語感母本與禁止事項
|
||||
|
||||
撰寫或改寫**給訪客看的內文**時，語感對齊母本（站主指定範圍）：
|
||||
|
||||
## 母本
|
||||
|
||||
**檔案** `index.html`：`<body>` 起 → `#timeline` 內 **`article[data-era="2016.05"]` 全文止**（含錨點句）。
|
||||
|
||||
| 區塊 | 說明 |
|
||||
|------|------|
|
||||
| `header#origin` | Hero |
|
||||
| `nav.portal-nav` | 頂欄 |
|
||||
| `#start` | 入坑 |
|
||||
| `#mission` | 初衷 |
|
||||
| `#timeline` | 至 1997 → 2000 → 2016 → **2016.05** |
|
||||
|
||||
**不納入** 2016.05 之後的 timeline 與 body 後段。
|
||||
|
||||
## 錨點句（2016.05）
|
||||
|
||||
> 原來大家只是換個方式一起變老，這份情誼早已超越了表演。
|
||||
|
||||
須承接入坑 → 初衷 → 四節時間軸，勿只複誦此句。
|
||||
|
||||
## 語感
|
||||
|
||||
站主 2016 入坑、藝廊式創作；盛世 → 休止 → 合體 → 落地。溫柔、具體、遺憾與釋懷並寫。
|
||||
|
||||
## 避免
|
||||
|
||||
- 只抄 timeline 末段或錨點句。
|
||||
- 2016.05 之後當母本。
|
||||
- 讀者向技術說明（除非站主明講）。
|
||||
- 單頁 intro 硬拼整條首頁時間軸；該頁先說**該頁主題**（如六六歌2 電子書），語感對齊即可。
|
||||
|
||||
## 六六歌2 單頁 intro
|
||||
|
||||
- 採用版見 `totoga2/ebook.html`（「四月那場重逢…」）。
|
||||
- 勿 FlipHTML5／PDF 操作說明。
|
||||
- 四入口順序：**時間軸 → 電子書 → 圖文好讀版 → 影片**。
|
||||
Reference in New Issue
Block a user