Skip to content

desktop: Soft Tactile foundation — tokens, Figtree, brand logos, icons, shared kit - #440

Open
plombeer31 wants to merge 7 commits into
atagdesktopfrom
facelift/1-foundation
Open

plombeer31 wants to merge 7 commits into
atagdesktopfrom
facelift/1-foundation

Conversation

@plombeer31

Copy link
Copy Markdown
Collaborator

Soft Tactile, slice 1 of 9: the base every other facelift PR builds on. Tokens, type, logos, icons and a shared component kit. No screen is redrawn here; the regions change look only through the kit and the token bridge.

What changes

  • Tokens in the app's --p-* / --i-* architecture: --well ground, --lift surfaces, --tint, green --success, --amber-text, --reasoning, soft shadows (--sh-card, --sh-pop, --sh-comp), washes (--hover, --brand-wash, --amber-wash, --critical-wash), glass and indigo inks, the radius scale, one easing curve. The legacy bridge (--bg-*, --text-*, --accent-wash, --warn, --danger…) now points at Tactile values. Both dark blocks still only re-point names.
  • Type: Figtree variable (latin + latin-ext) first in --font-ui, Inter kept second for Cyrillic. OFL texts for Figtree, Inter and DM Mono ship beside the fonts and are listed in THIRD-PARTY-NOTICES.txt.
  • Brand logos: 29 marks in renderer/logos/ (LobeHub icons, MIT; the AI/ML API mark from aimlapi.com) with modelLogoKey, providerLogoKey, logoHTML, modelMark, providerMark. Always on a white round badge; server or CPU icon where a provider or model has no mark.
  • Icons: the Tactile set at 1.75 stroke with round caps. Every 0.5.5 icon name still resolves; 50 names added.
  • Stylesheet split by region: styles.css holds tokens, base and the shared kit (buttons, keycaps, segmented control, chips, dots, inputs, switches, lists, tables, plates, menu items, notices, modals, hint strips). Region rules moved verbatim into css/{shell,overlays,popovers,chat,composer,onboarding,settings,settings-data,settings-llm}.css so each region can be redrawn in its own PR.
  • Settings helpers tuiBtn, tuiHints, restartLine draw kit markup (every hint is a button; the restart line is a notice with the Restart Agent Runtime button).

Tests

  • smoke: reads every renderer stylesheet instead of styles.css alone (rendererCssText()).
  • visual.drive.mjs: checks Figtree for Latin and Inter for a Cyrillic sample.
  • drive-selector-lib.mjs: launches with a throwaway --user-data-dir, so a driven run can no longer share the installed app's profile.

Verified

  • Token check on styles.css + css/*.css: no literals after the token section, every var() declared, dark blocks identical.
  • Smoke against a scratch copy of a configured state (settings version set to the build's 49, --user-data-dir isolated): same result as a0811bc3 on the same fixture — 497 pass, the same 4 known failures (llm tab … [downloaded], state-dir import keys, backend round-trip to local, switch timings selectLocalModel not exercised).
  • Window paints in light and dark at 1470×923 and 940×620; no renderer errors.

Merge order

1 (this) → then the slice PRs in any order: shell, overlays, composer, popovers, transcript, onboarding, settings frame, settings data tabs, settings LLM. They touch separate CSS files and separate renderer functions; facelift/integration has all of them merged and is the build to try.

…s, shared kit

Tokens: the Tactile palette in the app's --p-*/--i-* architecture (well,
lift, tint, success, amber-text, reasoning, soft shadows, washes, glass and
indigo inks), radius scale, one easing curve. The legacy bridge now points
at the Tactile names, so every 0.5.5 rule inherits the new ground, lift and
tints at once.

Type: Figtree variable (latin + latin-ext) with Inter kept second for
Cyrillic; OFL texts for Figtree, Inter and DM Mono shipped beside the fonts
and listed in THIRD-PARTY-NOTICES.

Logos: 29 model/provider/import marks in renderer/logos with
modelLogoKey/providerLogoKey/logoHTML/modelMark/providerMark — always on a
white round badge, server or CPU icon where there is no mark.

Icons: the Tactile set at 1.75 stroke with round caps; every 0.5.5 icon
name still resolves.

Stylesheet: styles.css is tokens + base + the shared kit (buttons, keycaps,
segmented, chips, dots, inputs, switches, lists, tables, plates, popover
items, notices, modals, hint strips). Region rules moved verbatim into
css/{shell,overlays,popovers,chat,composer,onboarding,settings}.css so each
region can be redrawn on its own; the kit replaced the uppercase micro
labels, 2px radii and 3px rules it covered.
The stylesheet is split by region now, so a rule the smoke looks for on
disk (.poprow.dim, the message-action hover reveal) can live in any file
index.html links. rendererCssText() reads them in load order.
…heme

The brand wash is one colour-mix in both themes, so the sidebar toggle's
ground read identical in light and dark and the smoke's item 2 contract
(the on state follows the theme) broke. --tint is Tactile's soft blue wash
with a value per theme.
With Figtree first in the UI stack, Inter is only fetched for Cyrillic, so
asking the loader about Inter with no sample reported a missing face that
was never needed. Load a Latin and a Cyrillic sample and check both, plus
DM Mono.
Without --user-data-dir, electron . shares the installed app's profile
under ~/Library/Application Support/Atomic Agent, so a driven run could
write the operator's prefs.json and fight their open window for it.
…in dark

White on the dark theme's #FF6A5C is about 2.9:1; --on-fill is white on the
light critical (5:1) and near-black on the dark one.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant