diff --git a/cmd/arcrun-app/frontend/src/main.js b/cmd/arcrun-app/frontend/src/main.js index a5448c0..94dcd63 100644 --- a/cmd/arcrun-app/frontend/src/main.js +++ b/cmd/arcrun-app/frontend/src/main.js @@ -112,16 +112,21 @@ function cardTrouble(s) { // 而原因本來就在 status.json 裡 —— 數字不能代替原因。 function cardFailures(f) { if (!f || !f.items || !f.items.length) return ''; + // 🔴 leo 2026-08-06:「**可以顯示沒通過的名稱,旁邊有個三角形,點擊看到失敗細節, + // default 摺疊起來,重點是找到問題在哪裏**」 + // ——他要的是先看到「哪些檔沒過」,細節是需要時才展開。 + // 先前把原因直接攤在旁邊,害檔名欄被擠成一行一個字(實撞截圖)。 + // 用原生
:三角形、鍵盤可操作、預設收合,都不必自己寫。 return `

${esc(f.title)}

${esc(f.note)}
-
+
${f.items.map((it) => ` -
- ${esc(it.name)} - ${esc(it.reason)} -
`).join('')} +
+ ${esc(it.name)} +
${esc(it.reason)}
+
`).join('')}
${f.more > 0 ? `
…還有 ${f.more} 份
` : ''}
`; diff --git a/cmd/arcrun-app/frontend/src/style.css b/cmd/arcrun-app/frontend/src/style.css index bbf3fdb..ec70fff 100644 --- a/cmd/arcrun-app/frontend/src/style.css +++ b/cmd/arcrun-app/frontend/src/style.css @@ -220,3 +220,26 @@ input[type=text], input[type=password] { .step.now { font-weight: 600; } .step .t { flex: 1; } .step .m { font-size: 12.5px; color: rgba(var(--ink-rgb), .45); } + +/* 失敗清單:檔名一行、細節收在三角形裡(leo 2026-08-06: + 「顯示沒通過的名稱,旁邊有個三角形,點擊看到失敗細節,default 摺疊起來」)。 + 先前重用 .step 的橫向格線,害中文檔名被擠成一行一個字。 */ +.faillist { margin-top: 12px; } +.fail { border-top: 1px solid rgba(var(--ink-rgb), .10); } +.fail:first-child { border-top: 0; } +.fail > summary { + cursor: pointer; + padding: 10px 2px; + font-size: 14px; + line-height: 1.5; + word-break: break-word; /* 長檔名要能換行,但不是一字一行 */ + list-style: revert; /* 保留原生三角形 */ +} +.fail > summary::marker { color: var(--amber); } +.fail[open] > summary { font-weight: 600; } +.failwhy { + padding: 2px 2px 12px 18px; + font-size: 13px; + line-height: 1.7; + color: rgba(var(--ink-rgb), .68); +}