ホームの更新情報: 新規公開と既存ページの更新を並べる

これまでは新しく公開したページだけを載せていた。既存ページを更新した日も分かるようにした。一覧には「新規」「更新」のバッジを付け、ホームの説明にも1行足した。表記の一括修正や画像の整理など、一度に多くのファイルを変更したコミット（6ファイル以上）は「更新」に数えていない。

1 files changed, 19 insertions, 1 deletions

diff --git a/src/components/Updates.astro b/src/components/Updates.astro
index 47278fe..9b6862d 100644
--- a/src/components/Updates.astro
+++ b/src/components/Updates.astro
@@ -1,7 +1,7 @@
 ---
 import updates from "../data/updates.json";
 
-type Update = { date: string; title: string; url: string; group: string };
+type Update = { date: string; title: string; url: string; group: string; kind: "new" | "update" };
 
 const initial = Number(Astro.props.limit ?? 5);
 const step = Number(Astro.props.step ?? 10);
@@ -27,6 +27,9 @@ function toJapaneseDate(iso: string): string {
   {items.map((u, index) => (
     <li hidden={index >= initial}>
       <time datetime={u.date}>{toJapaneseDate(u.date)}</time>
+      <span class:list={["updates-kind", u.kind === "update" ? "is-update" : "is-new"]}>
+        {u.kind === "update" ? "更新" : "新規"}
+      </span>
       {u.group && <span class="updates-group">{u.group}</span>}
       <a href={u.url}>{u.title}</a>
     </li>
@@ -104,6 +107,21 @@ function toJapaneseDate(iso: string): string {
     font-variant-numeric: tabular-nums;
     flex-shrink: 0;
   }
+  .updates-kind {
+    font-size: 0.75rem;
+    border-radius: 3px;
+    padding: 0.05rem 0.35rem;
+    flex-shrink: 0;
+  }
+  /* 新規公開は目立たせ、更新は控えめにする */
+  .updates-kind.is-new {
+    color: var(--sl-color-accent-high);
+    background: var(--sl-color-accent-low);
+  }
+  .updates-kind.is-update {
+    color: var(--sl-color-gray-2);
+    background: var(--sl-color-gray-6);
+  }
   .updates-group {
     font-size: 0.75rem;
     color: var(--sl-color-gray-2);