refactor: 健檢規範、拆出設計預設、修 git type

This commit is contained in:
2026-06-11 14:32:16 +08:00
parent f5042d6e02
commit e37433ea02
5 changed files with 33 additions and 29 deletions
+4 -20
View File
@@ -20,28 +20,12 @@ alwaysApply: true
- 若需求可能影響多檔(導覽、首頁、共用 CSS):**先問**「是否只改 A,還是 B/C 也要一起?」再改。
## 站主版面與元件預設(設計大原則)
以下為全站/新區塊的**預設假設**,不必每個區域重複交代;若該次需求明講例外再打破。
- **同一列/並排多欄**:預設 **等高**(例如 flex 同列 `align-items: stretch`、grid 同列對齊高度),除非該次明講要頂對齊或其他非等高編排。
- **同一層級、同類可重複元件**(例如多張 **CARD**、同一 pattern 的 tile):預設 **等寬**(同一 breakpoint 下寬度一致),除非明講破格。
- **短字層**(站主慣稱「十字以內」——極短標、標籤、按鈕字、頂欄主標、區塊小標等;語意上不要硬拆成兩行):盡量 **單行、不換行**;**水平置中**。
- **交付前必檢・置中**(每次改版面/新區塊/表單標題後**自動確認**,勿等站主提醒):
- 短字層、區塊主標、表單大標、按鈕列、圖示+標題並排:父層 `text-align: center` 或 `display: flex` + `justify-content: center` + `align-items: center`(必要時 `margin-inline: auto`)。
- `::before``::after` 裝飾圖(含 SVG 背景)與文字同一行時:標題用 **`inline-flex` + `align-items: center` + `justify-content: center`**,勿只靠 `inline-block` + `vertical-align` 猜視覺置中。
- 內文層 `p` 維持置左;僅容器可 `max-width` + `margin-inline: auto` 置中區塊本身。
- 窄螢幕若標題過長:先縮字級或 `letter-spacing`,仍無法單行再與站主確認是否允許換行。
- **內文層(body**(超過短字層——`<p>` 整段導語、說明、列表前引言):允許自然換行;**置左**對齊。規則敘述用「內文/body 層」,**不要**用某個 `*-lead`、`*-intro` 等 class 名當成這一層的定義。
- **怎麼判斷**:看**實際字數與語意**(是否明顯超過約十字、是否為段落內文),**不是**看 class 字串。HTML 裡的 `<body class="某頁">` 是**頁面作用範圍**,與「內文層」是兩件事,勿混為一談。
- **CSS 怎麼寫**:短字層 → 標題/按鈕等既有元件規則(多為置中)。內文層 → 在該頁 **`body.頁面類名` 底下**對**段落 `p`**(或該區 `section` 內 `p`)設 `text-align: left`;欄寬可 `max-width` + `margin-inline: auto`,但字仍左對齊。**禁止**在規則檔或新頁面把內文層綁死在自創 class 名上當唯一依據。
- **捲軸**:一般區塊 **不要**出現內嵌捲軸(避免預設 `overflow: auto/scroll` 把版面變成「盒子裡再拖條」);**只有**站主對該區曾**明講**要可捲動或強烈規定的例外才做捲動容器。
- **`img``canvas`**:一律 **等比例縮放**`object-fit: contain` 或 `max-width: 100%` + `height: auto`);**禁止**為了「撐滿」使用 `object-fit: fill` 或讓容器寬高比與圖面比例不一致卻強制 `width/height: 100%` 拉扁。滿欄時外殼可 100% 寬,圖本體置中、維持比例。
實作時仍以「只改被點名範圍」為上;若要拉一套新 grid/卡片列,優先在本區父層加 class,避免為了對齊去改未點名的全站共用規則。
## 文件與規則檔
- **不要**主動新增或長篇修改 `README`、`docs/*.md`,除非站主明講。
- **約定只寫在** `developer-rules/rules/*.mdc`**合併進既有檔**,勿再新增散落 `*-notes.md`/目錄索引)。禁止放在 `docs/` 或站主日常會開的目錄。
- 動導覽/籌備中/`site-guide`**只讀** `portal-nav-rules.mdc`。
## 回覆風格
- 站主要短句時:先答做沒做、為什麼壞,勿長篇道歉後又擅自改一輪。