@polyxd/ds-glass 0.3.0

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.
Files changed (9) hide show
  1. package/LICENSE +202 -0
  2. package/NOTICE +190 -0
  3. package/README.md +48 -0
  4. package/manifest.json +29 -0
  5. package/package.json +28 -0
  6. package/tokens/semantic.json +433 -0
  7. package/tokens/system.dark.json +316 -0
  8. package/tokens/system.json +313 -0
  9. package/tokens/system.light.json +316 -0
package/tokens/system.light.json ADDED
@@ -0,0 +1,316 @@
1
+ {
2
+ "$description": "Glass, light mode: the palette (named colours) and the roles that pick from it. Change a palette entry to recolour every role that uses it; point a role at a different entry to change one thing.",
3
+ "glass": {
4
+ "palette": {
5
+ "$type": "color",
6
+ "ground": {
7
+ "$value": "#e6ebf7"
8
+ },
9
+ "frost-thin": {
10
+ "$value": "rgba(255, 255, 255, 0.45)"
11
+ },
12
+ "frost": {
13
+ "$value": "rgba(255, 255, 255, 0.65)"
14
+ },
15
+ "frost-thick": {
16
+ "$value": "rgba(255, 255, 255, 0.82)"
17
+ },
18
+ "frost-edge": {
19
+ "$value": "rgba(255, 255, 255, 0.75)"
20
+ },
21
+ "deep": {
22
+ "$value": "#101a33"
23
+ },
24
+ "ink": {
25
+ "$value": "#0f172a"
26
+ },
27
+ "ink-soft": {
28
+ "$value": "#465063"
29
+ },
30
+ "steel": {
31
+ "$value": "#68758f"
32
+ },
33
+ "blue": {
34
+ "$value": "#3552c9"
35
+ },
36
+ "blue-deep": {
37
+ "$value": "#243a8f"
38
+ },
39
+ "blue-wash": {
40
+ "$value": "rgba(219, 228, 255, 0.8)"
41
+ },
42
+ "white": {
43
+ "$value": "#ffffff"
44
+ },
45
+ "red": {
46
+ "$value": "#c22f4a"
47
+ },
48
+ "red-deep": {
49
+ "$value": "#8a1f34"
50
+ },
51
+ "red-wash": {
52
+ "$value": "rgba(250, 222, 228, 0.8)"
53
+ },
54
+ "green": {
55
+ "$value": "#1f7f5c"
56
+ },
57
+ "green-deep": {
58
+ "$value": "#155a40"
59
+ },
60
+ "green-wash": {
61
+ "$value": "rgba(216, 240, 230, 0.8)"
62
+ },
63
+ "amber": {
64
+ "$value": "#9a6200"
65
+ },
66
+ "amber-deep": {
67
+ "$value": "#6b4400"
68
+ },
69
+ "amber-wash": {
70
+ "$value": "rgba(250, 237, 210, 0.8)"
71
+ },
72
+ "cyan": {
73
+ "$value": "#0c7a92"
74
+ },
75
+ "cyan-deep": {
76
+ "$value": "#085566"
77
+ },
78
+ "cyan-wash": {
79
+ "$value": "rgba(214, 236, 244, 0.8)"
80
+ },
81
+ "violet": {
82
+ "$value": "#6b45c9"
83
+ },
84
+ "rose": {
85
+ "$value": "#b23a7a"
86
+ }
87
+ },
88
+ "sys": {
89
+ "$type": "color",
90
+ "surface-default": {
91
+ "$value": "{glass.palette.ground}",
92
+ "$description": "Main page background"
93
+ },
94
+ "surface-subtle": {
95
+ "$value": "{glass.palette.frost-thin}",
96
+ "$description": "Grouping background: table headers, wells"
97
+ },
98
+ "surface-raised": {
99
+ "$value": "{glass.palette.frost}",
100
+ "$description": "Cards and sheets"
101
+ },
102
+ "surface-overlay": {
103
+ "$value": "{glass.palette.frost-thick}",
104
+ "$description": "Dialogs and popovers"
105
+ },
106
+ "surface-inverse": {
107
+ "$value": "{glass.palette.deep}",
108
+ "$description": "Snackbars and tooltips"
109
+ },
110
+ "scrim": {
111
+ "$value": "rgba(16, 26, 51, 0.35)"
112
+ },
113
+ "text-default": {
114
+ "$value": "{glass.palette.ink}"
115
+ },
116
+ "text-muted": {
117
+ "$value": "{glass.palette.ink-soft}"
118
+ },
119
+ "text-inverse": {
120
+ "$value": "{glass.palette.white}"
121
+ },
122
+ "text-link": {
123
+ "$value": "{glass.palette.blue}",
124
+ "$description": "Inline links"
125
+ },
126
+ "border-default": {
127
+ "$value": "{glass.palette.frost-edge}"
128
+ },
129
+ "border-strong": {
130
+ "$value": "{glass.palette.steel}",
131
+ "$description": "Input outlines (3:1 on the page)"
132
+ },
133
+ "border-focus": {
134
+ "$value": "{glass.palette.blue}",
135
+ "$description": "Keyboard focus ring (3:1 on the page)"
136
+ },
137
+ "action-primary-background": {
138
+ "$value": "{glass.palette.blue}"
139
+ },
140
+ "action-primary-foreground": {
141
+ "$value": "{glass.palette.white}"
142
+ },
143
+ "action-secondary-background": {
144
+ "$value": "{glass.palette.frost-thick}"
145
+ },
146
+ "action-secondary-foreground": {
147
+ "$value": "{glass.palette.ink}"
148
+ },
149
+ "action-secondary-border": {
150
+ "$value": "{glass.palette.frost-edge}"
151
+ },
152
+ "action-danger-background": {
153
+ "$value": "{glass.palette.red}"
154
+ },
155
+ "action-danger-foreground": {
156
+ "$value": "{glass.palette.white}"
157
+ },
158
+ "selection-background": {
159
+ "$value": "{glass.palette.blue-wash}"
160
+ },
161
+ "selection-foreground": {
162
+ "$value": "{glass.palette.blue-deep}"
163
+ },
164
+ "status-info-background": {
165
+ "$value": "{glass.palette.cyan-wash}"
166
+ },
167
+ "status-info-foreground": {
168
+ "$value": "{glass.palette.cyan-deep}"
169
+ },
170
+ "status-info-emphasis": {
171
+ "$value": "{glass.palette.cyan}"
172
+ },
173
+ "status-success-background": {
174
+ "$value": "{glass.palette.green-wash}"
175
+ },
176
+ "status-success-foreground": {
177
+ "$value": "{glass.palette.green-deep}"
178
+ },
179
+ "status-success-emphasis": {
180
+ "$value": "{glass.palette.green}"
181
+ },
182
+ "status-warning-background": {
183
+ "$value": "{glass.palette.amber-wash}"
184
+ },
185
+ "status-warning-foreground": {
186
+ "$value": "{glass.palette.amber-deep}"
187
+ },
188
+ "status-warning-emphasis": {
189
+ "$value": "{glass.palette.amber}"
190
+ },
191
+ "status-danger-background": {
192
+ "$value": "{glass.palette.red-wash}"
193
+ },
194
+ "status-danger-foreground": {
195
+ "$value": "{glass.palette.red-deep}"
196
+ },
197
+ "status-danger-emphasis": {
198
+ "$value": "{glass.palette.red}"
199
+ },
200
+ "data-1": {
201
+ "$value": "{glass.palette.blue}"
202
+ },
203
+ "data-2": {
204
+ "$value": "{glass.palette.cyan}"
205
+ },
206
+ "data-3": {
207
+ "$value": "{glass.palette.green}"
208
+ },
209
+ "data-4": {
210
+ "$value": "{glass.palette.amber}"
211
+ },
212
+ "data-5": {
213
+ "$value": "{glass.palette.violet}"
214
+ },
215
+ "data-6": {
216
+ "$value": "{glass.palette.rose}"
217
+ },
218
+ "data-positive": {
219
+ "$value": "{glass.palette.green}"
220
+ },
221
+ "data-negative": {
222
+ "$value": "{glass.palette.red}"
223
+ },
224
+ "data-neutral": {
225
+ "$value": "{glass.palette.steel}"
226
+ }
227
+ },
228
+ "shadow": {
229
+ "$type": "shadow",
230
+ "raised": {
231
+ "$value": [
232
+ {
233
+ "offsetX": {
234
+ "value": 0,
235
+ "unit": "px"
236
+ },
237
+ "offsetY": {
238
+ "value": 8,
239
+ "unit": "px"
240
+ },
241
+ "blur": {
242
+ "value": 32,
243
+ "unit": "px"
244
+ },
245
+ "spread": {
246
+ "value": 0,
247
+ "unit": "px"
248
+ },
249
+ "color": "rgba(31, 38, 135, 0.12)"
250
+ },
251
+ {
252
+ "offsetX": {
253
+ "value": 0,
254
+ "unit": "px"
255
+ },
256
+ "offsetY": {
257
+ "value": 1,
258
+ "unit": "px"
259
+ },
260
+ "blur": {
261
+ "value": 0,
262
+ "unit": "px"
263
+ },
264
+ "spread": {
265
+ "value": 0,
266
+ "unit": "px"
267
+ },
268
+ "color": "rgba(255, 255, 255, 0.6)"
269
+ }
270
+ ]
271
+ },
272
+ "overlay": {
273
+ "$value": [
274
+ {
275
+ "offsetX": {
276
+ "value": 0,
277
+ "unit": "px"
278
+ },
279
+ "offsetY": {
280
+ "value": 24,
281
+ "unit": "px"
282
+ },
283
+ "blur": {
284
+ "value": 64,
285
+ "unit": "px"
286
+ },
287
+ "spread": {
288
+ "value": 0,
289
+ "unit": "px"
290
+ },
291
+ "color": "rgba(31, 38, 135, 0.22)"
292
+ },
293
+ {
294
+ "offsetX": {
295
+ "value": 0,
296
+ "unit": "px"
297
+ },
298
+ "offsetY": {
299
+ "value": 1,
300
+ "unit": "px"
301
+ },
302
+ "blur": {
303
+ "value": 0,
304
+ "unit": "px"
305
+ },
306
+ "spread": {
307
+ "value": 0,
308
+ "unit": "px"
309
+ },
310
+ "color": "rgba(255, 255, 255, 0.7)"
311
+ }
312
+ ]
313
+ }
314
+ }
315
+ }
316
+ }