@thalamiq/ui 0.1.18 → 0.1.20

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.
@@ -6,8 +6,8 @@
6
6
  /* ============================================================
7
7
  ThalamiQ Design Tokens
8
8
  Philosophy:
9
- - Neutral infrastructure first
10
- - Calm, desaturated, inspectable
9
+ - Clean white canvas, colorful where it counts
10
+ - Professional but not flat — blue-tinted accents, clear status colors
11
11
  ============================================================ */
12
12
 
13
13
  :root {
@@ -19,81 +19,81 @@
19
19
  Core surfaces
20
20
  ------------------------------------------------------------ */
21
21
 
22
- /* App background (paper) */
23
- --background: oklch(0.975 0.002 260);
24
- --foreground: oklch(0.2 0.015 265);
22
+ /* App background */
23
+ --background: oklch(1 0 0);
24
+ --foreground: oklch(0.18 0.02 265);
25
25
 
26
26
  /* Elevated surfaces */
27
- --card: oklch(0.995 0.001 260);
28
- --card-foreground: oklch(0.2 0.015 265);
27
+ --card: oklch(1 0 0);
28
+ --card-foreground: oklch(0.18 0.02 265);
29
29
 
30
30
  --popover: oklch(1 0 0);
31
- --popover-foreground: oklch(0.2 0.015 265);
31
+ --popover-foreground: oklch(0.18 0.02 265);
32
32
 
33
33
  /* ------------------------------------------------------------
34
34
  Borders & structure
35
35
  ------------------------------------------------------------ */
36
36
 
37
- --border: oklch(0.9 0.004 260);
38
- --input: oklch(0.99 0.001 260);
39
- --ring: oklch(0.54 0.1 255);
37
+ --border: oklch(0.88 0.008 260);
38
+ --input: oklch(0.98 0.004 265);
39
+ --ring: oklch(0.54 0.14 255);
40
40
 
41
41
  /* ------------------------------------------------------------
42
42
  Text hierarchy
43
43
  ------------------------------------------------------------ */
44
44
 
45
- /* Secondary / metadata text */
46
- --muted: oklch(0.955 0.003 260);
47
- --muted-foreground: oklch(0.5 0.012 265);
45
+ /* Muted: disabled states, metadata, deemphasized areas */
46
+ --muted: oklch(0.96 0.004 260);
47
+ --muted-foreground: oklch(0.46 0.02 265);
48
48
 
49
49
  /* ------------------------------------------------------------
50
50
  Action (user intent)
51
51
  ------------------------------------------------------------ */
52
52
 
53
53
  /* Buttons, links, explicit user actions */
54
- --primary: oklch(0.54 0.11 255);
54
+ --primary: oklch(0.5 0.08 255);
55
55
  --primary-foreground: oklch(1 0 0);
56
56
 
57
- /* Secondary actions (less prominent than primary) */
58
- --secondary: oklch(0.96 0.003 260);
59
- --secondary-foreground: oklch(0.24 0.015 265);
57
+ /* Secondary: ghost buttons, toggles, secondary CTAs */
58
+ --secondary: oklch(0.93 0.01 260);
59
+ --secondary-foreground: oklch(0.22 0.02 265);
60
60
 
61
- /* Soft contextual highlights */
62
- --accent: oklch(0.945 0.005 260);
63
- --accent-foreground: oklch(0.28 0.01 260);
61
+ /* Accent: hover highlights, active nav items, selected state */
62
+ --accent: oklch(0.92 0.04 255);
63
+ --accent-foreground: oklch(0.22 0.03 255);
64
64
 
65
65
  /* ------------------------------------------------------------
66
66
  Destructive (still calm)
67
67
  ------------------------------------------------------------ */
68
68
 
69
- --destructive: oklch(0.54 0.17 25);
69
+ --destructive: oklch(0.54 0.2 25);
70
70
  --destructive-foreground: oklch(1 0 0);
71
71
 
72
72
  /* ------------------------------------------------------------
73
73
  System states
74
74
  ------------------------------------------------------------ */
75
75
 
76
- --warning: oklch(0.7 0.12 88); /* amber */
77
- --warning-foreground: oklch(0.24 0.02 265);
76
+ --warning: oklch(0.72 0.15 88); /* amber */
77
+ --warning-foreground: oklch(0.22 0.02 265);
78
78
 
79
- --error: oklch(0.56 0.16 24); /* muted red */
79
+ --error: oklch(0.56 0.19 24); /* red */
80
80
  --error-foreground: oklch(1 0 0);
81
81
 
82
- --success: oklch(0.64 0.1 150); /* sleek green */
82
+ --success: oklch(0.64 0.14 150); /* green */
83
83
  --success-foreground: oklch(1 0 0);
84
84
 
85
- --info: oklch(0.58 0.1 255); /* informational blue */
85
+ --info: oklch(0.58 0.14 255); /* blue */
86
86
  --info-foreground: oklch(1 0 0);
87
87
 
88
88
  /* ------------------------------------------------------------
89
89
  Charts (analytical, not marketing)
90
90
  ------------------------------------------------------------ */
91
91
 
92
- --chart-1: oklch(0.53 0.1 255); /* primary series */
93
- --chart-2: oklch(0.56 0.075 205); /* secondary series */
94
- --chart-3: oklch(0.5 0.03 265); /* neutral */
95
- --chart-4: oklch(0.65 0.08 90); /* attention */
96
- --chart-5: oklch(0.6 0.08 28); /* muted risk */
92
+ --chart-1: oklch(0.52 0.15 255); /* primary series */
93
+ --chart-2: oklch(0.55 0.1 205); /* secondary series */
94
+ --chart-3: oklch(0.5 0.05 265); /* neutral */
95
+ --chart-4: oklch(0.65 0.12 90); /* attention */
96
+ --chart-5: oklch(0.6 0.12 28); /* warm accent */
97
97
 
98
98
  /* ------------------------------------------------------------
99
99
  Radius
@@ -105,16 +105,16 @@
105
105
  Sidebar
106
106
  ------------------------------------------------------------ */
107
107
 
108
- --sidebar: oklch(0.955 0.003 260);
109
- --sidebar-foreground: oklch(0.22 0.012 260);
108
+ --sidebar: oklch(0.975 0.004 260);
109
+ --sidebar-foreground: oklch(0.2 0.015 260);
110
110
 
111
111
  --sidebar-primary: var(--primary);
112
112
  --sidebar-primary-foreground: var(--primary-foreground);
113
113
 
114
- --sidebar-accent: oklch(0.935 0.006 260);
115
- --sidebar-accent-foreground: oklch(0.18 0.01 260);
114
+ --sidebar-accent: oklch(0.955 0.008 255);
115
+ --sidebar-accent-foreground: oklch(0.18 0.015 260);
116
116
 
117
- --sidebar-border: oklch(0.88 0.004 260);
117
+ --sidebar-border: oklch(0.9 0.006 260);
118
118
  --sidebar-ring: var(--ring);
119
119
 
120
120
  color-scheme: light;
@@ -125,60 +125,60 @@
125
125
  ============================================================ */
126
126
 
127
127
  .dark {
128
- --background: oklch(0.15 0.008 265);
129
- --foreground: oklch(0.94 0.004 265);
128
+ --background: oklch(0.12 0.014 265);
129
+ --foreground: oklch(0.93 0.006 265);
130
130
 
131
- --card: oklch(0.2 0.01 265);
132
- --card-foreground: oklch(0.94 0.004 265);
131
+ --card: oklch(0.17 0.012 260);
132
+ --card-foreground: oklch(0.93 0.006 265);
133
133
 
134
- --popover: oklch(0.21 0.01 265);
135
- --popover-foreground: oklch(0.94 0.004 265);
134
+ --popover: oklch(0.18 0.012 260);
135
+ --popover-foreground: oklch(0.93 0.006 265);
136
136
 
137
- --border: oklch(0.34 0.006 260);
138
- --input: oklch(0.24 0.008 260);
139
- --ring: oklch(0.62 0.1 255);
137
+ --border: oklch(0.32 0.012 260);
138
+ --input: oklch(0.23 0.012 260);
139
+ --ring: oklch(0.62 0.14 255);
140
140
 
141
- --muted: oklch(0.26 0.01 265);
142
- --muted-foreground: oklch(0.72 0.004 265);
141
+ --muted: oklch(0.2 0.008 260);
142
+ --muted-foreground: oklch(0.7 0.008 265);
143
143
 
144
- --primary: oklch(0.66 0.12 255);
145
- --primary-foreground: oklch(0.18 0.01 265);
144
+ --primary: oklch(0.58 0.08 255);
145
+ --primary-foreground: oklch(0.16 0.01 265);
146
146
 
147
- --secondary: oklch(0.25 0.008 260);
148
- --secondary-foreground: oklch(0.91 0.004 265);
147
+ --secondary: oklch(0.23 0.014 260);
148
+ --secondary-foreground: oklch(0.9 0.006 265);
149
149
 
150
- --accent: oklch(0.29 0.02 255);
151
- --accent-foreground: oklch(0.93 0.004 265);
150
+ --accent: oklch(0.26 0.04 255);
151
+ --accent-foreground: oklch(0.92 0.008 255);
152
152
 
153
- --destructive: oklch(0.58 0.16 25);
154
- --destructive-foreground: oklch(0.17 0.01 265);
153
+ --destructive: oklch(0.58 0.19 25);
154
+ --destructive-foreground: oklch(0.15 0.01 265);
155
155
 
156
- --warning: oklch(0.74 0.12 88); /* amber */
157
- --warning-foreground: oklch(0.19 0.01 265);
158
- --error: oklch(0.6 0.15 24); /* muted red */
159
- --error-foreground: oklch(0.17 0.01 265);
160
- --success: oklch(0.69 0.1 150); /* sleek green */
161
- --success-foreground: oklch(0.17 0.01 265);
156
+ --warning: oklch(0.74 0.15 88); /* amber */
157
+ --warning-foreground: oklch(0.17 0.01 265);
158
+ --error: oklch(0.6 0.18 24); /* red */
159
+ --error-foreground: oklch(0.15 0.01 265);
160
+ --success: oklch(0.69 0.14 150); /* green */
161
+ --success-foreground: oklch(0.15 0.01 265);
162
162
 
163
- --info: oklch(0.68 0.1 255); /* informational blue */
164
- --info-foreground: oklch(0.17 0.01 265);
163
+ --info: oklch(0.68 0.14 255); /* blue */
164
+ --info-foreground: oklch(0.15 0.01 265);
165
165
 
166
- --chart-1: oklch(0.63 0.12 255); /* primary series */
167
- --chart-2: oklch(0.66 0.09 205);
168
- --chart-3: oklch(0.62 0.04 265);
169
- --chart-4: oklch(0.74 0.1 90);
170
- --chart-5: oklch(0.68 0.1 28);
166
+ --chart-1: oklch(0.62 0.16 255); /* primary series */
167
+ --chart-2: oklch(0.65 0.12 205);
168
+ --chart-3: oklch(0.6 0.06 265);
169
+ --chart-4: oklch(0.73 0.13 90);
170
+ --chart-5: oklch(0.67 0.13 28);
171
171
 
172
- --sidebar: oklch(0.13 0.008 260);
173
- --sidebar-foreground: oklch(0.9 0.003 265);
172
+ --sidebar: oklch(0.15 0.012 260);
173
+ --sidebar-foreground: oklch(0.9 0.005 265);
174
174
 
175
175
  --sidebar-primary: var(--primary);
176
176
  --sidebar-primary-foreground: var(--primary-foreground);
177
177
 
178
- --sidebar-accent: oklch(0.22 0.01 260);
179
- --sidebar-accent-foreground: oklch(0.92 0.003 265);
178
+ --sidebar-accent: oklch(0.22 0.02 255);
179
+ --sidebar-accent-foreground: oklch(0.92 0.005 265);
180
180
 
181
- --sidebar-border: oklch(0.28 0.008 260);
181
+ --sidebar-border: oklch(0.28 0.01 260);
182
182
  --sidebar-ring: var(--ring);
183
183
 
184
184
  color-scheme: dark;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@thalamiq/ui",
3
- "version": "0.1.18",
3
+ "version": "0.1.20",
4
4
  "private": false,
5
5
  "publishConfig": {
6
6
  "access": "public",