Add design/ contract; archive prior design system as provenance

Establish keysat's durable, vendor-neutral design contract (the standards
/design backfill, document-as-is):

- design/DESIGN.md — nine-section brand brief distilled from the prior
  Claude Design system (navy-on-cream-paper identity, sovereignty-first
  voice, component + motion rules, do's/don'ts). Manrope is canonical
  display (the README's "Archivo" was a stale placeholder).
- design/tokens.tokens.json — W3C DTCG tokens from colors_and_type.css.
- design/brand/ — canonical palette.css + logo/mark assets.
- design/_imports/2026-06-16-claude-design-system/ — the original system,
  relocated as dated provenance (nothing imported it).
- AGENTS.md — add the Design line (read the contract before UI work);
  repoint the layout entry.
- ROADMAP.md — design-checker cleanup backlog (gold-as-fill + pill-radius
  blockers, the inline-token-copy consolidation, token gaps).
This commit is contained in:
Keysat
2026-06-16 11:29:28 -05:00
parent ce5edaed29
commit 532229d488
51 changed files with 700 additions and 1 deletions
@@ -0,0 +1,29 @@
# Keysat — Dashboard UI Kit
The creator's admin panel. Runs on the creator's own Start9. Manages products, policies, license keys, customers, discount codes, and the audit log.
## Files
- `index.html` — entry view (Overview / dashboard home).
- `licenses.html` — license list, with row-level actions.
- `license-detail.html` — single license: certificate-style header, customer info, audit timeline, revoke action.
- `new-product.html` — create-product flow (product details + policy + price).
- `signin.html` — admin sign-in (paste admin API key).
## Components (inline in each page)
- **Sidebar** — wordmark, primary nav (Overview, Products, Licenses, Customers, Discounts, Audit, Settings), BTCPay connection status footer.
- **Topbar** — page title, breadcrumb, primary action button, search.
- **Stat cards** — KPI tiles (active licenses, sales 30d, sats earned).
- **Table** — license list, customer list. 52px rows, mono key column, status badge column.
- **Drawer / detail header** — certificate motif borrowed from the marketing hero.
- **Empty state** — gold-bordered cream card with a single Lucide icon.
## Iconography
Lucide via CDN. Stroke 1.75px, 18px in nav, 16px inline.
## Disclaimers
- The "Settings" tab from the user's brief was scoped down to **operator settings** (operator name, public key, BTCPay connection). Payouts removed because BTCPay handles money.
- All data is fake.