From 5a48abb7848dd4329fe7b13f4412614c27317c51 Mon Sep 17 00:00:00 2001 From: richblack Date: Wed, 5 Aug 2026 00:02:46 +0800 Subject: [PATCH] =?UTF-8?q?t193=20=E5=9B=9B=E4=BF=AE=EF=BC=9A=E8=A3=81?= =?UTF-8?q?=E6=B7=A8=E7=89=88=20lockup=EF=BC=8B=E5=81=B4=E9=82=8A=E6=AC=84?= =?UTF-8?q?=E9=81=B8=E4=B8=AD=E6=85=8B=E7=85=A7=20portal=EF=BC=88leo=20?= =?UTF-8?q?=E5=85=A9=E9=BB=9E=EF=BC=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ## ① logo 比例不對＋深色仍有白底＋旁邊大量空白 三個症狀同一個根：**我用的是未裁淨的原始 PNG**。 portal 的註解早就寫著：原始 1840x560 **只有 32% 高度是實際字形**，上下大留白 ⇒ 同 height 字看起來很小；留白處露出 paper-on-ink 自帶的 Ink 底板＝白底。 portal 用的是裁淨版（986x176），但**只內嵌在它的 HTML base64 裡**，我抄不到才用了原始圖。 修： - 從 portal 的 base64 抽出兩張裁淨版，存成 arcrun-cis/trimmed/ 供全站共用 - 兩張**都是透明底**（實測四邊留白 0）⇒ 深色模式**拿掉 Ink 底板** - 空白是**版面**造成：側欄 232px 扣 padding 剩 184px，logo 高 24px 只有 134px ⇒ 空 50px ⇒ 側欄對齊 portal 的 216px，logo 改 width:100% 填滿可用寬度 實測（渲染後量像素）： logo 26px 高 × 151px 寬，右側剩餘空白 1px（原本 50px） 深色：側欄底(18,18,18) vs logo 上下皆(18,18,18) ⇒ 落差 0，無白底 ## ② 側邊欄選中態太粗糙 leo：「參考現在 Portal 的格式⋯⋯這個比現在膠囊反紅精緻，重點是跟 portal 的形象符合」 修：逐字照 portal 的 #sidenav .nav.on —— **不是實心膠囊**，而是 amber 字色 ＋ 8% amber 底 ＋ 右側 2px amber 邊。 側欄右緣也照 portal 用 2px amber 35%。 實測：選中列底(237,228,222)=amber 8%、右緣(176,74,47)=Relation、未選(242,241,237)=Canvas。 ## 機械閘加三項守衛 - 不准用未裁淨的原始 lockup（字會太小） - 選中態必須有 border-right-color: var(--amber) - 不准再出現 border-radius:999px（膠囊，leo 已否決） 兩支閘全過；style.css 仍 0 個 hex。 --- cmd/arcrun-app/check-cis.sh | 11 +++- cmd/arcrun-app/check-render.sh | 15 +++-- cmd/arcrun-app/frontend/index.html | 4 +- .../assets/arcrun-lockup-h-ink-trimmed.png | Bin 0 -> 27022 bytes .../assets/arcrun-lockup-h-paper-trimmed.png | Bin 0 -> 27622 bytes cmd/arcrun-app/frontend/src/style.css | 60 ++++++++++-------- 6 files changed, 54 insertions(+), 36 deletions(-) create mode 100644 cmd/arcrun-app/frontend/src/assets/arcrun-lockup-h-ink-trimmed.png create mode 100644 cmd/arcrun-app/frontend/src/assets/arcrun-lockup-h-paper-trimmed.png diff --git a/cmd/arcrun-app/check-cis.sh b/cmd/arcrun-app/check-cis.sh index de4318e..4cdeb5e 100755 --- a/cmd/arcrun-app/check-cis.sh +++ b/cmd/arcrun-app/check-cis.sh @@ -32,9 +32,14 @@ STRAY=$(grep -oiE '#[0-9a-f]{6}' "$CSS" | tr 'a-f' 'A-F' | sort -u \ [ -z "$STRAY" ] && ok "沒有自創顏色" || ng "出現非 CIS 色：$(echo $STRAY | tr '\n' ' ')" # ③ Logo 必須真的放進去（leo 點名的那條） -grep -q "arcrun-lockup-h-ink.png" "$HTML" && ok "淺色 lockup 已放" || ng "缺淺色 lockup" -grep -q "arcrun-lockup-h-paper-on-ink.png" "$HTML" && ok "深色 lockup 已放" || ng "缺深色 lockup" -[ -f frontend/src/assets/arcrun-lockup-h-ink.png ] && ok "lockup 檔案存在" || ng "lockup 檔案不存在" +grep -q "arcrun-lockup-h-ink-trimmed.png" "$HTML" && ok "淺色 lockup（裁淨版）已放" || ng "缺淺色裁淨版 lockup" +grep -q "arcrun-lockup-h-paper-trimmed.png" "$HTML" && ok "深色 lockup（裁淨版）已放" || ng "缺深色裁淨版 lockup" +[ -f frontend/src/assets/arcrun-lockup-h-ink-trimmed.png ] && ok "lockup 檔案存在" || ng "lockup 檔案不存在" +# 🔴 不准用未裁淨的原始 PNG：1840x560 只有 32% 高是字形，同 height 看起來字很小 +grep -qE 'lockup-h-(ink|paper-on-ink)\.png' "$HTML" && ng "用到未裁淨的原始 lockup（字會太小）" || ok "沒用未裁淨的原始圖" +# 側邊欄選中態要照 portal（amber 字＋8% 底＋右緣 2px），不是實心膠囊 +grep -q "border-right-color: var(--amber)" "$LAYOUT" && ok "選中態同 portal（右緣 amber）" || ng "選中態未照 portal" +grep -q "border-radius: 999px" "$LAYOUT" && ng "還在用膠囊選中態（leo 已否決）" || ok "沒有膠囊選中態" grep -q "lockup-h.svg" "$HTML" 2>/dev/null && ng "用到已作廢的 SVG lockup（字腔缺失）" || ok "沒用作廢的 SVG lockup" # ④ 深淺色都要成立（portal 有 data-theme，這裡也要） diff --git a/cmd/arcrun-app/check-render.sh b/cmd/arcrun-app/check-render.sh index c0d4079..c0ded27 100755 --- a/cmd/arcrun-app/check-render.sh +++ b/cmd/arcrun-app/check-render.sh @@ -58,12 +58,15 @@ for y in range(h): line[i]=(line[i]+pr)&255 rows.append(bytes(line)); prev=line px=lambda x,y:tuple(rows[y][x*ch:x*ch+3]) -brand=px(10,10); logo=px(60,47) -diff=max(abs(a-b) for a,b in zip(brand,logo)) -print(f" 品牌區背景 {brand} ／ logo 底板 {logo} ／ 落差 {diff}") -if diff > 12: - print(" ❌ logo 底板與背景不接合——會出現方塊（leo 截圖裡那個）"); sys.exit(1) -print(" ✅ logo 底板與背景接合，無方塊") +# logo 現在用**裁淨版透明底** ⇒ 品牌區四周應該就是頁面底色，不該出現任何色塊。 +# 取 logo 上方與下方各一點：若與側欄底色不同，代表又墊了底板或圖沒裁淨。 +side = px(10, 300) # 側欄純底色 +above, below = px(150, 6), px(150, 62) +worst = max(max(abs(a-b) for a,b in zip(side,p)) for p in (above, below)) +print(f" 側欄底色 {side} ／ logo 上方 {above} ／ 下方 {below} ／ 最大落差 {worst}") +if worst > 10: + print(" ❌ logo 周圍出現色塊——底板沒去掉或用到未裁淨的圖"); sys.exit(1) +print(" ✅ logo 透明底、周圍無色塊") # 深色模式有沒有生效：整體應該偏暗 if sum(px(600,400))/3 > 120: print(" ❌ 深色模式沒生效（右側內容區偏亮）"); sys.exit(1) diff --git a/cmd/arcrun-app/frontend/index.html b/cmd/arcrun-app/frontend/index.html index 5176651..db06d10 100644 --- a/cmd/arcrun-app/frontend/index.html +++ b/cmd/arcrun-app/frontend/index.html @@ -15,8 +15,8 @@