Repository navigation
Replace the site theme with the Aurora design system - #21
Merged
Merged
Conversation
All five pages are rebuilt on translucent panes floating over a lit aurora field. main.css carries the new tokens, fonts and pane classes; mint is now reserved for measurement. The header is a floating pill with a slide-over menu below sm, which the wrapped mobile nav lacked. ChapterWaveform gains hover-replay and theme-driven colours so the illustration follows the mode. Dark mode is kept as a second designed scene rather than an inversion of the light one.
The chapter meter and its output chips are now one pane instead of two. The converter's preserved list becomes one chip row, taking about 90px off that column. The how-it-works trio now staggers upward to the right so its shallowest card sits under the form. The idle gap under the form drops from 149px to 107px, and closes entirely once a file is chosen.
Accepts, Up to and Link expires are joined by a fourth fact, Cost — free, no account. Four items also balance the row, which now grids two-up on phones instead of wrapping raggedly.
The file is a 512x512 PNG served at the .ico path, which browsers resolve by sniffing content.
Full length joins chapters, cover art and tags, in the same chip style as the others. Chip padding and gap tighten so all four fit one row in the left column above 1280px. The cost fact on both upload pages shortens to Free.
The queued, processing and terminal panes now replace the upload form in the right-hand column. They previously rendered full width under the hero grid, leaving the form column empty. Sticky positioning applies only to the form, since a terminal job's stack can exceed the viewport. Upload errors and the start-over control now follow the form they belong to.
Replaces the PNG that carried the .ico extension, so clients that require a genuine ICO can read it.
mint-600 reached only 3.75:1 behind the darkest composited pane, below the 4.5:1 small-text floor. The secondary alias moves to mint-700 (5.4 to 6.1:1) and dimmed text to #63697d (4.8:1 worst case). Comments on both tokens record the constraint so neither is lightened without re-measuring. Dark mode already cleared AA and is unchanged.
The route watcher never fired for a same-route tap, so the slide-over stayed open on screen. Every link now closes it on selection, and the watcher still covers navigation without a tap. Privacy moves into the shared nav list, so it gains the active styling the copied link lacked. The footer reuses that list too, removing the duplicate definition the drift came from.
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.
Replaces the "Night & Paper" theme with Aurora: translucent panes floating over a pale field lit by a soft aurora of blue, violet and mint. Every page, the shared chrome and all form/job components are converted; no product copy, behaviour or API surface changes.
The system
app/assets/css/main.css—irisprimary (actions),mintsecondary (reserved for measurement: meters, counts, timings),duskneutral,azureopening the waveform ramp.app.config.tsrepoints Nuxt UI's aliases.@nuxt/fontsfrom the family names in CSS, so there is no external stylesheet and no CSP allowance needed..paneclass plus-quiet,-front,-pill,-lift,-settlevariants.--ui-bgdeliberately stays opaque so inputs, menus and dialogs read crisply; translucency belongs to page-level panes.Fixes made along the way
smthey now move into aUSlideoversheet (focus trap, escape and scroll lock come from the component) that closes itself on navigation./and/convert. Fixed by folding the meter and its output chips into one pane, tightening the converter's preserved list into a chip row, and pointing the how-it-works diagonal upward to the right so its shallowest card sits under the form. Idle gap is now ~107px and closes entirely once a file is chosen.Verification
npm run format,lint,type-check, all 118 tests, and a fullnpm run buildpass. Every page was inspected at 1440px and 390px in both colour modes, plus the open mobile menu, with no console or page errors. The built output carries both token sets and six self-hosted woff2 files.Notes for review
public/favicon.icois a 512x512 PNG (105 KB) served at the.icopath rather than a true ICO container. Browsers resolve it by sniffing content, so it renders, but it is ~13x the previous file and will not work anywhere a real ICO is required.DESIGN.md(which documents this system as built) andPRODUCT.mdare intentionally not part of this branch.