docs-app styling pass: hero, themed demo cards, dark/light polish - #23
Merged
NullVoxPopuli merged 4 commits intoJul 21, 2026
Merged
Conversation
…rols - landing: '@universal-ember/' eyebrow over a large boxed 'form' display title (echoing the family look), pill call-to-action, centered responsive blurb/features (fixed 50%/66% widths replaced with max-widths) - every live demo now renders in a bordered light-dark() card (.repl-sdk__demo — ember-repl's wrapper — plus the older .glimdown-render for good measure); demo inputs/selects/textareas and buttons get explicit light-dark() colors instead of forced black text, which was illegible on dark backgrounds - note: do not set 'color-scheme: light dark' on individual controls — it re-enables OS preference and defeats the site's forced scheme - theme-aware hr Verified in the browser in both themes (landing, docs pages, demos); docs-app page-walk/a11y suite passes. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
…pill The scaled InternalLink with docs-support's offset-underline treatment is the universal-ember signature (same as ember-primitives); the pill button read as generic. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Contributor
|
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
2 participants
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.
A styling/layout pass over the docs site, verified in a real browser in both themes (landing + docs pages + interacting with demos). Deliberately stays inside the universal-ember family language — no generic component-library look.
Landing
@universal-ember/eyebrow over a large boxed form wordmark — echoing ember-primitives' boxed logo treatment.InternalLinkwith the offset-underline style, scaled — same as primitives. (An earlier iteration used a pill button; reverted as too generic.)max-widthlayout withtext-wrap: balance, so it holds up on narrow viewports.Demos
light-dark()card (targeting.repl-sdk__demo, ember-repl's wrapper — the table-era.glimdown-renderstyles never matched, which is why demos floated unstyled in the prose).color: black(table-era carryover) — illegible on dark backgrounds. Now inputs/selects/textareas/buttons have explicitlight-dark()colors in both themes.color-scheme: light darkon individual controls — it re-enables OS preference resolution and defeats the site's forced theme (made inputs render light inside dark mode).Also
hr.Related, in docs-support
A separate small PR to ember-primitives is coming for the side-nav active-highlight not matching
.md-suffixed URLs (every prose cross-link produces them, which silently drops the nav highlight) — that one benefits primitives/table/form alike.🤖 Generated with Claude Code