cjm-design-system

A design system as data (ruling a439c226): token schema v1 with its check and its headless resolution into one flat vocabulary, the CSS custom-properties projection for the web, the vendored seed systems Classical and Netrunner with their OFL fonts, and the importer for a web-first system's CSS. Nothing here imports Qt, so a web build never needs PySide6; the Qt kit (cjm-substrate-qt-kit) consumes the same tokens and keeps only what Qt reads. Born out of the kit by design 0858bbd0, the theme half of the public-site redesign build 8079ae0f.

Modules

• cjm_design_system.__init__ — A design system as DATA (ruling a439c226): one canonical tokens file per
• cjm_design_system.systems.__init__ — The design systems this library ships as DATA (ruling a439c226): one
• cjm_design_system.tokens — Token schema v1 — a design system as DATA, resolved headlessly (ruling
• cjm_design_system.tools.__init__ — Design-system tools (run as modules):
• cjm_design_system.tools.build — Build the static web projections of a design system: the CSS
• cjm_design_system.tools.css_to_tokens — Import a web-first design system's CSS into a schema-v1 tokens file.
• cjm_design_system.web — The web projections of a design system beyond the CSS variable layer (design

API

cjm_design_system.systems.__init__

• available function — Every vendored system slug (a directory carrying a tokens.json).
• locate function — The directory of a system: a vendored slug, a directory holding a
• tokens_path function

cjm_design_system.tokens

• SchemaError class — A tokens file that violates schema v1 — every problem listed, so one
• check function — Refuse a malformed system loudly: every missing / mistyped field named
• load function — Read a tokens file (JSON). check it before resolving anything.
• mix function — Flatten fg at opacity t over bg -> a solid hex (QPalette, painters,
• mode_for_scheme function — The mode the system maps an OS scheme ("light" / "dark") onto — None
• modes function
• resolve function — tokens + mode -> the flat vocabulary every projection reads: the QSS
• rgba function — QSS rgba() with a 0-255 alpha (the form every Qt 6 version parses).
• slug function — The system's file-system / preference slug: lower-case, spaces -> dashes.
• to_css function — The CSS custom-properties layer for a system — the ruling's second
• to_hex function

cjm_design_system.tools.build

• main function

cjm_design_system.tools.css_to_tokens

• convert function
• darker function
• family function
• main function
• parse_root function
• px function
• ramp function

cjm_design_system.web

• bootstrap_defaults function — Bootstrap's variables for one mode, every value read from resolve(tokens, mode):
• font_files function — The files a system's tokens name, resolved the way the Qt kit registers them.
• format_ranges function — Code points -> the shortest CSS unicode-range list naming exactly them.
• parse_ranges function — A CSS unicode-range list ("U+0000-00FF, U+0131") -> the code points it names.
• sha256_file function
• theme_rules function — The rules the variables cannot carry: the per-level heading weights the type scale names
• theme_scss function — One Quarto theme file for one mode of a system.
• web_fonts function — Convert each font file into woff2 subsets by unicode range and return the @font-face

Dependencies

Used by: cjm-context-graph-projection, cjm-substrate-qt-kit