feat(overview-artifact): 產生可預覽總覽與截圖 fallback

2026-09-18 15:59:34 +08:00
parent c545f11ec1
commit 867a23497f
16 changed files with 605 additions and 324 deletions
@@ -1,112 +0,0 @@
-<!DOCTYPE html>
-<html lang="zh-Hant">
-<head>
-<meta charset="utf-8">
-<meta name="viewport" content="width=device-width, initial-scale=1">
-<title>{{標題}}</title>
-<style>
-  /* 樣式全部集中在這裡，內文只放佔位——改版面不必動內容，換內容不必碰樣式 */
-  :root {
-    --bg: #ffffff;
-    --fg: #1f2328;
-    --muted: #59636e;
-    --line: #d1d9e0;
-    --accent: #0969da;
-    --surface: #f6f8fa;
-  }
-  @media (prefers-color-scheme: dark) {
-    :root:not([data-theme="light"]) {
-      --bg: #0d1117;
-      --fg: #e6edf3;
-      --muted: #9198a1;
-      --line: #3d444d;
-      --accent: #4493f8;
-      --surface: #151b23;
-    }
-  }
-  :root[data-theme="dark"] {
-    --bg: #0d1117;
-    --fg: #e6edf3;
-    --muted: #9198a1;
-    --line: #3d444d;
-    --accent: #4493f8;
-    --surface: #151b23;
-  }
-
-  * { box-sizing: border-box; }
-  body {
-    margin: 0;
-    padding: 48px 16px 96px;
-    background: var(--bg);
-    color: var(--fg);
-    font: 16px/1.7 -apple-system, "Noto Sans TC", "Microsoft JhengHei", sans-serif;
-  }
-  main { max-width: 900px; margin: 0 auto; }
-
-  header { border-bottom: 1px solid var(--line); padding-bottom: 24px; margin-bottom: 40px; }
-  h1 { font-size: 30px; line-height: 1.3; margin: 0 0 12px; }
-  .meta { color: var(--muted); font-size: 14px; }
-  .meta a { color: var(--accent); text-decoration: none; }
-  .meta a:hover { text-decoration: underline; }
-
-  .lede {
-    font-size: 21px;
-    line-height: 1.6;
-    margin: 0 0 40px;
-    padding: 20px 24px;
-    background: var(--surface);
-    border-left: 3px solid var(--accent);
-    border-radius: 0 8px 8px 0;
-  }
-
-  section { margin-bottom: 40px; }
-  h2 { font-size: 15px; letter-spacing: .08em; text-transform: uppercase;
-       color: var(--muted); margin: 0 0 16px; font-weight: 600; }
-  ul { margin: 0; padding-left: 22px; }
-  li { margin-bottom: 8px; }
-
-  figure { margin: 0; padding: 24px; background: var(--surface);
-           border: 1px solid var(--line); border-radius: 8px; overflow-x: auto; }
-  figure .mermaid { display: flex; justify-content: center; }
-
-  footer { margin-top: 56px; padding-top: 20px; border-top: 1px solid var(--line);
-           color: var(--muted); font-size: 13px; }
-
-  @media (max-width: 600px) {
-    body { padding: 32px 16px 64px; }
-    h1 { font-size: 24px; }
-    .lede { font-size: 18px; padding: 16px 18px; }
-  }
-</style>
-</head>
-<body>
-<main>
-  <header>
-    <h1>{{標題}}</h1>
-    <p class="meta">{{來源議題}}</p>
-  </header>
-
-  <p class="lede">{{總覽}}</p>
-
-  <section>
-    <h2>目標</h2>
-    <ul>{{目標}}</ul>
-  </section>
-
-  <section>
-    <h2>流程</h2>
-    <figure><div class="mermaid">{{流程圖}}</div></figure>
-  </section>
-
-  {{工作包全景}}
-
-  <footer>{{頁尾}}</footer>
-</main>
-
-<script type="module">
-  import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid@11/dist/mermaid.esm.min.mjs';
-  const dark = matchMedia('(prefers-color-scheme: dark)').matches;
-  mermaid.initialize({ startOnLoad: true, theme: dark ? 'dark' : 'default' });
-</script>
-</body>
-</html>