feat: portfolio EN/ZH toggle, posts filter, blog content reorganization

docs/riegler-angular-translation-task.md

@@ -0,0 +1,50 @@
+# Riegler Angular Translation Task
+
+Status: in-progress
+Updated: 2026-05-30
+
+## Goal
+- Find Angular-related posts on https://riegler.fr/blog.
+- Compare with local translated posts.
+- List missing translations.
+- Translate each missing article.
+- Mark each item done when finished.
+
+## Source Collection
+- [x] Collect Angular-related post URLs from riegler.fr
+
+## Comparison Against Local Blog
+- [x] Build local translated canonical URL list
+- [x] Compute missing list
+
+## Already Translated (Matched by canonicalURL)
+- [x] https://riegler.fr/blog/2024-10-15-effect-context
+- [x] https://riegler.fr/blog/2024-12-31-lifecycle-hook-less
+- [x] https://riegler.fr/blog/2025-01-08-inject-not-service-locator
+- [x] https://riegler.fr/blog/2025-01-12-signal-decision-chart
+- [x] https://riegler.fr/blog/2025-02-16-incremental-dom
+- [x] https://riegler.fr/blog/2025-04-05-input-output
+
+## Missing Translation Checklist
+- [ ] https://riegler.fr/blog/2023-07-20-angular-memory-leak
+- [ ] https://riegler.fr/blog/2023-09-30-lazy-loading-mockable
+- [ ] https://riegler.fr/blog/2023-10-04-animations-async
+- [ ] https://riegler.fr/blog/2023-10-05-defer-part1
+- [ ] https://riegler.fr/blog/2023-10-08-defer-part2
+- [ ] https://riegler.fr/blog/2023-10-13-v17-builders
+- [ ] https://riegler.fr/blog/2023-10-24-signals-subscriptions
+- [ ] https://riegler.fr/blog/2023-11-02-v17-change-detection
+- [ ] https://riegler.fr/blog/2023-11-03-performance-for-repeaters
+- [ ] https://riegler.fr/blog/2024-01-11-zoneless-preview
+- [ ] https://riegler.fr/blog/2024-04-17-zoneless-with-zoneless-hybrid
+- [ ] https://riegler.fr/blog/2024-05-01-input-setters-caveats
+- [ ] https://riegler.fr/blog/2024-05-17-private-fields-downleveling
+- [ ] https://riegler.fr/blog/2024-10-18-resources-as-signals
+
+## Execution Log
+- [x] Task file initialized.
+- [x] Parsed riegler blog index and extracted Angular-related entries.
+- [x] Compared source URLs with local canonicalURL values.
+- [x] User confirmed authorization for full translation.
+- [ ] Translation execution via Explore agent blocked (agent requires verifiable copyright proof artifact in workspace).
+- [ ] Custom agent invocation blocked: requested agent name/path not found in current session (`blog-translator`, `blog-translator.agent`, `blog-translator.agent.md`, `.github\\agents\\blog-translator.agent.md`).

docs/riegler-angular-translation-tracker.md

@@ -0,0 +1,41 @@
+# Riegler Angular Translation Tracker
+
+## Goal
+- Source: https://riegler.fr/blog
+- Scope: Angular-related posts (2023-07 onward in the blog list)
+- Workflow:
+  1. Compare source posts with local translated posts.
+  2. Translate missing posts one by one into src/content/blog.
+  3. After each translation is completed, mark status as done.
+
+## Status Legend
+- todo: not translated yet
+- done: translated and added in src/content/blog
+
+## Checklist
+
+| Date | Source URL | Local Slug | Status |
+|---|---|---|---|
+| 2023-07-20 | https://riegler.fr/blog/2023-07-20-angular-memory-leak | angular-memory-leak | done |
+| 2023-09-18 | https://riegler.fr/blog/2023-09-18-cldr-angular | cldr-angular | done |
+| 2023-09-20 | https://riegler.fr/blog/2023-09-20-cd-coalescing | cd-coalescing | done |
+| 2023-09-30 | https://riegler.fr/blog/2023-09-30-lazy-loading-mockable | lazy-loading-mockable | done |
+| 2023-10-04 | https://riegler.fr/blog/2023-10-04-animations-async | animations-async | done |
+| 2023-10-05 | https://riegler.fr/blog/2023-10-05-defer-part1 | defer-part1 | done |
+| 2023-10-08 | https://riegler.fr/blog/2023-10-08-defer-part2 | defer-part2 | done |
+| 2023-10-08 | https://riegler.fr/blog/2023-10-08-tree-shakable-as-default | tree-shakable-as-default | done |
+| 2023-10-13 | https://riegler.fr/blog/2023-10-13-v17-builders | v17-builders | done |
+| 2023-10-24 | https://riegler.fr/blog/2023-10-24-signals-subscriptions | signals-subscriptions | done |
+| 2023-11-02 | https://riegler.fr/blog/2023-11-02-v17-change-detection | v17-change-detection | done |
+| 2023-11-03 | https://riegler.fr/blog/2023-11-03-performance-for-repeaters | performance-for-repeaters | done |
+| 2024-01-11 | https://riegler.fr/blog/2024-01-11-zoneless-preview | zoneless-preview | done |
+| 2024-04-17 | https://riegler.fr/blog/2024-04-17-zoneless-with-zoneless-hybrid | zoneless-with-zoneless-hybrid | done |
+| 2024-05-01 | https://riegler.fr/blog/2024-05-01-input-setters-caveats | input-setters-caveats | done |
+| 2024-05-17 | https://riegler.fr/blog/2024-05-17-private-fields-downleveling | private-fields-downleveling | done |
+| 2024-10-15 | https://riegler.fr/blog/2024-10-15-effect-context | understanding-effects | done |
+| 2024-10-18 | https://riegler.fr/blog/2024-10-18-resources-as-signals | resources-as-signals | done |
+| 2024-12-31 | https://riegler.fr/blog/2024-12-31-lifecycle-hook-less | angular-lifecycle-hook-free | done |
+| 2025-01-08 | https://riegler.fr/blog/2025-01-08-inject-not-service-locator | angular-inject-not-service-locator | done |
+| 2025-01-12 | https://riegler.fr/blog/2025-01-12-signal-decision-chart | signal-decision-chart | done |
+| 2025-02-16 | https://riegler.fr/blog/2025-02-16-incremental-dom | angular-declarative-templating | done |
+| 2025-04-05 | https://riegler.fr/blog/2025-04-05-input-output | angular-input-output-asymmetry | done |

