Repository navigation
Releases
Releases · SpaceWorks-Labs/SpaceWorks-Design-System
Space Works Design System v2.1.1
Space Works Design System v2.1.1
A QA patch on v2.1.0: a full audit of the 157-page site and 13 standalone demos at 390, 768, 1280 and 1680 px in light and dark. No token, class, path or component contract is removed or renamed.
Fixed surfaces keep their own look
- A light demo card on a dark page showed blank logo marks (loader, inline sizes, logo); a dark card on a light page showed both artworks. Marks on themed cards now carry the kit's forced ground (
g-light/g-dark) and stay in step when a demo switches theme. - Themed cards, logo stages and mascot frames keep their own focus ring and Play controls instead of the page theme's (a citron ring on a cream frame measured 1.03:1).
Text
- Em and en dashes, ×, · and curly quotes written as
?in v2.1.0 are restored in 27 files (wording unchanged). - Dated current-release notes on the home page, What's new in v2.1, the README and the migration guide; the header badge links to the notes for the version it shows.
Accessibility and layout
- Theming demo radios: one tab stop, arrow keys, announced status (DSA-010).
- Task-list checkboxes are named; tables that scroll sideways on phones are keyboard-reachable; Play/Pause previews drop the contradictory
aria-pressed. - Every standalone demo shows the brand focus ring; the install command no longer pushes the page sideways on phones; preview posters never upscale; the route-transition mock page no longer skips a heading level.
Rules
- Product rules §2.5 — release images are the frontend and the backend only; bundled object storage is Silo, or any S3-compatible store (SW-433).
- Product rules §12.3 — one README structure for every repository (SW-436).
New guards
scripts/check-box-grounds.mjs— every logo mark, both page themes, every demo theme switch.scripts/check-site-qa.mjs— fixed surfaces, contrast, focus, overflow, scroll regions, images, targets, names, outline, widgets, reduced motion on every page and demo.scripts/check-encoding.mjs— lost characters; runs in the site build.- Lessons 42 and 43.
Brand guidelines PDF attached (unchanged from v2.1.0).
Space Works Design System v2.1.0
Space Works Design System v2.1.0 (additive on v2.0.1).
- Audit fixes and 42 new pages: components, adoption, accessibility, current rules, voice, tokens, motion flow.
- New logo animation SW-412 (closed orange lid, flap-by-flap opening); black-and-white marks stay cream on black.
- Product rules 12.1 and 12.2; README screenshots gallery; brand guidelines v2 PDF rebuilt (50 pages, attached).
- Fix:
SearchField.tsxno longer importsSearchField.css; import it from your root stylesheet after@import "tailwindcss"(it opens@layer components).
Pin it: git -C design fetch --tags && git -C design checkout v2.1.0.
Space Works Design System v2.0.1
Space Works Design System v2.0.1 — a patch on v2.0 (ships alongside SpaceWorks 0.12.0).
Logo closed state (SW-389)
- The shut box shows all four flaps in the logo's own colours in both themes: top-left and bottom-right green, top-right and bottom-left orange — the same arrangement as the open mark. Each flap keeps its colour through the whole fold. Mono and forced-colour variants keep four distinct regions.
- Kept from v2.0: no holes in any frame, correct overlap order, rest frame = static logo, reduced motion = static logo.
scripts/check-box-frames.mjschecks the four regions by position; lesson 40 explains why counting colours is not enough.- Regenerated:
motion/box-open/CSS, markup, demo and React copies; all box-open previews (previews.lock.json); the brand guidelines v2 PDF and its page images (animation strips).
Rule: every project has its own landing page and feature docs (SW-405)
docs/product-rules.md§12.1: every project except the Android/iOS apps has its own landing page (with its GitHub, release/install, docs, licence and changelog links) and its own in-product feature docs, built from this design system. The separate SpaceWorks-Docs site is retired; docs live in each repository.
Checks
check-box-frames: rest = static logo, shut = 2 orange + 2 green, no holes (0 px) in every variant.check-previews: up to date. Brand PDF: 50 pages, fonts verified.- Site build: 109 pages, all internal links valid.
🤖 Generated with Claude Code
Space Works Design System v2.0
Space Works Design System v2.0. It ships alongside SpaceWorks 0.12.0.
- Brand guidelines v2: a 50-page PDF,
brand/space-works-brand-guidelines-v2.pdf. - Site: reorganised, with every page kept: https://spaceworks-labs.github.io/SpaceWorks-Design-System/
- Dark palette: solid black. The bright brand colours stay the same in both themes, charts included.
- Logo: opens on hover and focus. The animation now has no holes in dark, and the shut box shows one orange face.
- Motion: a template and preview for every animation in the product.
- Rules: org-wide product rules covering tests, CI/CD, API docs, and decisions plus handover. Pipelines, versions and releases are covered per stack.
- Decisions log: every decision recorded with its reason.