docs: fix stale CLAUDE.md content after design-system refactoring #446
Reference in New Issue
Block a user
Delete Branch "docs/post-refactor-accuracy-audit"
Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?
Summary
brand-navy,brand-mint,brand-sand) — all three were stale relative tolayout.cssbriefwechsel/,aktivitaeten/,geschichten/,stammbaum/,enrich/, etc.), remove non-existentconversations/bg-white border border-brand-sandwithbg-surface border border-line(semantic tokens, supports dark mode)frontend/CLAUDE.mdroute tree:chronik/→aktivitaeten/Test plan
grep -r "002850\|A6DAD8\|E4E2D7\|Merriweather\|port 3000\|conversations/\|brand-sand\|chronik/" CLAUDE.md frontend/CLAUDE.mdreturns nothinglayout.cssandfind frontend/src/routes -maxdepth 1 -type d🤖 Generated with Claude Code
👨💻 Felix Brandt — Senior Fullstack Developer
Verdict: ⚠️ Approved with concerns
The changes are clean, targeted, and correct. One ambiguity in the color table needs addressing before this becomes the canonical reference.
Blocker
brand-sandlisted under "Class" column but is not a Tailwind utilityThe color table header says "Class", implying all three rows are usable Tailwind utility prefixes. But in
layout.css, only--color-brand-navyand--color-brand-mintare defined as static@themetokens —--color-brand-sandis not. This means:bg-brand-navy,border-brand-navy→ ✅ valid Tailwind utilitiesbg-brand-mint,border-brand-mint→ ✅ validbg-brand-sand,border-brand-sand→ ❌ not generated, will silently produce nothingThe description change to "Page background (palette alias)" hints at this, but a developer reading the table will assume all rows are usable classes. The old card pattern (
border-brand-sand) was the canonical example of this mistake — this PR correctly fixes the card example but leaves the door open via the table.Suggested fix:
Or at minimum, rename the column "Token / Class" and add a note that
brand-sandis palette-only.Suggestions
frontend/CLAUDE.mdroute tree still uses└── ...as a trailing ellipsis, hidinggeschichten/,stammbaum/,enrich/etc. The rootCLAUDE.mdwas fully expanded — would be good to align both files.users/[id]route exists on disk but appears in neither tree.🏗️ Markus Keller — Senior Application Architect
Verdict: ✅ Approved
This is a docs-only PR and it does its job well. A few observations.
What's correct
conversations/being wrong was a genuine navigation hazard — any new contributor looking for the Briefwechsel route would be lost. The corrected tree is accurate.border-brand-sand bg-whitetoborder-line bg-surfacecorrectly reflects the semantic token architecture. The old example coupled presentation to raw palette values; the new example couples to semantic tokens that survive theming. This is the right direction.docs/ARCHITECTURE.md.Minor observation
The
api/proxy route group is present on disk (frontend/src/routes/api/) but not in either route tree. It's an implementation detail (server-side SSR proxy, not user-facing), so omitting it from CLAUDE.md is defensible — but worth a one-liner comment explaining what it is, to prevent a future reader from wondering why requests to/api/work despite no visible route.No architecture concerns with this PR.
🖥️ Tobias Wendt — DevOps & Platform Engineer
Verdict: ✅ Approved
Pure docs change. Infrastructure is unaffected. One thing worth clarifying for future readers.
What's correct
Port comment fixed from
3000to5173— this matches whatdocker-compose.ymlpublishes ("${PORT_FRONTEND}:5173"). A new developer following the docs will now land on the right port.Observation (not a blocker)
docker-compose.ymlstill contains:This is the application's public-facing URL (used for email links, OAuth callbacks, etc.) — not the dev server port. The two are different things. But a new developer who just read "dev server is 5173" and then sees
3000in the Compose file will be confused.Consider a one-line comment in
docker-compose.yml:Not blocking this docs PR, but worth a follow-up task.
🔒 Nora "NullX" Steiner — Application Security Engineer
Verdict: ✅ Approved
Documentation-only change. Zero attack surface impact.
What I checked
Clean
The PR removes incorrect route names from the docs and corrects color/font values. Nothing here creates, widens, or obscures a security boundary. Merge freely.
🧪 Sara Holt — QA Engineer & Test Strategist
Verdict: ✅ Approved
Documentation-only PR. No test coverage required or applicable.
What I checked
border-brand-sand→border-line) is already covered passively — axe-playwright and visual regression tests running on existing pages will catch any layout regressions if the class change had unintended side effects (it won't, since these are doc examples, not live code)Suggestion
The test plan verifies that old strings are gone but doesn't verify the new values are correct. A tighter test plan would add:
Low stakes for a docs PR, but good habit when documenting values that must stay in sync with source files.
🎨 Leonie Voss — UX Designer & Brand Specialist
Verdict: 🚫 Changes requested
The CLAUDE.md fixes are correct and necessary — but this PR misses the most authoritative brand reference that LLM assistants actually use for code generation:
.claude/personas/ui_expert.md(my own persona file). That file still contains every stale value this PR is trying to fix.Blocker:
ui_expert.mdpersona file has stale brand data.claude/personas/ui_expert.md— Domain Expertise section (never changes unless explicitly edited):Also the DO example in the "In Our Stack" section uses hardcoded stale hex values in a CSS comment:
When an LLM agent uses the
ui_expertpersona to review or generate UI code, it will pull brand guidance from this file — overriding the now-correct CLAUDE.md values. The two sources will directly contradict each other.This PR's stated goal is ensuring docs represent the current state. The persona file is a doc. It must be updated in the same commit.
Also:
brand-sandcolumn label ambiguityThe color table column is headed "Class" but
brand-sand(--palette-sand) is not a Tailwind utility class — onlybrand-navyandbrand-mintare defined as--color-brand-*tokens and generate Tailwind utilities. Writingbg-brand-sandin a component will silently produce nothing. I'd rather the table clearly distinguish "Tailwind utility" from "raw palette constant used via semantic tokens."Minor
The STYLEGUIDE.md in
docs/already has the correct values (#012851,#a1dcd8, Tinos). This PR brings CLAUDE.md in line — once the persona file is updated, all three sources will agree.📋 Elicit — Requirements Engineer & Documentation Analyst
Verdict: ⚠️ Approved with concerns
Reviewing against the stated goal: "docs now represent the current state of the software." The PR makes meaningful improvements but leaves two documentation completeness gaps.
Concerns
1.
frontend/CLAUDE.mdroute tree is still incompleteRoot
CLAUDE.mdwas fully expanded — every route is listed. Butfrontend/CLAUDE.mdstill truncates with└── ...:This hides
geschichten/,stammbaum/,enrich/,hilfe/,profile/,register/,forgot-password/,reset-password/— the same routes the root CLAUDE.md now correctly lists. A developer working infrontend/and reading onlyfrontend/CLAUDE.md(the closer, more relevant doc) gets an incomplete picture.2.
users/[id]route exists but appears in neither treefrontend/src/routes/users/[id]/+page.svelteexists on disk. Neither route tree mentions it. If it's a valid user-facing route, it belongs in the tree. If it's vestigial or internal, a comment noting that would prevent confusion.3. Ambiguous "Class" column for
brand-sandThe table documents
brand-sandunder a "Class" column alongsidebrand-navyandbrand-mint, which are valid Tailwind utility prefixes. Butbrand-sandis a raw palette constant — using it as a Tailwind class (bg-brand-sand,border-brand-sand) silently fails. The requirement "docs represent current state" is only half-met here: the hex is now correct, but the semantics of the entry are still misleading.What's good
conversations/and replacing withbriefwechsel/is the single highest-value fix in this PR — it directly corrects a navigation dead-end for anyone following the docs.layout.css.Review concerns addressed
All open concerns from the multi-persona review have been resolved across two commits.
d69a3abc— docs(personas): fix stale brand data in ui_expert personaLeonie's concern — stale hex values in ui_expert.md:
#002850/#A6DAD8/#E4E2D7with--palette-navy/--palette-mint/--palette-sand; noted that sand is a palette constant, not a Tailwind utility — usebg-canvas/bg-surfaceinsteadMerriweather→Tinosin Domain Expertise sectionbg-white shadow-sm border border-brand-sand rounded-sm p-6→bg-surface shadow-sm border border-line rounded-sm p-6text-gray-400→text-ink-3var(--c-ink)/var(--c-accent)/var(--c-surface)referencesimpl-reftable: updated card class frombg-white shadow-sm border border-brand-sand rounded-sm p-6tobg-surface shadow-sm border border-line rounded-sm p-6d01b9a75— docs(claude-md): replace hex values with CSS var refs, expand route treesFelix's concern — stale hex values in CLAUDE.md color tables:
CLAUDE.mdandfrontend/CLAUDE.md: replaced the "Brand color utilities" table (which had hardcoded hex values and a misleadingClasscolumn) with a "Brand color tokens" table using CSS variable references (--palette-navy,--palette-mint,--palette-sand). Clarified that--palette-sandis a palette constant only — not a Tailwind utility;bg-canvas/bg-surfaceare the correct utilities.Felix's concern — incomplete route tree in frontend/CLAUDE.md:
└── ...stub in the routes section offrontend/CLAUDE.mdwith all missing routes:geschichten/,stammbaum/,enrich/,hilfe/transkription/,profile/,users/[id]/,register/,forgot-password/,reset-password/,demo/Missing
users/[id]/route (noted during implementation):users/[id]/(public user profile page) to bothCLAUDE.mdandfrontend/CLAUDE.mdroute trees — this route existed in the codebase but was absent from all documentation.👨💻 Felix Brandt — Senior Fullstack Developer
Verdict: ✅ Approved
Documentation-only PR. No production code, no tests to write. Checked for correctness and consistency.
What I verified
3000→5173): Correct — matchesvite.config.tsandfrontend/CLAUDE.md §How to Run.Merriweather→Tinos): Correct — Tinos is the De Gruyter Brill CI serif substitute.bg-surface shadow-sm border border-line rounded-sm p-6matches live components likePersonCard.svelteand the document detail page.conversations/correctly removed;briefwechsel/is the real route. All added routes (geschichten/,stammbaum/,enrich/,hilfe/,profile/,users/[id]/, etc.) verified against the codebase.--palette-navyetc.) are durable and point developers tolayout.cssas the single source of truth. Good call.Minor notes (non-blocking)
users/[id]/route addition, which was discovered during implementation and added to both route trees. No action required, just noting the description gap.No blockers. This cleans up real LLM-guidance drift that would have caused silently incorrect code generation.
🏗️ Markus Keller — Application Architect
Verdict: ✅ Approved
Pure documentation. No architectural changes, no module boundary shifts, no infrastructure additions. Checked for anything that might create architectural confusion.
What I verified
document/,person/,geschichte/,stammbaum/, etc.). This matches the "package by feature" principle in the frontendlib/structure.--palette-navy,--palette-mint) is the right architectural move. It directs developers tolayout.cssas the single authoritative source, preventing divergence between what's documented and what's deployed.--palette-sandas palette constant (not Tailwind utility): This clarification is architecturally correct. Documenting thatbg-canvas/bg-surfaceare the correct semantic utilities prevents future developers from reaching for a non-existentbg-brand-sandclass.One observation
The
api/route infrontend/CLAUDE.md's project structure is an internal server-side proxy, not a user-facing feature — it sits in the routes tree alongside user-facing pages, which could mislead. A parenthetical "(server-side only)" note exists on it, so it's adequately qualified. No change needed.LGTM from an architecture perspective.
🚀 Tobias Wendt — DevOps & Platform Engineer
Verdict: ✅ Approved
No infrastructure changes, no CI workflow changes, no Compose file changes. Reviewed purely for DevOps-relevant documentation accuracy.
What I verified
3000docs would have been confused whylocalhost:3000shows nothing. This is a real friction fix.docs/DEPLOYMENT.md,docker-compose.yml,.gitea/workflows/, Caddyfile — none modified. No risk of stale infra docs being introduced.One note (informational)
The
demo/route is documented as "Dev-only demos" in the route tree — I'd verify that this route is actually guarded in the SvelteKit layout or only deployed in dev (not just by convention). If it's accessible in production with no auth guard, that's a separate issue. Out of scope for this PR but worth a follow-up ticket if it hasn't been checked.No changes requested from my side.
🎨 Leonie Voss — UX Designer & Accessibility Strategist
Verdict: ✅ Approved
These are corrections to my own persona file and the CLAUDE.md brand references. I care deeply that any document an LLM reads when generating UI code gives accurate brand guidance — stale values here cause real visual bugs and dark mode failures. Overall this is a strong fix.
What changed in my persona
Correctly fixed:
--palette-navy,--palette-mint,--palette-sandCSS variable references. The note clarifying that--palette-sandis a raw palette constant (not a Tailwind utility) and thatbg-canvas/bg-surfaceare the correct utilities is exactly right.Merriweather → Tinos. Correct — Tinos is the Times New Roman substitute in the De Gruyter Brill CI.bg-white shadow-sm border border-brand-sand → bg-surface shadow-sm border border-line. This is the semantic-token version that supports dark mode. Good.text-gray-400 → text-ink-3. Correct semantic token.impl-reftable in the Testable Code section: card pattern updated to match. ✅One minor concern (suggestion, not blocker):
In the DO example under "Use CSS custom properties for all brand colors", the new code shows:
The variables
--c-ink,--c-accent,--c-surfacelook like internal shorthand aliases. If these don't actually exist inlayout.cssunder those exact names, an LLM following this example would generate code referencing non-existent variables. The comment "see --palette-* for raw values" is helpful context, but the backing variable names in the example should match what's in the actual file. Consider verifying and using the real variable names (--palette-navyetc.) or marking the example as illustrative pseudocode.This is the persona's teaching file, so inaccurate variable names in examples could mislead future code generation. Worth a follow-up correction if the names don't match
layout.css.Otherwise LGTM. These were the most impactful stale values in the codebase for UI correctness.
🧪 Sara Holt — QA Engineer & Test Strategist
Verdict: ✅ Approved
Documentation-only PR. No test files modified, no test infrastructure affected. Reviewed for anything that could silently impact test correctness.
What I verified
Card pattern change:
The card pattern was updated from
bg-white shadow-sm border border-brand-sandtobg-surface shadow-sm border border-line. If any E2E tests use CSS class assertions on card containers (e.g., checking forbg-white), those would already be broken (the code was already changed before this PR — the documentation was stale, not the code). No test impact from this PR.Route tree expansion:
Several previously undocumented routes are now documented:
geschichten/,stammbaum/,enrich/,hilfe/transkription/,users/[id]/. If the E2E suite has coverage gaps on these routes, this PR makes them more discoverable. Not a blocker, but worth checking whetherstammbaum/,enrich/, andgeschichten/have E2E critical-journey coverage — they weren't in any route tree before, which means they may have been overlooked in test planning.Note on demo/ route:
demo/is now explicitly documented as "Dev-only demos". If the E2E suite accidentally hits this route in a non-dev environment, it could produce false failures. Worth verifying the route is not reachable in the E2E stack configuration.No blockers. The documentation fixes reduce guidance drift that could cause future test setup errors.
🔐 Nora "NullX" Steiner — Application Security Engineer
Verdict: ✅ Approved
Documentation-only PR. No application logic, authentication, authorization, or infrastructure configuration modified. No security-relevant surfaces changed.
What I checked
No security-sensitive content introduced:
Brand token documentation:
The switch from hardcoded hex values to CSS variable references (
--palette-navyetc.) is a documentation improvement only — no runtime impact.Route tree expansion:
Newly documented routes (
stammbaum/,enrich/,users/[id]/,demo/) are already deployed. Worth verifying (separately from this PR) that:users/[id]/enforces authentication before displaying profile data — if it's a public page showing any personal data, the auth check matters.demo/is not reachable in production without authentication — "dev-only demos" documented but enforcement should be at the SvelteKit load function level, not just by convention.Both are existing questions about deployed routes, not regressions introduced by this PR.
No security concerns with the changes in scope.
📋 Elicit — Requirements Engineer & Business Analyst
Verdict: ✅ Approved
Reviewing as a requirements artifact: CLAUDE.md and the persona files are LLM-guidance documents — a form of "machine-readable specification" that constrains what gets built. Their accuracy is a requirements quality concern, not just a documentation hygiene concern.
What I verified
Requirements completeness:
The route tree expansion brings the documented surface area of the application into alignment with its actual surface area. Before this PR,
geschichten/,stammbaum/,enrich/,users/[id]/were deployed features with no documentation entry — effectively invisible to any requirements or planning work done from CLAUDE.md. This is a gap closure, not just cleanup.Traceability concern (observation, not blocker):
users/[id]/(public user profile page) was added silently — it appears in neither the PR description nor any previously documented requirement. From a requirements perspective: what is the spec for this page? Who can see it? What data does it surface? If this route was built without a Gitea issue, that's a traceability gap worth closing retroactively. A short issue describing the page's purpose and access rules would prevent ambiguity in future work on this route.Brand token table as a design constraint:
The revised table now correctly distinguishes
brand-navy/brand-mint(Tailwind utilities — usable in markup) from--palette-sand(CSS variable — not a utility, usebg-canvas/bg-surfaceinstead). This is exactly the kind of constraint that should be in a requirements document: it tells implementers what they may and may not do without explaining why the constraint exists. The "why" (no Tailwind utility registered for sand) could be added as a parenthetical, but it's not required.Minor: PR description missing
users/[id]addition:The PR summary doesn't list the
users/[id]/route addition. For traceability (someone reading git history to understand when this route was first documented), a brief mention would help.No blockers from a requirements perspective.