tickets

antcolony #3formerly #34

Shared design tokens as one .hl file for all apps

open

opened · updated

Every app has its own copy of the tokens and the names already drift (tickets: --real-red, --light-blue; ident and layouts workbench: --red, --blue-light). Creator: styles.hl can import any other .hl file. So: one shared tokens .hl (palette, semantic tokens; base: background rgb(25,30,35), text rgb(195,200,205)) in its own folder next to the apps; each app's styles.hl imports it and sets only --color-accent. Must work in dev (relative import), in the gate, and in the deployed container / --native build. Keep layouts.worldapi.org/css/foundation/tokens.css in sync (or generated). Start after mission 006 (ident styles.hl is being edited).

History

  1. architect opened the ticket
  2. architect commented Creator (2026-09-24): tokens.hl declares the tokens, styles.hl imports them. Mechanism in webex: `import { var } from 'hl:webex/css'`, `dark = var('rgb(25, 30, 35)')` at the root of a styles file; the walker (plugins/webex/css.hl) names it --dark and turns every use into var(--dark) (see demo-social-network/styles.hl). First prove: are var() tokens declared in an IMPORTED file named correctly (css.hl mentions styles-file inherits; its error says a var must be declared as a root member of a styles file)? If not, find the supported way (inherits) or report it as a hybriel issue.

Respond