refactor: move the homepage layout into the shared stylesheet - #24
Merged
Conversation
index.html carried a 478-line <style> block with its own token set (--bg, --surface, --border, --navy, --body, --muted, --red, --blue, --green, --amber, --purple, --orange), which the .agentrust-hub rules in design-system.css then repainted with the editorial --at-* tokens. Two palettes for one estate, and 64 declarations painted twice. design-system.css already states the intent: "Every standalone page under agentrust-io.com opts in with <body class="at-page"> and then writes no CSS of its own." The homepage was the one page still writing its own. - Every rule from the inline block is now scoped to .agentrust-hub and sits in design-system.css, immediately above the editorial layer that refines it, so the cascade order the page relies on is unchanged. - The twelve private tokens map onto the shared ones. --red, --navy and --blue were already byte-identical to their --at- counterparts, and --green and --amber matched --at-pass and --at-warn. --purple and --orange had no equivalent and are now named --at-purple and --at-orange in the shared token block. - 64 declarations the editorial layer restates are removed. They were dead: painted in index.html, painted again in design-system.css. - .hero p carried color: rgba(255,255,255,0.68) from the navy hero that preceded the editorial design. Scoping the rule raised its specificity enough to shadow the accent on .hero-eyebrow, so the dead colour goes. - scroll-behavior: smooth was on a bare html selector inside the page's own stylesheet. Moved as-is it would have newly changed anchor scrolling on all six MkDocs sites, so it is scoped to the hub. index.html goes from 1262 lines to 783 and now carries no CSS at all. Verified rendering-identical: 501 elements compared across 31 computed properties plus measured width and height, before and after, same origin. Zero differences. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_013EQx4N5BzTQbY8kvXUsdkY
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
design-system.cssalready states the intent:The homepage was the one page still writing its own. It carried a 478-line
<style>block on a second token set (--bg,--surface,--border,--navy,--body,--muted,--red,--blue,--green,--amber,--purple,--orange), which the.agentrust-hubrules indesign-system.cssthen repainted with the editorial--at-*tokens. Two palettes for one estate, and 64 declarations painted twice.What changed
.agentrust-huband moved intodesign-system.css, immediately above the editorial layer that refines it, so the cascade order the page relies on is unchanged.--red,--navyand--bluewere already byte-identical to their--at-counterparts, and--green/--ambermatched--at-pass/--at-warn.--purpleand--orangehad no equivalent and are now--at-purple/--at-orangein the shared token block.index.html, painted again indesign-system.css..hero pcarriedcolor: rgba(255,255,255,0.68)left over from the navy hero that preceded the editorial design. Scoping the rule raised its specificity enough to shadow the accent on.hero-eyebrow, so the dead colour goes.scroll-behavior: smoothsat on a barehtmlselector inside the page's own stylesheet. Moved as-is it would have newly changed anchor scrolling on all six MkDocs sites, which have Material's own behaviour, so it is scoped to the hub.index.htmlgoes from 1262 lines to 783 and carries no CSS at all. Total across both files is unchanged, which is the honest number: this consolidates and de-duplicates rather than deletes.Verification
Not eyeballed. The pre-refactor
index.htmlanddesign-system.csswere served from the same origin alongside the new ones, and 501 elements were compared across 31 computed properties plus measured width and height. Zero differences. The.at-pagelayer and the MkDocs surfaces are byte-identical to before, so the other four site pages and all six docs sites are untouched.Opening this as a PR rather than pushing to
main, per the branch ruleset on this repo.🤖 Generated with Claude Code
https://claude.ai/code/session_013EQx4N5BzTQbY8kvXUsdkY