Chat chrome: one gutter, one radius scale, one even glass recipe
The header and composer were full-bleed bands (flush to the top/right/bottom viewport edges, composer corners off-screen) next to a rail that floats with a 12px margin. The new --layout-gutter (12px) spaces the rail, header, empty-state card and composer identically on every side; --radius-panel/-control/-chip (-pill) replace the ad-hoc radii across the shared classes, so every panel is rounded on all four corners and shared controls match in every theme. The desktop-only ::after hairlines and the left-corner-only radius are gone. Aero: the rail and the chat chrome (answers included) share one even recipe - the wallpaper extra-blurred into a hue-free wash (background-glass.webp) under a uniform ~50% white veil and a whisper of gloss. Measured within ~10 RGB units across the rail top->bottom and the card/composer left->right; the blue->green smear and the teal composer are gone. The composer's field is a clean even tile with no wallpaper gradient inside it. Chat fixes: send is a filled primary tile shaped exactly like attach (dimmed while the input is empty), suggestion/context chips use the shared .chip token (40/44px target, visible rim, full-contrast text, raw model id in the tooltip), the AI note reads at 12px --text-muted (.ai-disclaimer), the selected sidebar row carries the accent border + accent icon, the theme toggle is back in Aero (the moon flips to Dark; Settings brings Aero back), and the empty state is centered exactly between header and composer. Outside CSS: the wallpaper's top-left HUD-circle decoration (it peeked through the 12px gutters on wide windows) was healed out of background.webp and background-blur.webp; the orbs/bubbles ride one masked .ice-floats layer that fades them under the chrome bands and the rail strip, so none is sliced by a panel edge (still parked under reduced motion). Version 0.6.0, SW -> freezmo-v82. Tests: chat suite pins the new geometry (12px gutter, 24px corners, even wash on all four panels, send-vs-attach shape, chips/input radii); mobile pins the phone chrome and the Aero toggle; bubbles pins the floats layer + its reduced-motion opt-out.
This commit is contained in:
parent
8153fc8dae
commit
786d6cf1ae
21 changed files with 562 additions and 290 deletions
33
README.md
33
README.md
|
|
@ -1423,6 +1423,39 @@ Things I chose while building, with the reasoning:
|
|||
(measured: 268..1280 at a 1280 window) — a flat pane floating 40px inside the scene read as
|
||||
"cut off next to the sidebar".
|
||||
|
||||
91. **The chat chrome floats: one gutter, one radius scale, one glass recipe.** The header and
|
||||
the composer were full-bleed bands inside the main pane — flush to the viewport's top, right
|
||||
and bottom edges, with the composer's bottom corners cropped off-screen — while the rail
|
||||
floated with a 12px margin. `--layout-gutter` (12px, the rail's own inset) now spaces the
|
||||
rail, the header, the empty-state card and the composer identically on all four sides, and
|
||||
the radius scale (`--radius-panel` 24px, `--radius-control` 14px, `--radius-chip` 12px,
|
||||
`--radius-pill`) replaced the ad-hoc values across the shared classes (`.card`, `.glass-panel`,
|
||||
`.sidebar-surface`, buttons, nav rows, `.segmented`, chips), so every panel is rounded on all
|
||||
four corners and shared controls match in every theme. The desktop-only `::after` hairlines
|
||||
and the left-corner-only radius of decision 87 are gone.
|
||||
|
||||
In Aero the rail and the chat chrome (answers included) share **one even recipe**: the
|
||||
wallpaper, extra-blurred into a hue-free wash (`background-glass.webp`), under a uniform
|
||||
~50% white veil and a whisper of gloss. Measured: the rail top→bottom and the card/composer
|
||||
left→right stay within ~10 RGB units (the old rail ran clear blue into a muddy green smear,
|
||||
and the composer picked up the river's teal). Chat-specific fixes: **send** is a filled
|
||||
primary tile shaped exactly like attach (dimmed while the input is empty — it used to be a
|
||||
pale outline that read as disabled), the suggestion/context **chips** use the shared `.chip`
|
||||
token (40px target, 44px on phones, visible rim, full-contrast text, the raw model id in the
|
||||
tooltip), the AI note reads at 12px `--text-muted` (`.ai-disclaimer`), the sidebar's selected
|
||||
row carries the accent border + accent icon (it looked like one more tinted action button),
|
||||
the **theme toggle** is back in Aero — the moon flips to Dark, the Settings picker brings Aero
|
||||
back — and the empty state is centered exactly between the header and the composer (the
|
||||
trailing spacer only exists under a conversation now). Three fixes live outside CSS: the
|
||||
wallpaper's **HUD-circle decoration** in the top-left corner (it peeked through the 12px
|
||||
gutters on wide windows and read as a glitch) was healed out of `background.webp` and
|
||||
`background-blur.webp`; the orbs and bubbles ride one masked `.ice-floats` layer that fades
|
||||
them out under the chrome bands and the rail's strip, so none is sliced by a panel edge (still
|
||||
parked under reduced motion); and the panel shadows/highlights come from the shared glass
|
||||
tokens. The chat suite pins the geometry (12px gutter on all sides, 24px corners, the even
|
||||
wash on all four panels, send-vs-attach shape, chips/input radii) and mobile pins the phone
|
||||
chrome plus the Aero toggle.
|
||||
|
||||
90. **Copy pass on the shell (`lib/i18n-dict.ts`).** A user-authored wording pass: the library heading
|
||||
is now "Your freezer" (matching the Czech "Tvůj mrazák"), the key gate's subtitle speaks about
|
||||
grades ("První krok k dobrým známkám"), and several Czech strings read more naturally ("Schovat /
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue