@soulbatical/tetra-ui 0.2.4 → 0.2.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/hooks/useAuth.d.ts.map +1 -1
- package/dist/hooks/useAuth.js +8 -2
- package/dist/hooks/useAuth.js.map +1 -1
- package/package.json +5 -2
- package/src/styles/dark-mode.css +46 -130
- package/src/styles/theme.css +7 -102
- package/src/styles/tokens.css +50 -7
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useAuth.d.ts","sourceRoot":"","sources":["../../src/hooks/useAuth.ts"],"names":[],"mappings":"AAKA;;GAEG;AACH,UAAU,UAAU;IAClB,mBAAmB;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,sEAAsE;IACtE,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,+CAA+C;IAC/C,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAQD,wBAAgB,aAAa,CAAC,MAAM,EAAE,UAAU,QAE/C;AAED,UAAU,QAAQ;IAChB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;CACf;AAgBD;;;GAGG;AACH,wBAAgB,gBAAgB,IAAI,OAAO,CAAC,IAAI,CAAC,CAEhD;
|
|
1
|
+
{"version":3,"file":"useAuth.d.ts","sourceRoot":"","sources":["../../src/hooks/useAuth.ts"],"names":[],"mappings":"AAKA;;GAEG;AACH,UAAU,UAAU;IAClB,mBAAmB;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,sEAAsE;IACtE,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,+CAA+C;IAC/C,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAQD,wBAAgB,aAAa,CAAC,MAAM,EAAE,UAAU,QAE/C;AAED,UAAU,QAAQ;IAChB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;CACf;AAgBD;;;GAGG;AACH,wBAAgB,gBAAgB,IAAI,OAAO,CAAC,IAAI,CAAC,CAEhD;AAkCD,4EAA4E;AAC5E,wBAAgB,cAAc,IAAI,MAAM,GAAG,IAAI,CAE9C;AAED,wBAAgB,OAAO;;;;oBAiFV,MAAM,YACH,MAAM,KACf,OAAO,CAAC;QAAE,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;oBAoCrB,MAAM,YACH,MAAM,KACf,OAAO,CAAC;QAAE,KAAK,CAAC,EAAE,MAAM,CAAC;QAAC,oBAAoB,CAAC,EAAE,OAAO,CAAA;KAAE,CAAC;;2BAwCnD,MAAM,aAAa,MAAM;oBAa1B,OAAO,CAAC;QAAE,KAAK,CAAC,EAAE,MAAM,CAAC;QAAC,iBAAiB,CAAC,EAAE,OAAO,CAAC;QAAC,cAAc,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;EA4C9F"}
|
package/dist/hooks/useAuth.js
CHANGED
|
@@ -25,7 +25,9 @@ export function waitForAuthReady() {
|
|
|
25
25
|
function saveTokens(t) {
|
|
26
26
|
tokens = t;
|
|
27
27
|
try {
|
|
28
|
-
|
|
28
|
+
// localStorage persists across tabs and direct URL navigation
|
|
29
|
+
// (sessionStorage is per-tab and loses state on new tab / address bar nav)
|
|
30
|
+
localStorage.setItem(_config.storageKey, t.refresh_token);
|
|
29
31
|
}
|
|
30
32
|
catch {
|
|
31
33
|
// SSR or unavailable
|
|
@@ -34,6 +36,8 @@ function saveTokens(t) {
|
|
|
34
36
|
function clearTokens() {
|
|
35
37
|
tokens = null;
|
|
36
38
|
try {
|
|
39
|
+
localStorage.removeItem(_config.storageKey);
|
|
40
|
+
// Also clean up legacy sessionStorage if present
|
|
37
41
|
sessionStorage.removeItem(_config.storageKey);
|
|
38
42
|
}
|
|
39
43
|
catch {
|
|
@@ -42,7 +46,9 @@ function clearTokens() {
|
|
|
42
46
|
}
|
|
43
47
|
function getSavedRefreshToken() {
|
|
44
48
|
try {
|
|
45
|
-
|
|
49
|
+
// Check localStorage first, fall back to sessionStorage for migration
|
|
50
|
+
return localStorage.getItem(_config.storageKey) ??
|
|
51
|
+
sessionStorage.getItem(_config.storageKey);
|
|
46
52
|
}
|
|
47
53
|
catch {
|
|
48
54
|
return null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useAuth.js","sourceRoot":"","sources":["../../src/hooks/useAuth.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAc/C,IAAI,OAAO,GAAe;IACxB,UAAU,EAAE,EAAE;IACd,UAAU,EAAE,eAAe;IAC3B,SAAS,EAAE,aAAa;CACzB,CAAC;AAEF,MAAM,UAAU,aAAa,CAAC,MAAkB;IAC9C,OAAO,GAAG,EAAE,GAAG,OAAO,EAAE,GAAG,MAAM,EAAE,CAAC;AACtC,CAAC;AAaD,sEAAsE;AACtE,IAAI,MAAM,GAAsB,IAAI,CAAC;AAErC,IAAI,gBAAgB,GAAwB,IAAI,CAAC;AACjD,MAAM,gBAAgB,GAAG,IAAI,OAAO,CAAO,CAAC,OAAO,EAAE,EAAE;IACrD,gBAAgB,GAAG,OAAO,CAAC;AAC7B,CAAC,CAAC,CAAC;AAEH;;;GAGG;AACH,MAAM,UAAU,gBAAgB;IAC9B,OAAO,gBAAgB,CAAC;AAC1B,CAAC;AAED,SAAS,UAAU,CAAC,CAAa;IAC/B,MAAM,GAAG,CAAC,CAAC;IACX,IAAI,CAAC;QACH,
|
|
1
|
+
{"version":3,"file":"useAuth.js","sourceRoot":"","sources":["../../src/hooks/useAuth.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
"name": "@soulbatical/tetra-ui",
|
|
3
3
|
"private": false,
|
|
4
4
|
"publishConfig": {
|
|
5
|
-
"access": "
|
|
5
|
+
"access": "public"
|
|
6
6
|
},
|
|
7
|
-
"version": "0.2.
|
|
7
|
+
"version": "0.2.7",
|
|
8
8
|
"description": "Shared React frontend framework for Tetra platform projects (Soulbatical BV) — config-driven components, hooks, providers, and styling",
|
|
9
9
|
"type": "module",
|
|
10
10
|
"main": "dist/index.js",
|
|
@@ -74,6 +74,9 @@
|
|
|
74
74
|
"import": "./dist/styles/index.css",
|
|
75
75
|
"default": "./dist/styles/index.css"
|
|
76
76
|
},
|
|
77
|
+
"./styles/tokens.css": "./src/styles/tokens.css",
|
|
78
|
+
"./styles/dark-mode.css": "./src/styles/dark-mode.css",
|
|
79
|
+
"./styles/theme.css": "./src/styles/theme.css",
|
|
77
80
|
"./styles/*": {
|
|
78
81
|
"import": "./src/styles/*",
|
|
79
82
|
"default": "./src/styles/*"
|
package/src/styles/dark-mode.css
CHANGED
|
@@ -1,135 +1,51 @@
|
|
|
1
|
-
|
|
2
|
-
*
|
|
3
|
-
* Remaps light Tailwind utilities to dark equivalents when .dark is on <html>.
|
|
1
|
+
/*
|
|
2
|
+
* Tetra UI Dark Mode Tokens (standalone)
|
|
4
3
|
*
|
|
5
|
-
*
|
|
6
|
-
*
|
|
4
|
+
* Import this file if you ONLY need the dark-mode overrides
|
|
5
|
+
* (e.g. you already define your own light-mode tokens).
|
|
7
6
|
*
|
|
8
|
-
*
|
|
9
|
-
* @import
|
|
10
|
-
* @custom-variant dark (&:where(.dark, .dark *));
|
|
11
|
-
* @import "@tetra/ui/styles/theme.css";
|
|
12
|
-
* @import "@tetra/ui/styles/dark-mode.css";
|
|
7
|
+
* Usage:
|
|
8
|
+
* @import '@soulbatical/tetra-ui/styles/dark-mode.css';
|
|
13
9
|
*/
|
|
14
10
|
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
--
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
--
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
--
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
--
|
|
54
|
-
|
|
55
|
-
}
|
|
56
|
-
.dark main .text-gray-600 {
|
|
57
|
-
--tw-text-opacity: 1;
|
|
58
|
-
color: rgb(156 163 175 / var(--tw-text-opacity)) !important; /* gray-400 */
|
|
59
|
-
}
|
|
60
|
-
|
|
61
|
-
/* ─── Inputs ───────────────────────────────────────── */
|
|
62
|
-
|
|
63
|
-
.dark main input.bg-white,
|
|
64
|
-
.dark main select.bg-white,
|
|
65
|
-
.dark main textarea.bg-white {
|
|
66
|
-
--tw-bg-opacity: 1;
|
|
67
|
-
background-color: rgb(31 41 55 / var(--tw-bg-opacity)) !important; /* gray-800 */
|
|
68
|
-
--tw-text-opacity: 1;
|
|
69
|
-
color: rgb(243 244 246 / var(--tw-text-opacity)) !important; /* gray-100 */
|
|
70
|
-
}
|
|
71
|
-
|
|
72
|
-
/* ─── Hover states ─────────────────────────────────── */
|
|
73
|
-
|
|
74
|
-
.dark main .hover\:bg-gray-50:hover {
|
|
75
|
-
background-color: rgb(31 41 55 / 1) !important; /* gray-800 */
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
/* ─── Badge colors (green) ─────────────────────────── */
|
|
79
|
-
|
|
80
|
-
.dark main .bg-green-100 {
|
|
81
|
-
background-color: rgb(6 78 59 / 0.3) !important;
|
|
82
|
-
}
|
|
83
|
-
.dark main .text-green-700,
|
|
84
|
-
.dark main .text-green-800 {
|
|
85
|
-
color: rgb(74 222 128) !important; /* green-400 */
|
|
86
|
-
}
|
|
87
|
-
|
|
88
|
-
/* ─── Badge colors (yellow) ────────────────────────── */
|
|
89
|
-
|
|
90
|
-
.dark main .bg-yellow-100 {
|
|
91
|
-
background-color: rgb(113 63 18 / 0.3) !important;
|
|
92
|
-
}
|
|
93
|
-
.dark main .text-yellow-700,
|
|
94
|
-
.dark main .text-yellow-800 {
|
|
95
|
-
color: rgb(250 204 21) !important; /* yellow-400 */
|
|
96
|
-
}
|
|
97
|
-
|
|
98
|
-
/* ─── Badge colors (blue) ──────────────────────────── */
|
|
99
|
-
|
|
100
|
-
.dark main .bg-blue-100 {
|
|
101
|
-
background-color: rgb(30 58 138 / 0.3) !important;
|
|
102
|
-
}
|
|
103
|
-
.dark main .text-blue-700,
|
|
104
|
-
.dark main .text-blue-800 {
|
|
105
|
-
color: rgb(96 165 250) !important; /* blue-400 */
|
|
106
|
-
}
|
|
107
|
-
|
|
108
|
-
/* ─── Badge colors (red) ───────────────────────────── */
|
|
109
|
-
|
|
110
|
-
.dark main .bg-red-100 {
|
|
111
|
-
background-color: rgb(127 29 29 / 0.3) !important;
|
|
112
|
-
}
|
|
113
|
-
.dark main .text-red-700,
|
|
114
|
-
.dark main .text-red-800 {
|
|
115
|
-
color: rgb(248 113 113) !important; /* red-400 */
|
|
116
|
-
}
|
|
117
|
-
|
|
118
|
-
/* ─── Badge colors (indigo) ────────────────────────── */
|
|
119
|
-
|
|
120
|
-
.dark main .bg-indigo-100 {
|
|
121
|
-
background-color: rgb(49 46 129 / 0.3) !important;
|
|
122
|
-
}
|
|
123
|
-
.dark main .text-indigo-700,
|
|
124
|
-
.dark main .text-indigo-800 {
|
|
125
|
-
color: rgb(129 140 248) !important; /* indigo-400 */
|
|
126
|
-
}
|
|
127
|
-
|
|
128
|
-
/* ─── Badge colors (gray) ──────────────────────────── */
|
|
129
|
-
|
|
130
|
-
.dark main .bg-gray-100 {
|
|
131
|
-
background-color: rgb(31 41 55 / 0.5) !important; /* gray-800/50 */
|
|
132
|
-
}
|
|
133
|
-
.dark main .bg-gray-200 {
|
|
134
|
-
background-color: rgb(55 65 81) !important; /* gray-700 */
|
|
11
|
+
@media (prefers-color-scheme: dark) {
|
|
12
|
+
:root:not([data-theme="light"]) {
|
|
13
|
+
--tetra-bg: #1a1a2e;
|
|
14
|
+
--tetra-bg-subtle: #222240;
|
|
15
|
+
--tetra-bg-muted: #2a2a4a;
|
|
16
|
+
--tetra-border: rgba(255,255,255,0.15);
|
|
17
|
+
--tetra-border-subtle: rgba(255,255,255,0.1);
|
|
18
|
+
--tetra-text: #f0f0f5;
|
|
19
|
+
--tetra-text-muted: #9999bb;
|
|
20
|
+
--tetra-text-inverted: #0a0a1a;
|
|
21
|
+
--tetra-accent: #3b82f6;
|
|
22
|
+
--tetra-accent-subtle: rgba(59,130,246,0.15);
|
|
23
|
+
--tetra-accent-hover: #2563eb;
|
|
24
|
+
--tetra-danger: #ef4444;
|
|
25
|
+
--tetra-danger-subtle: rgba(239,68,68,0.15);
|
|
26
|
+
--tetra-success: #22c55e;
|
|
27
|
+
--tetra-success-subtle: rgba(34,197,94,0.15);
|
|
28
|
+
--tetra-warning: #f59e0b;
|
|
29
|
+
--tetra-warning-subtle: rgba(245,158,11,0.15);
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
[data-theme="dark"] {
|
|
34
|
+
--tetra-bg: #1a1a2e;
|
|
35
|
+
--tetra-bg-subtle: #222240;
|
|
36
|
+
--tetra-bg-muted: #2a2a4a;
|
|
37
|
+
--tetra-border: rgba(255,255,255,0.15);
|
|
38
|
+
--tetra-border-subtle: rgba(255,255,255,0.1);
|
|
39
|
+
--tetra-text: #f0f0f5;
|
|
40
|
+
--tetra-text-muted: #9999bb;
|
|
41
|
+
--tetra-text-inverted: #0a0a1a;
|
|
42
|
+
--tetra-accent: #3b82f6;
|
|
43
|
+
--tetra-accent-subtle: rgba(59,130,246,0.15);
|
|
44
|
+
--tetra-accent-hover: #2563eb;
|
|
45
|
+
--tetra-danger: #ef4444;
|
|
46
|
+
--tetra-danger-subtle: rgba(239,68,68,0.15);
|
|
47
|
+
--tetra-success: #22c55e;
|
|
48
|
+
--tetra-success-subtle: rgba(34,197,94,0.15);
|
|
49
|
+
--tetra-warning: #f59e0b;
|
|
50
|
+
--tetra-warning-subtle: rgba(245,158,11,0.15);
|
|
135
51
|
}
|
package/src/styles/theme.css
CHANGED
|
@@ -1,105 +1,10 @@
|
|
|
1
|
-
|
|
2
|
-
*
|
|
3
|
-
* HSL space-separated values (shadcn convention)
|
|
4
|
-
* Usage: hsl(var(--background)) or hsl(var(--foreground))
|
|
1
|
+
/*
|
|
2
|
+
* Tetra UI Theme (combined)
|
|
5
3
|
*
|
|
6
|
-
*
|
|
7
|
-
*
|
|
4
|
+
* Convenience file that imports both light and dark tokens.
|
|
5
|
+
*
|
|
6
|
+
* Usage:
|
|
7
|
+
* @import '@soulbatical/tetra-ui/styles/theme.css';
|
|
8
8
|
*/
|
|
9
9
|
|
|
10
|
-
@
|
|
11
|
-
:root {
|
|
12
|
-
--background: 0 0% 100%;
|
|
13
|
-
--foreground: 222.2 84% 4.9%;
|
|
14
|
-
|
|
15
|
-
--card: 0 0% 100%;
|
|
16
|
-
--card-foreground: 222.2 84% 4.9%;
|
|
17
|
-
|
|
18
|
-
--popover: 0 0% 100%;
|
|
19
|
-
--popover-foreground: 222.2 84% 4.9%;
|
|
20
|
-
|
|
21
|
-
--primary: 222.2 47.4% 11.2%;
|
|
22
|
-
--primary-foreground: 210 40% 98%;
|
|
23
|
-
|
|
24
|
-
--secondary: 210 40% 96.1%;
|
|
25
|
-
--secondary-foreground: 222.2 47.4% 11.2%;
|
|
26
|
-
|
|
27
|
-
--muted: 210 40% 96.1%;
|
|
28
|
-
--muted-foreground: 215.4 16.3% 46.9%;
|
|
29
|
-
|
|
30
|
-
--accent: 210 40% 96.1%;
|
|
31
|
-
--accent-foreground: 222.2 47.4% 11.2%;
|
|
32
|
-
|
|
33
|
-
--destructive: 0 84.2% 60.2%;
|
|
34
|
-
--destructive-foreground: 210 40% 98%;
|
|
35
|
-
|
|
36
|
-
--border: 214.3 31.8% 91.4%;
|
|
37
|
-
--input: 214.3 31.8% 91.4%;
|
|
38
|
-
--ring: 222.2 84% 4.9%;
|
|
39
|
-
|
|
40
|
-
--radius: 0.5rem;
|
|
41
|
-
|
|
42
|
-
--sidebar-background: 0 0% 98%;
|
|
43
|
-
--sidebar-foreground: 240 5.3% 26.1%;
|
|
44
|
-
--sidebar-primary: 240 5.9% 10%;
|
|
45
|
-
--sidebar-primary-foreground: 0 0% 98%;
|
|
46
|
-
--sidebar-accent: 240 4.8% 95.9%;
|
|
47
|
-
--sidebar-accent-foreground: 240 5.9% 10%;
|
|
48
|
-
--sidebar-border: 220 13% 91%;
|
|
49
|
-
--sidebar-ring: 217.2 91.2% 59.8%;
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
.dark {
|
|
53
|
-
--background: 222.2 84% 4.9%;
|
|
54
|
-
--foreground: 210 40% 98%;
|
|
55
|
-
|
|
56
|
-
--card: 222.2 84% 4.9%;
|
|
57
|
-
--card-foreground: 210 40% 98%;
|
|
58
|
-
|
|
59
|
-
--popover: 222.2 84% 4.9%;
|
|
60
|
-
--popover-foreground: 210 40% 98%;
|
|
61
|
-
|
|
62
|
-
--primary: 210 40% 98%;
|
|
63
|
-
--primary-foreground: 222.2 47.4% 11.2%;
|
|
64
|
-
|
|
65
|
-
--secondary: 217.2 32.6% 17.5%;
|
|
66
|
-
--secondary-foreground: 210 40% 98%;
|
|
67
|
-
|
|
68
|
-
--muted: 217.2 32.6% 17.5%;
|
|
69
|
-
--muted-foreground: 215 20.2% 65.1%;
|
|
70
|
-
|
|
71
|
-
--accent: 217.2 32.6% 17.5%;
|
|
72
|
-
--accent-foreground: 210 40% 98%;
|
|
73
|
-
|
|
74
|
-
--destructive: 0 62.8% 30.6%;
|
|
75
|
-
--destructive-foreground: 210 40% 98%;
|
|
76
|
-
|
|
77
|
-
--border: 217.2 32.6% 12%;
|
|
78
|
-
--input: 217.2 32.6% 17.5%;
|
|
79
|
-
--ring: 212.7 26.8% 83.9%;
|
|
80
|
-
|
|
81
|
-
--sidebar-background: 222.2 84% 4.9%;
|
|
82
|
-
--sidebar-foreground: 210 40% 98%;
|
|
83
|
-
--sidebar-primary: 210 40% 98%;
|
|
84
|
-
--sidebar-primary-foreground: 222.2 47.4% 11.2%;
|
|
85
|
-
--sidebar-accent: 217.2 32.6% 17.5%;
|
|
86
|
-
--sidebar-accent-foreground: 210 40% 98%;
|
|
87
|
-
--sidebar-border: 217.2 32.6% 12%;
|
|
88
|
-
--sidebar-ring: 212.7 26.8% 83.9%;
|
|
89
|
-
}
|
|
90
|
-
}
|
|
91
|
-
|
|
92
|
-
@layer base {
|
|
93
|
-
* {
|
|
94
|
-
border-color: hsl(var(--border));
|
|
95
|
-
}
|
|
96
|
-
|
|
97
|
-
body {
|
|
98
|
-
@apply bg-background text-foreground;
|
|
99
|
-
}
|
|
100
|
-
|
|
101
|
-
input::placeholder,
|
|
102
|
-
textarea::placeholder {
|
|
103
|
-
@apply text-muted-foreground/40;
|
|
104
|
-
}
|
|
105
|
-
}
|
|
10
|
+
@import './tokens.css';
|
package/src/styles/tokens.css
CHANGED
|
@@ -15,26 +15,26 @@
|
|
|
15
15
|
*/
|
|
16
16
|
|
|
17
17
|
:root {
|
|
18
|
-
/*
|
|
18
|
+
/* -- Backgrounds ---------------------------------------- */
|
|
19
19
|
--tetra-bg: #ffffff;
|
|
20
20
|
--tetra-bg-subtle: #f9fafb;
|
|
21
21
|
--tetra-bg-muted: #f3f4f6;
|
|
22
22
|
|
|
23
|
-
/*
|
|
23
|
+
/* -- Borders -------------------------------------------- */
|
|
24
24
|
--tetra-border: #e5e7eb;
|
|
25
25
|
--tetra-border-subtle: #f3f4f6;
|
|
26
26
|
|
|
27
|
-
/*
|
|
27
|
+
/* -- Text ----------------------------------------------- */
|
|
28
28
|
--tetra-text: #111827;
|
|
29
29
|
--tetra-text-muted: #6b7280;
|
|
30
30
|
--tetra-text-inverted: #ffffff;
|
|
31
31
|
|
|
32
|
-
/*
|
|
32
|
+
/* -- Accent (primary action color) ---------------------- */
|
|
33
33
|
--tetra-accent: #3b82f6;
|
|
34
34
|
--tetra-accent-subtle: #eff6ff;
|
|
35
35
|
--tetra-accent-hover: #2563eb;
|
|
36
36
|
|
|
37
|
-
/*
|
|
37
|
+
/* -- Semantic ------------------------------------------- */
|
|
38
38
|
--tetra-danger: #ef4444;
|
|
39
39
|
--tetra-danger-subtle: #fef2f2;
|
|
40
40
|
--tetra-success: #22c55e;
|
|
@@ -42,12 +42,55 @@
|
|
|
42
42
|
--tetra-warning: #f59e0b;
|
|
43
43
|
--tetra-warning-subtle: #fffbeb;
|
|
44
44
|
|
|
45
|
-
/*
|
|
45
|
+
/* -- Shape ---------------------------------------------- */
|
|
46
46
|
--tetra-radius: 8px;
|
|
47
47
|
--tetra-radius-sm: 4px;
|
|
48
48
|
--tetra-radius-lg: 12px;
|
|
49
49
|
|
|
50
|
-
/*
|
|
50
|
+
/* -- Typography ----------------------------------------- */
|
|
51
51
|
--tetra-font: inherit;
|
|
52
52
|
--tetra-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
|
|
53
53
|
}
|
|
54
|
+
|
|
55
|
+
/* Dark mode -- auto-applied via prefers-color-scheme or [data-theme="dark"] */
|
|
56
|
+
@media (prefers-color-scheme: dark) {
|
|
57
|
+
:root:not([data-theme="light"]) {
|
|
58
|
+
--tetra-bg: #1a1a2e;
|
|
59
|
+
--tetra-bg-subtle: #222240;
|
|
60
|
+
--tetra-bg-muted: #2a2a4a;
|
|
61
|
+
--tetra-border: rgba(255,255,255,0.15);
|
|
62
|
+
--tetra-border-subtle: rgba(255,255,255,0.1);
|
|
63
|
+
--tetra-text: #f0f0f5;
|
|
64
|
+
--tetra-text-muted: #9999bb;
|
|
65
|
+
--tetra-text-inverted: #0a0a1a;
|
|
66
|
+
--tetra-accent: #3b82f6;
|
|
67
|
+
--tetra-accent-subtle: rgba(59,130,246,0.15);
|
|
68
|
+
--tetra-accent-hover: #2563eb;
|
|
69
|
+
--tetra-danger: #ef4444;
|
|
70
|
+
--tetra-danger-subtle: rgba(239,68,68,0.15);
|
|
71
|
+
--tetra-success: #22c55e;
|
|
72
|
+
--tetra-success-subtle: rgba(34,197,94,0.15);
|
|
73
|
+
--tetra-warning: #f59e0b;
|
|
74
|
+
--tetra-warning-subtle: rgba(245,158,11,0.15);
|
|
75
|
+
}
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
[data-theme="dark"] {
|
|
79
|
+
--tetra-bg: #1a1a2e;
|
|
80
|
+
--tetra-bg-subtle: #222240;
|
|
81
|
+
--tetra-bg-muted: #2a2a4a;
|
|
82
|
+
--tetra-border: rgba(255,255,255,0.15);
|
|
83
|
+
--tetra-border-subtle: rgba(255,255,255,0.1);
|
|
84
|
+
--tetra-text: #f0f0f5;
|
|
85
|
+
--tetra-text-muted: #9999bb;
|
|
86
|
+
--tetra-text-inverted: #0a0a1a;
|
|
87
|
+
--tetra-accent: #3b82f6;
|
|
88
|
+
--tetra-accent-subtle: rgba(59,130,246,0.15);
|
|
89
|
+
--tetra-accent-hover: #2563eb;
|
|
90
|
+
--tetra-danger: #ef4444;
|
|
91
|
+
--tetra-danger-subtle: rgba(239,68,68,0.15);
|
|
92
|
+
--tetra-success: #22c55e;
|
|
93
|
+
--tetra-success-subtle: rgba(34,197,94,0.15);
|
|
94
|
+
--tetra-warning: #f59e0b;
|
|
95
|
+
--tetra-warning-subtle: rgba(245,158,11,0.15);
|
|
96
|
+
}
|