cc0bffea86
Three coordinated package changes addressing Wave 1 cross-repo TODOs from the UI/UX roadmap (learning_ai_uxui_web/docs/ROADMAP_2026.md §10). ═══════════════════════════════════════════════════════════════════════ TODO #2 — @bytelyst/react-auth bump 0.1.8 → 0.2.0 ═══════════════════════════════════════════════════════════════════════ - Changes 'workspace:*' to 'workspace:^' for the @bytelyst/api-client dependency. On pnpm publish this resolves to a caret range (e.g. ^0.1.6) instead of '*', restoring installability for consumers. (The 0.1.6 tarball was published with a literal 'workspace:*' string — newer minor bump unblocks the showcase react-auth demo.) - 21 tests still passing. ═══════════════════════════════════════════════════════════════════════ TODO #3 — @bytelyst/dashboard-shell bump 0.1.7 → 0.2.0 ═══════════════════════════════════════════════════════════════════════ - Adds 'routePrefix?: string' prop to DashboardShellProps, SidebarProps, and TopBarProps. Threads through DashboardShell → Sidebar + TopBar. - Built-in /profile, /billing, /settings links now use the prefix: routePrefix="/app" → /app/profile, /app/billing, /app/settings - Defaults to '' (empty string) — fully back-compat with 0.1.x callers. - 2 new vitest cases covering both prefixed and default behavior; 43 / 43 tests passing (+2 from 41). ═══════════════════════════════════════════════════════════════════════ TODO #1 — @bytelyst/design-tokens bump 0.1.8 → 0.2.0 ═══════════════════════════════════════════════════════════════════════ - Adds a density-aware spacing tier on top of the existing raw --ml-space-* tier: --bl-space-scale: 1 (default :root) --bl-space-1..16: calc(--ml-space-N × --bl-space-scale) - Emits density selectors at the end of tokens.css: [data-density="compact"] { --bl-space-scale: 0.875; } [data-density="comfortable"] { --bl-space-scale: 1; } [data-density="spacious"] { --bl-space-scale: 1.125; } - Generator (scripts/generate.ts) emits both tiers automatically; the auto-generated per-product CSS files (lysnrai, mindlyst, etc.) gain a single blank-line diff from regeneration — no semantic change. - 11 / 11 token tests passing. ═══════════════════════════════════════════════════════════════════════ Decision doc — docs/ROADMAP_2026_DECISIONS.md ═══════════════════════════════════════════════════════════════════════ - Records pragmatic defaults for TODO ledger items #9–#13 so implementation work doesn't block: #9 Storybook hosting → self-hosted on Gitea Pages (free) #10 useChat protocol → adopt Vercel AI SDK shape, abstract transport #11 react-auth fold-in → defer to Wave 7 #12 dashboard-shell merge → defer to Wave 7 #13 mobile-native UI → out of scope (tokens-only sharing) - Each decision is reversible via RFC. ═══════════════════════════════════════════════════════════════════════ Publish flow ═══════════════════════════════════════════════════════════════════════ These three packages now require a release. The existing publish workflow (.gitea/workflows/publish-packages.yml) has PACKAGE_FILTER pinned to @bytelyst/errors and won't pick them up automatically — a manual workflow_dispatch with a broader filter (or the existing publish-all-packages.yml on workflow_dispatch) is needed to ship 0.2.0 to the Gitea npm registry. Refs: learning_ai_uxui_web/docs/ROADMAP_2026.md §10 TODOs #1, #2, #3, #9–#13
126 lines
4.3 KiB
CSS
126 lines
4.3 KiB
CSS
/* Auto-generated notelett tokens from bytelyst.tokens.json — do not edit manually */
|
|
|
|
:root {
|
|
--nl-bg-canvas: #06070A;
|
|
--nl-bg-elevated: #0E1118;
|
|
--nl-surface-card: #121725;
|
|
--nl-surface-muted: #1A2335;
|
|
--nl-border-default: rgba(255,255,255,0.12);
|
|
--nl-border-strong: rgba(255,255,255,0.22);
|
|
--nl-text-primary: #EFF4FF;
|
|
--nl-text-secondary: #A5B1C7;
|
|
--nl-text-tertiary: #6C7C98;
|
|
--nl-accent-primary: #5A8CFF;
|
|
--nl-accent-secondary: #2EE6D6;
|
|
--nl-success: #34D399;
|
|
--nl-warning: #F59E0B;
|
|
--nl-danger: #FF6E6E;
|
|
--nl-focus-ring: rgba(90,140,255,0.45);
|
|
--nl-overlay-scrim: rgba(5,8,18,0.72);
|
|
|
|
/* notelett product colors */
|
|
--nl-bg-canvas: #06070A;
|
|
--nl-bg-elevated: #0E1118;
|
|
--nl-surface-card: #121725;
|
|
--nl-surface-muted: #1A2335;
|
|
--nl-accent-primary: #5A8CFF;
|
|
--nl-accent-secondary: #2EE6D6;
|
|
--nl-success: #34D399;
|
|
--nl-warning: #F59E0B;
|
|
--nl-danger: #FF6E6E;
|
|
--nl-focus-ring: #5A8CFF;
|
|
--nl-agent-action: #A66BFF;
|
|
--nl-draft-note: #FFD166;
|
|
--nl-linked-note: #2EE6D6;
|
|
--nl-task-pending: #F59E0B;
|
|
--nl-task-complete: #34D399;
|
|
|
|
--nl-font-display: "Space Grotesk", "SF Pro Display", sans-serif;
|
|
--nl-font-body: "DM Sans", "SF Pro Text", sans-serif;
|
|
--nl-font-mono: "IBM Plex Mono", "SF Mono", monospace;
|
|
|
|
--nl-fs-xs: 12px;
|
|
--nl-fs-sm: 14px;
|
|
--nl-fs-md: 16px;
|
|
--nl-fs-lg: 18px;
|
|
--nl-fs-xl: 22px;
|
|
--nl-fs-2xl: 28px;
|
|
--nl-fs-3xl: 36px;
|
|
|
|
--nl-space-0: 0;
|
|
--nl-space-1: 4px;
|
|
--nl-space-2: 8px;
|
|
--nl-space-3: 12px;
|
|
--nl-space-4: 16px;
|
|
--nl-space-5: 20px;
|
|
--nl-space-6: 24px;
|
|
--nl-space-7: 28px;
|
|
--nl-space-8: 32px;
|
|
--nl-space-10: 40px;
|
|
--nl-space-12: 48px;
|
|
--nl-space-16: 64px;
|
|
|
|
--nl-radius-xs: 8px;
|
|
--nl-radius-sm: 12px;
|
|
--nl-radius-md: 16px;
|
|
--nl-radius-lg: 20px;
|
|
--nl-radius-xl: 24px;
|
|
--nl-radius-pill: 999px;
|
|
|
|
--nl-elevation-sm: 0 4px 12px rgba(0,0,0,0.12);
|
|
--nl-elevation-md: 0 12px 28px rgba(0,0,0,0.18);
|
|
--nl-elevation-lg: 0 20px 48px rgba(0,0,0,0.24);
|
|
|
|
--nl-motion-fast: 140ms;
|
|
--nl-motion-base: 220ms;
|
|
--nl-motion-slow: 320ms;
|
|
--nl-easing-standard: cubic-bezier(0.2, 0.0, 0.2, 1);
|
|
|
|
/* ── @bytelyst/ui alias layer (--bl-* → --nl-*) ──────────────── */
|
|
--bl-bg-canvas: var(--nl-bg-canvas);
|
|
--bl-bg-elevated: var(--nl-bg-elevated);
|
|
--bl-surface-card: var(--nl-surface-card);
|
|
--bl-surface-muted: var(--nl-surface-muted);
|
|
--bl-surface-highlight: color-mix(in oklab, var(--nl-surface-muted) 82%, white);
|
|
--bl-surface-overlay: color-mix(in oklab, var(--nl-bg-canvas) 88%, transparent);
|
|
--bl-input: color-mix(in oklab, var(--nl-surface-muted) 76%, var(--nl-bg-canvas));
|
|
--bl-border: var(--nl-border-default);
|
|
--bl-border-strong: var(--nl-border-strong);
|
|
--bl-border-subtle: color-mix(in oklab, var(--nl-border-default) 62%, transparent);
|
|
--bl-text-primary: var(--nl-text-primary);
|
|
--bl-text-secondary: var(--nl-text-secondary);
|
|
--bl-text-tertiary: var(--nl-text-tertiary);
|
|
--bl-text-quiet: color-mix(in oklab, var(--nl-text-secondary) 78%, var(--nl-bg-canvas));
|
|
--bl-accent: var(--nl-accent-primary);
|
|
--bl-accent-foreground: var(--nl-bg-canvas);
|
|
--bl-accent-muted: color-mix(in oklab, var(--nl-accent-primary) 16%, transparent);
|
|
--bl-info: var(--nl-accent-primary);
|
|
--bl-info-muted: color-mix(in oklab, var(--nl-accent-primary) 14%, transparent);
|
|
--bl-success: var(--nl-success);
|
|
--bl-success-muted: color-mix(in oklab, var(--nl-success) 14%, transparent);
|
|
--bl-warning: var(--nl-warning);
|
|
--bl-warning-muted: color-mix(in oklab, var(--nl-warning) 14%, transparent);
|
|
--bl-danger: var(--nl-danger);
|
|
--bl-danger-muted: color-mix(in oklab, var(--nl-danger) 14%, transparent);
|
|
--bl-danger-foreground: var(--nl-bg-canvas);
|
|
--bl-focus-ring: var(--nl-focus-ring);
|
|
--bl-focus-ring-muted: color-mix(in oklab, var(--nl-accent-primary) 18%, transparent);
|
|
--bl-overlay-scrim: var(--nl-overlay-scrim);
|
|
}
|
|
|
|
[data-theme="light"] {
|
|
--nl-bg-canvas: #F6F8FC;
|
|
--nl-bg-elevated: #EEF2FA;
|
|
--nl-surface-card: #FFFFFF;
|
|
--nl-surface-muted: #F3F5FA;
|
|
--nl-border-default: rgba(14,19,32,0.12);
|
|
--nl-border-strong: rgba(14,19,32,0.24);
|
|
--nl-text-primary: #0E1320;
|
|
--nl-text-secondary: #55637A;
|
|
--nl-success: #13956A;
|
|
--nl-warning: #B87504;
|
|
--nl-danger: #D24242;
|
|
--nl-focus-ring: rgba(90,140,255,0.35);
|
|
--nl-overlay-scrim: rgba(10,13,23,0.5);
|
|
}
|