docs/tag-taxonomy.md

@@ -0,0 +1,50 @@
+# Tag Taxonomy
+
+## Goal
+- Keep tags useful for readers as navigation, not as internal maintenance labels.
+- Use one consistent naming style across the whole site.
+- Prefer fewer, clearer tags over many overlapping tags.
+
+## Rules
+- Use lowercase English tags, preferably kebab-case.
+- Keep each post to 1-3 tags when practical.
+- Prefer one primary topic tag plus up to two secondary tags.
+- Do not use both Chinese and English variants for the same concept.
+- Do not use filler tags like `blog`.
+- Avoid workflow tags in `tags`, such as `translation`, because translation state is already represented by content fields.
+- Keep reader-facing series tags only when they help browsing, such as `english-learning`, `daily-reading`, `reflection`, `shanghai`, `career`, `blogging`.
+
+## Canonical Names
+- Use `ai`, not `AI`.
+- Use `nodejs`, not `node`.
+- Use `github`, not `GitHub`.
+- Avoid generic `frontend` unless it is truly the only meaningful label.
+
+## Angular Vocabulary
+- Primary tag: `angular`
+- Secondary tags used today:
+  - `animations`
+  - `change-detection`
+  - `dependency-injection`
+  - `i18n`
+  - `lazy-loading`
+  - `lifecycle`
+  - `performance`
+  - `rendering`
+  - `signals`
+  - `ssr`
+  - `hydration`
+  - `tooling`
+  - `zoneless`
+
+## What To Avoid
+- `Angular`, `Signal`, `前端`, `有角的`
+- `blog`, `translation`
+- Mixing framework tags with content-type tags in the same post
+- Creating a new tag when an existing Angular secondary tag already covers the topic
+
+## Migration Direction
+- Angular posts should converge on `angular` plus 0-2 concrete secondary topic tags.
+- Daily English posts should converge on `english-learning` + `daily-reading` + one topic tag.
+- Translation posts should drop `translation` from tags and rely on `isTranslation` instead.
+- Personal essays should use meaningful reader-facing tags like `reflection`, `career`, `shanghai`, or `blogging` instead of `blog`.

src/components/Card.tsx

@@ -6,9 +6,17 @@ export interface Props {
   href?: string;
   frontmatter: CollectionEntry<"blog">["data"];
   secHeading?: boolean;
+  itemClassName?: string;
+  itemData?: Record<string, string>;
 }
 
-export default function Card({ href, frontmatter, secHeading = true }: Props) {
+export default function Card({
+  href,
+  frontmatter,
+  secHeading = true,
+  itemClassName = "",
+  itemData = {},
+}: Props) {
   const { title, pubDatetime, modDatetime, description } = frontmatter;
 
   const headerProps = {
@@ -17,7 +25,7 @@ export default function Card({ href, frontmatter, secHeading = true }: Props) {
   };
 
   return (
-    <li className="my-6">
+    <li className={`my-6 ${itemClassName}`.trim()} {...itemData}>
       <a
         href={href}
         className="inline-block text-lg font-medium text-skin-accent decoration-dashed underline-offset-4 focus-visible:no-underline focus-visible:underline-offset-0"

src/components/Header.astro

@@ -4,7 +4,7 @@ import Hr from "./Hr.astro";
 import LinkButton from "./LinkButton.astro";
 
 export interface Props {
-  activeNav?: "posts" | "short-stories" | "tags" | "radio" | "about" | "search";
+  activeNav?: "posts" | "tags" | "radio" | "about" | "search";
 }
 
 const { activeNav } = Astro.props;
@@ -60,11 +60,6 @@ const { activeNav } = Astro.props;
               Posts
             </a>
           </li>
-          <li>
-            <a href="/short-stories/" class={activeNav === "short-stories" ? "active" : ""}>
-              Short Stories
-            </a>
-          </li>
           <li>
             <a href="/tags/" class={activeNav === "tags" ? "active" : ""}>
               Tags
@@ -150,7 +145,7 @@ const { activeNav } = Astro.props;
     @apply flex w-full flex-col items-center sm:ml-2 sm:flex-row sm:justify-end sm:space-x-4 sm:py-0;
   }
   nav ul {
-    @apply mt-4 grid w-44 grid-cols-2 grid-rows-5 gap-x-2 gap-y-2 sm:ml-0 sm:mt-0 sm:w-auto sm:gap-x-5 sm:gap-y-0;
+    @apply mt-4 grid w-44 grid-cols-2 grid-rows-4 gap-x-2 gap-y-2 sm:ml-0 sm:mt-0 sm:w-auto sm:gap-x-5 sm:gap-y-0;
   }
   nav ul li {
     @apply col-span-2 flex items-center justify-center;