@galaxyproject/brand-tokens
v0.1.0
Published
Canonical Galaxy brand design tokens (CSS custom properties) for Galaxy web properties.
Readme
@galaxyproject/brand-tokens
Canonical Galaxy brand design tokens -- the color palette and font stack shared across Galaxy web properties (the Hub, the Keycloak login/email theme, and more).
What's here
src/theme.css-- the single source of truth: a Tailwind@theme {}block with the semantic--color-galaxy-*aliases, the five IWC 50-950 scales (bay-of-many,ebony-clay,gold,chicago,hokey-pokey), background surfaces, accent vars, and--font-sans.dist/theme.css-- published@themeform, for Tailwind consumers.dist/tokens.css-- published:rootform, generated from the source, for plain-CSS consumers.DESIGN.md-- the canonical base Galaxy design system that brand properties build on.
Consuming it
Tailwind (e.g. galaxy-hub):
@import 'tailwindcss';
@import '@galaxyproject/brand-tokens/theme.css';Plain CSS / no build (e.g. galaxy-keycloak-theme): fetch the :root flavor
from jsdelivr at a pinned version:
https://cdn.jsdelivr.net/npm/@galaxyproject/[email protected]/dist/tokens.cssDeveloping
src/theme.css is the only file you hand-edit. Run npm run build to
regenerate dist/. CI fails if dist/ is out of sync with the source.
