Skip to content

v0.28.0 — Axes you can read

Choose a tag to compare

@donkanishka donkanishka released this 17 Aug 02:28
· 57 commits to main since this release
6586382

The type tester's variable axes rebuilt around Etch's own slider, and nine more faults found by pointing at the panel one screen at a time. Two of the fixes are things the measuring found rather than things that were reported.

Added

  • The trash is in the sidebar at all times. It used to appear only once a family had been thrown away, so the one place a deleted family can be recovered from was missing from the sidebar exactly while somebody was looking for it, and the column changed length under the pointer. Restoring the last family no longer throws you out to the Library either, and the view now answers with an empty state instead of a "Restore all (0)" and a grid of no cards.

Fixed

  • A primary button turned into the pane behind it under the pointer. The hover threw the accent fill away for the raised surface, which measures 1.24:1 against the pane the button sits on, so the button effectively dissolved. It now does what Etch's own primary does: keeps hue and chroma and drops the lightness to .71, exactly how --etch-primary-hover is defined in the builder bundle. Measured on the default accent, rgb(54,54,58) becomes rgb(149,177,0), 6.07:1 against the pane, with the dark label clearing AA at the same ratio.
  • The clear button inside a field lit up brighter than the buttons beside it. A 12% wash against the 10% every other ghost control uses. Measured in one toolbar: rgb(68,68,71) against rgb(63,63,66) an inch away. Both are rgb(63,63,66) now.
  • A fallback that disagreed with Etch: --e-space-l carried a 20px fallback where Etch defines it as 16px. Found while opening the sections up, not reported.

Changed

  • The variable axes, rebuilt. The sliders were the browser's own control tinted with accent-color; they are now Etch's slider, taken from .compression-slider in the builder bundle. Sampled across all three sliders in the panel: zero accent pixels, and only three colours present.

    Each axis was a 1fr column, so an axis stretched to half the pane while its slider stayed 120px and its value sat parked a few hundred pixels away, reading as though it belonged to the axis beside it. The column is capped at 260px, the slider fills it, and the value sits over the end of its own track. 75 – 100 · default 100 is gone: the two ends of the range sit under the two ends of the track, and the default is drawn as one of the graduations Etch puts under its own slider, positioned along the thumb's travel so it meets the thumb rather than drifting.

    Reset axes sits with the sliders instead of in a row of its own, and is inert until an axis has been moved. font-variation-settings moves onto the copyable well the CSS variable already uses, hugging its own text rather than spanning the pane.

  • A family name on a card no longer answers in the accent. Hover swapped it to the accent and added the browser's underline. Measured across Etch's bundle, nothing there recolours text to the accent on hover. The name brightens and an arrow fades in beside it, the same arrow the detail view uses to come back. The arrow is held in the layout rather than inserted, so the row cannot reflow: 62.68px at rest and 62.68px on hover. Its hint moved from a native title to the panel's own tooltip.

  • "View on Google Fonts" is a control. It was the only element in the panel not shaped like one: muted body text in its own paragraph, drawing in the browser's default blue and then the visited purple. It takes the outline button every other secondary action uses and stands beside Install.

  • The Library and the trash answer with a real empty state, the shape Etch's Assets Library uses and the Upload screen already followed: filling the pane, centred, 24/600 over 14/1.25 muted. The Library also offers both routes now rather than naming two and providing one.

  • Sections have room in them. The box was inset at 12px with a 12px gap and its description pulled up to 4px under the heading band. Both take 16px, and the pull is gone.

  • An "Install options" band in the type tester, and the Loading behaviour menu is capitalised (the stored CSS keyword is unchanged).

Removed

  • The Variable tooltip on a Google Fonts card. It was the wrapping variant, so it opened downward across the Subsets row and covered the chips the reader was on their way to. The type tester still spells it out as visible text.

Translators

Four new strings: variableAxes, installOptions, trashEmpty, trashEmptyHint. fontDisplayHint is reworded for capitalisation. axisDefault is removed, since the axis default is drawn rather than written.