grant/keysat-root
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
532229d4884505ee422232c4ba4b482f6b5023a8
keysat-root/design/_imports/2026-06-16-claude-design-system/ui_kits/dashboard/index.html
T
Keysat 532229d488 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).
2026-06-16 11:29:28 -05:00

116 lines
7.2 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Keysat — Overview</title>
<link rel="stylesheet" href="../../colors_and_type.css">
<link rel="stylesheet" href="dash.css">
</head>
<body>
<div class="app">
<aside class="sidebar">
<div class="brand"><img src="../../assets/keysat-mark.svg" alt=""><span>Keysat</span></div>
<a class="nav active" href="index.html"><i data-lucide="layout-dashboard"></i>Overview</a>
<a class="nav" href="#"><i data-lucide="package"></i>Products<span class="count">3</span></a>
<a class="nav" href="licenses.html"><i data-lucide="key-round"></i>Licenses<span class="count">42</span></a>
<a class="nav" href="#"><i data-lucide="users"></i>Customers<span class="count">38</span></a>
<a class="nav" href="#"><i data-lucide="tag"></i>Discount codes</a>
<div class="group-label">System</div>
<a class="nav" href="#"><i data-lucide="scroll-text"></i>Audit log</a>
<a class="nav" href="#"><i data-lucide="webhook"></i>Webhooks</a>
<a class="nav" href="#"><i data-lucide="settings-2"></i>Settings</a>
<div class="footer"><span class="dot"></span><div><div style="color: var(--cream-50); font-weight: 600">BTCPay connected</div><div>store: aurora-software</div></div></div>
</aside>
<main class="main">
<header class="topbar">
<div>
<div class="crumb">Workspace · aurora-software</div>
<h1>Overview</h1>
</div>
<div class="search"><i data-lucide="search"></i><input placeholder="Search licenses, customers, products"></div>
<div class="topbar-actions">
<button class="btn secondary"><i data-lucide="download"></i>Export</button>
<button class="btn primary"><i data-lucide="plus"></i>New product</button>
</div>
</header>
<div class="content">
<div class="stats">
<div class="stat featured">
<div class="label">Active licenses</div>
<div class="value">42</div>
<div class="delta">+5 this month</div>
</div>
<div class="stat">
<div class="label">Sales · 30 days</div>
<div class="value">12 <span class="unit">sales</span></div>
<div class="delta">+33% vs prev</div>
</div>
<div class="stat">
<div class="label">Sats earned · 30d</div>
<div class="value">412,500</div>
<div class="sub">≈ $247.32</div>
</div>
<div class="stat">
<div class="label">Conversion</div>
<div class="value">8.4 <span class="unit">%</span></div>
<div class="delta down">−1.2% vs prev</div>
</div>
</div>
<div style="display: grid; grid-template-columns: 1.6fr 1fr; gap: 18px;">
<div class="card">
<div class="card-head"><h3>Recent licenses</h3><a href="licenses.html" class="btn ghost sm">View all <i data-lucide="arrow-right"></i></a></div>
<table class="t" style="border:0; border-radius: 0;">
<thead><tr><th>Key</th><th>Product</th><th>Customer</th><th>Status</th><th>Issued</th></tr></thead>
<tbody>
<tr><td class="key">KS-9F2A-7C41-XK22-6D8E</td><td class="product">Sundial 2.0</td><td>nina@dial.studio</td><td><span class="badge b-success"><span class="dot" style="background:#2D7A5F"></span>Active</span></td><td class="meta">2 hours ago</td></tr>
<tr><td class="key">KS-A14C-PT09-LM31-R7Q4</td><td class="product">Sundial Pro</td><td>m@labry.dev</td><td><span class="badge b-success"><span class="dot" style="background:#2D7A5F"></span>Active</span></td><td class="meta">Yesterday</td></tr>
<tr><td class="key">KS-T2X8-6K43-QQ91-WE0M</td><td class="product">Sundial 2.0</td><td>jo@kestrel.fm</td><td><span class="badge b-warning"><span class="dot" style="background:#B8861F"></span>Trial</span></td><td class="meta">2d ago</td></tr>
<tr><td class="key">KS-BX9D-MM21-NU45-7F3R</td><td class="product">Sundial 2.0</td><td>ari@northpath.io</td><td><span class="badge b-success"><span class="dot" style="background:#2D7A5F"></span>Active</span></td><td class="meta">3d ago</td></tr>
<tr><td class="key">KS-PW45-VR82-XA61-9K0L</td><td class="product">Sundial Pro</td><td>tom@workhorse.app</td><td><span class="badge b-danger"><span class="dot" style="background:#B23A3A"></span>Revoked</span></td><td class="meta">5d ago</td></tr>
</tbody>
</table>
</div>
<div style="display: flex; flex-direction: column; gap: 14px;">
<div class="card">
<div class="card-head"><h3>Top products</h3></div>
<div style="padding: 12px 16px;">
<div style="display: flex; align-items: center; padding: 10px 0; gap: 12px; border-bottom: 1px solid var(--border-1);">
<div style="flex: 1;"><div style="font-weight: 600; color: var(--navy-950)">Sundial 2.0</div><div style="font-size: 12px; color: var(--ink-500)">28 active · 50,000 sats</div></div>
<div style="font-family: var(--font-mono); font-size: 12.5px; color: var(--navy-900); font-weight: 600">1.4M sats</div>
</div>
<div style="display: flex; align-items: center; padding: 10px 0; gap: 12px; border-bottom: 1px solid var(--border-1);">
<div style="flex: 1;"><div style="font-weight: 600; color: var(--navy-950)">Sundial Pro</div><div style="font-size: 12px; color: var(--ink-500)">11 active · 200,000 sats</div></div>
<div style="font-family: var(--font-mono); font-size: 12.5px; color: var(--navy-900); font-weight: 600">2.2M sats</div>
</div>
<div style="display: flex; align-items: center; padding: 10px 0; gap: 12px;">
<div style="flex: 1;"><div style="font-weight: 600; color: var(--navy-950)">Aurora Plugin</div><div style="font-size: 12px; color: var(--ink-500)">3 active · 75,000 sats</div></div>
<div style="font-family: var(--font-mono); font-size: 12.5px; color: var(--navy-900); font-weight: 600">225k sats</div>
</div>
</div>
</div>
<div class="card" style="background: var(--cream-100); border-style: dashed;">
<div style="padding: 18px;">
<div class="eyebrow" style="margin-bottom: 6px;">Tip</div>
<div style="font-family: var(--font-display); font-weight: 700; font-size: 15px; color: var(--navy-950); margin-bottom: 4px; letter-spacing: -0.01em;">Embed your public key</div>
<p style="font-size: 13px; color: var(--ink-700); margin: 0 0 12px; line-height: 1.5;">Paste this into your app's source. Verifies signatures offline.</p>
<div style="background: var(--navy-950); color: var(--cream-50); padding: 10px 12px; border-radius: 7px; font-family: var(--font-mono); font-size: 12px; display: flex; gap: 10px; align-items: center; justify-content: space-between;">
<span>mz7q8r4t1v…h3k2pXq9wL</span>
<button class="btn sm" style="background: rgba(245,241,232,0.10); color: var(--cream-50); border: 0;">Copy</button>
</div>
</div>
</div>
</div>
</div>
</div>
</main>
</div>
<script src="https://unpkg.com/lucide@latest"></script>
<script>lucide.createIcons();</script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink