@esri/calcite-design-tokens 3.2.0-next.3 → 3.2.0-next.4
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/css/semantic.css +0 -22
- package/dist/docs/core.json +1 -1
- package/dist/docs/dark.json +1 -1
- package/dist/docs/global.json +1 -1
- package/dist/docs/light.json +1 -1
- package/dist/docs/semantic.json +1 -479
- package/dist/es6/semantic.d.ts +0 -24
- package/dist/es6/semantic.js +0 -12
- package/dist/js/semantic.d.ts +0 -16
- package/dist/js/semantic.js +0 -658
- package/dist/scss/semantic.scss +0 -22
- package/package.json +2 -2
package/dist/css/semantic.css
CHANGED
|
@@ -4,8 +4,6 @@
|
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
:root {
|
|
7
|
-
--calcite-container-size-height-xxs-min: 0; /** Small handheld devices and mini-windows */
|
|
8
|
-
--calcite-container-size-width-xxs-min: 0; /** Small handheld devices and mini-windows */
|
|
9
7
|
--calcite-border-width-none: 0;
|
|
10
8
|
--calcite-border-width-sm: 1px;
|
|
11
9
|
--calcite-border-width-md: 2px;
|
|
@@ -113,26 +111,6 @@
|
|
|
113
111
|
--calcite-z-index-modal: 800;
|
|
114
112
|
--calcite-z-index-popup: 900;
|
|
115
113
|
--calcite-z-index-tooltip: 901;
|
|
116
|
-
--calcite-container-size-height-xxs-max: 154px; /** Small handheld devices and mini-windows */
|
|
117
|
-
--calcite-container-size-height-xs-min: 155px; /** Handheld devices */
|
|
118
|
-
--calcite-container-size-height-xs-max: 328px; /** Handheld devices */
|
|
119
|
-
--calcite-container-size-height-sm-min: 329px; /** Small tablets */
|
|
120
|
-
--calcite-container-size-height-sm-max: 504px; /** Small tablets */
|
|
121
|
-
--calcite-container-size-height-md-min: 505px; /** Small laptops */
|
|
122
|
-
--calcite-container-size-height-md-max: 678px; /** Small laptops */
|
|
123
|
-
--calcite-container-size-height-lg-min: 679px; /** Large laptops and desktop computers */
|
|
124
|
-
--calcite-container-size-height-lg-max: 854px; /** Large laptops and desktop computers */
|
|
125
|
-
--calcite-container-size-height-xl-min: 855px; /** Projectors and televisions */
|
|
126
|
-
--calcite-container-size-width-xxs-max: 320px; /** Small handheld devices and mini-windows */
|
|
127
|
-
--calcite-container-size-width-xs-min: 321px; /** Handheld devices */
|
|
128
|
-
--calcite-container-size-width-xs-max: 476px; /** Handheld devices */
|
|
129
|
-
--calcite-container-size-width-sm-min: 477px; /** Small tablets */
|
|
130
|
-
--calcite-container-size-width-sm-max: 768px; /** Small tablets */
|
|
131
|
-
--calcite-container-size-width-md-min: 769px; /** Small laptops */
|
|
132
|
-
--calcite-container-size-width-md-max: 1152px; /** Small laptops */
|
|
133
|
-
--calcite-container-size-width-lg-min: 1153px; /** Large laptops and desktop computers */
|
|
134
|
-
--calcite-container-size-width-lg-max: 1440px; /** Large laptops and desktop computers */
|
|
135
|
-
--calcite-container-size-width-xl-min: 1441px; /** Projectors and televisions */
|
|
136
114
|
--calcite-corner-radius: var(--calcite-corner-radius-none);
|
|
137
115
|
--calcite-shadow-none: 0 0 0 0 rgba(0, 0, 0, 0);
|
|
138
116
|
--calcite-shadow-sm: 0 2px 8px 0 rgba(0, 0, 0, 0.04), 0 4px 16px 0 rgba(0, 0, 0, 0.08);
|
package/dist/docs/core.json
CHANGED
package/dist/docs/dark.json
CHANGED
package/dist/docs/global.json
CHANGED
package/dist/docs/light.json
CHANGED
package/dist/docs/semantic.json
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
{
|
|
2
|
-
"timestamp":
|
|
2
|
+
"timestamp": 1750922436584,
|
|
3
3
|
"tokens": [
|
|
4
4
|
{
|
|
5
5
|
"key": "{semantic.border.width.none}",
|
|
@@ -109,484 +109,6 @@
|
|
|
109
109
|
"name": "Border Width Lg",
|
|
110
110
|
"path": ["semantic", "border", "width", "lg"]
|
|
111
111
|
},
|
|
112
|
-
{
|
|
113
|
-
"key": "{semantic.container-size.height.xxs}",
|
|
114
|
-
"value": "{\"min\":\"0\",\"max\":\"154px\"}",
|
|
115
|
-
"type": "dimension",
|
|
116
|
-
"description": "Small handheld devices and mini-windows",
|
|
117
|
-
"attributes": {
|
|
118
|
-
"category": "breakpoint",
|
|
119
|
-
"type": "dimension",
|
|
120
|
-
"item": "height",
|
|
121
|
-
"subitem": "xxs",
|
|
122
|
-
"value": {
|
|
123
|
-
"min": "0",
|
|
124
|
-
"max": "154px"
|
|
125
|
-
},
|
|
126
|
-
"description": "Small handheld devices and mini-windows",
|
|
127
|
-
"filePath": "src/tokens/semantic/container-size.json",
|
|
128
|
-
"isSource": true,
|
|
129
|
-
"key": "{semantic.container-size.height.xxs}",
|
|
130
|
-
"name": "calcite-semantic-container-size-height-xxs",
|
|
131
|
-
"path": ["semantic", "container-size", "height", "xxs"],
|
|
132
|
-
"comment": "Small handheld devices and mini-windows",
|
|
133
|
-
"names": {
|
|
134
|
-
"scss": "$calcite-container-size-height-xxs",
|
|
135
|
-
"css": "var(--calcite-container-size-height-xxs)",
|
|
136
|
-
"js": "semantic.container-size.height.xxs",
|
|
137
|
-
"docs": "semantic.container-size.height.xxs",
|
|
138
|
-
"es6": "calciteContainerSizeHeightXxs"
|
|
139
|
-
},
|
|
140
|
-
"calcite-schema": {
|
|
141
|
-
"system": "calcite",
|
|
142
|
-
"tier": "semantic",
|
|
143
|
-
"type": "dimension"
|
|
144
|
-
}
|
|
145
|
-
},
|
|
146
|
-
"filePath": "src/tokens/semantic/container-size.json",
|
|
147
|
-
"isSource": true,
|
|
148
|
-
"name": "Container Size Height Xxs",
|
|
149
|
-
"path": ["semantic", "container-size", "height", "xxs"],
|
|
150
|
-
"comment": "Small handheld devices and mini-windows"
|
|
151
|
-
},
|
|
152
|
-
{
|
|
153
|
-
"key": "{semantic.container-size.height.xs}",
|
|
154
|
-
"value": "{\"min\":\"155px\",\"max\":\"328px\"}",
|
|
155
|
-
"type": "dimension",
|
|
156
|
-
"description": "Handheld devices",
|
|
157
|
-
"attributes": {
|
|
158
|
-
"category": "breakpoint",
|
|
159
|
-
"type": "dimension",
|
|
160
|
-
"item": "height",
|
|
161
|
-
"subitem": "xs",
|
|
162
|
-
"value": {
|
|
163
|
-
"min": "154px + 1",
|
|
164
|
-
"max": "328px"
|
|
165
|
-
},
|
|
166
|
-
"description": "Handheld devices",
|
|
167
|
-
"filePath": "src/tokens/semantic/container-size.json",
|
|
168
|
-
"isSource": true,
|
|
169
|
-
"key": "{semantic.container-size.height.xs}",
|
|
170
|
-
"name": "calcite-semantic-container-size-height-xs",
|
|
171
|
-
"path": ["semantic", "container-size", "height", "xs"],
|
|
172
|
-
"comment": "Handheld devices",
|
|
173
|
-
"names": {
|
|
174
|
-
"scss": "$calcite-container-size-height-xs",
|
|
175
|
-
"css": "var(--calcite-container-size-height-xs)",
|
|
176
|
-
"js": "semantic.container-size.height.xs",
|
|
177
|
-
"docs": "semantic.container-size.height.xs",
|
|
178
|
-
"es6": "calciteContainerSizeHeightXs"
|
|
179
|
-
},
|
|
180
|
-
"calcite-schema": {
|
|
181
|
-
"system": "calcite",
|
|
182
|
-
"tier": "semantic",
|
|
183
|
-
"type": "dimension"
|
|
184
|
-
}
|
|
185
|
-
},
|
|
186
|
-
"filePath": "src/tokens/semantic/container-size.json",
|
|
187
|
-
"isSource": true,
|
|
188
|
-
"name": "Container Size Height Xs",
|
|
189
|
-
"path": ["semantic", "container-size", "height", "xs"],
|
|
190
|
-
"comment": "Handheld devices"
|
|
191
|
-
},
|
|
192
|
-
{
|
|
193
|
-
"key": "{semantic.container-size.height.sm}",
|
|
194
|
-
"value": "{\"min\":\"329px\",\"max\":\"504px\"}",
|
|
195
|
-
"type": "dimension",
|
|
196
|
-
"description": "Small tablets",
|
|
197
|
-
"attributes": {
|
|
198
|
-
"category": "breakpoint",
|
|
199
|
-
"type": "dimension",
|
|
200
|
-
"item": "height",
|
|
201
|
-
"subitem": "sm",
|
|
202
|
-
"value": {
|
|
203
|
-
"min": "328px + 1",
|
|
204
|
-
"max": "504px"
|
|
205
|
-
},
|
|
206
|
-
"description": "Small tablets",
|
|
207
|
-
"filePath": "src/tokens/semantic/container-size.json",
|
|
208
|
-
"isSource": true,
|
|
209
|
-
"key": "{semantic.container-size.height.sm}",
|
|
210
|
-
"name": "calcite-semantic-container-size-height-sm",
|
|
211
|
-
"path": ["semantic", "container-size", "height", "sm"],
|
|
212
|
-
"comment": "Small tablets",
|
|
213
|
-
"names": {
|
|
214
|
-
"scss": "$calcite-container-size-height-sm",
|
|
215
|
-
"css": "var(--calcite-container-size-height-sm)",
|
|
216
|
-
"js": "semantic.container-size.height.sm",
|
|
217
|
-
"docs": "semantic.container-size.height.sm",
|
|
218
|
-
"es6": "calciteContainerSizeHeightSm"
|
|
219
|
-
},
|
|
220
|
-
"calcite-schema": {
|
|
221
|
-
"system": "calcite",
|
|
222
|
-
"tier": "semantic",
|
|
223
|
-
"type": "dimension"
|
|
224
|
-
}
|
|
225
|
-
},
|
|
226
|
-
"filePath": "src/tokens/semantic/container-size.json",
|
|
227
|
-
"isSource": true,
|
|
228
|
-
"name": "Container Size Height Sm",
|
|
229
|
-
"path": ["semantic", "container-size", "height", "sm"],
|
|
230
|
-
"comment": "Small tablets"
|
|
231
|
-
},
|
|
232
|
-
{
|
|
233
|
-
"key": "{semantic.container-size.height.md}",
|
|
234
|
-
"value": "{\"min\":\"505px\",\"max\":\"678px\"}",
|
|
235
|
-
"type": "dimension",
|
|
236
|
-
"description": "Small laptops",
|
|
237
|
-
"attributes": {
|
|
238
|
-
"category": "breakpoint",
|
|
239
|
-
"type": "dimension",
|
|
240
|
-
"item": "height",
|
|
241
|
-
"subitem": "md",
|
|
242
|
-
"value": {
|
|
243
|
-
"min": "504px + 1",
|
|
244
|
-
"max": "678px"
|
|
245
|
-
},
|
|
246
|
-
"description": "Small laptops",
|
|
247
|
-
"filePath": "src/tokens/semantic/container-size.json",
|
|
248
|
-
"isSource": true,
|
|
249
|
-
"key": "{semantic.container-size.height.md}",
|
|
250
|
-
"name": "calcite-semantic-container-size-height-md",
|
|
251
|
-
"path": ["semantic", "container-size", "height", "md"],
|
|
252
|
-
"comment": "Small laptops",
|
|
253
|
-
"names": {
|
|
254
|
-
"scss": "$calcite-container-size-height-md",
|
|
255
|
-
"css": "var(--calcite-container-size-height-md)",
|
|
256
|
-
"js": "semantic.container-size.height.md",
|
|
257
|
-
"docs": "semantic.container-size.height.md",
|
|
258
|
-
"es6": "calciteContainerSizeHeightMd"
|
|
259
|
-
},
|
|
260
|
-
"calcite-schema": {
|
|
261
|
-
"system": "calcite",
|
|
262
|
-
"tier": "semantic",
|
|
263
|
-
"type": "dimension"
|
|
264
|
-
}
|
|
265
|
-
},
|
|
266
|
-
"filePath": "src/tokens/semantic/container-size.json",
|
|
267
|
-
"isSource": true,
|
|
268
|
-
"name": "Container Size Height Md",
|
|
269
|
-
"path": ["semantic", "container-size", "height", "md"],
|
|
270
|
-
"comment": "Small laptops"
|
|
271
|
-
},
|
|
272
|
-
{
|
|
273
|
-
"key": "{semantic.container-size.height.lg}",
|
|
274
|
-
"value": "{\"min\":\"679px\",\"max\":\"854px\"}",
|
|
275
|
-
"type": "dimension",
|
|
276
|
-
"description": "Large laptops and desktop computers",
|
|
277
|
-
"attributes": {
|
|
278
|
-
"category": "breakpoint",
|
|
279
|
-
"type": "dimension",
|
|
280
|
-
"item": "height",
|
|
281
|
-
"subitem": "lg",
|
|
282
|
-
"value": {
|
|
283
|
-
"min": "678px + 1",
|
|
284
|
-
"max": "854px"
|
|
285
|
-
},
|
|
286
|
-
"description": "Large laptops and desktop computers",
|
|
287
|
-
"filePath": "src/tokens/semantic/container-size.json",
|
|
288
|
-
"isSource": true,
|
|
289
|
-
"key": "{semantic.container-size.height.lg}",
|
|
290
|
-
"name": "calcite-semantic-container-size-height-lg",
|
|
291
|
-
"path": ["semantic", "container-size", "height", "lg"],
|
|
292
|
-
"comment": "Large laptops and desktop computers",
|
|
293
|
-
"names": {
|
|
294
|
-
"scss": "$calcite-container-size-height-lg",
|
|
295
|
-
"css": "var(--calcite-container-size-height-lg)",
|
|
296
|
-
"js": "semantic.container-size.height.lg",
|
|
297
|
-
"docs": "semantic.container-size.height.lg",
|
|
298
|
-
"es6": "calciteContainerSizeHeightLg"
|
|
299
|
-
},
|
|
300
|
-
"calcite-schema": {
|
|
301
|
-
"system": "calcite",
|
|
302
|
-
"tier": "semantic",
|
|
303
|
-
"type": "dimension"
|
|
304
|
-
}
|
|
305
|
-
},
|
|
306
|
-
"filePath": "src/tokens/semantic/container-size.json",
|
|
307
|
-
"isSource": true,
|
|
308
|
-
"name": "Container Size Height Lg",
|
|
309
|
-
"path": ["semantic", "container-size", "height", "lg"],
|
|
310
|
-
"comment": "Large laptops and desktop computers"
|
|
311
|
-
},
|
|
312
|
-
{
|
|
313
|
-
"key": "{semantic.container-size.height.xl}",
|
|
314
|
-
"value": "{\"min\":\"855px\"}",
|
|
315
|
-
"type": "dimension",
|
|
316
|
-
"description": "Projectors and televisions",
|
|
317
|
-
"attributes": {
|
|
318
|
-
"category": "breakpoint",
|
|
319
|
-
"type": "dimension",
|
|
320
|
-
"item": "height",
|
|
321
|
-
"subitem": "xl",
|
|
322
|
-
"value": {
|
|
323
|
-
"min": "854px + 1"
|
|
324
|
-
},
|
|
325
|
-
"description": "Projectors and televisions",
|
|
326
|
-
"filePath": "src/tokens/semantic/container-size.json",
|
|
327
|
-
"isSource": true,
|
|
328
|
-
"key": "{semantic.container-size.height.xl}",
|
|
329
|
-
"name": "calcite-semantic-container-size-height-xl",
|
|
330
|
-
"path": ["semantic", "container-size", "height", "xl"],
|
|
331
|
-
"comment": "Projectors and televisions",
|
|
332
|
-
"names": {
|
|
333
|
-
"scss": "$calcite-container-size-height-xl",
|
|
334
|
-
"css": "var(--calcite-container-size-height-xl)",
|
|
335
|
-
"js": "semantic.container-size.height.xl",
|
|
336
|
-
"docs": "semantic.container-size.height.xl",
|
|
337
|
-
"es6": "calciteContainerSizeHeightXl"
|
|
338
|
-
},
|
|
339
|
-
"calcite-schema": {
|
|
340
|
-
"system": "calcite",
|
|
341
|
-
"tier": "semantic",
|
|
342
|
-
"type": "dimension"
|
|
343
|
-
}
|
|
344
|
-
},
|
|
345
|
-
"filePath": "src/tokens/semantic/container-size.json",
|
|
346
|
-
"isSource": true,
|
|
347
|
-
"name": "Container Size Height Xl",
|
|
348
|
-
"path": ["semantic", "container-size", "height", "xl"],
|
|
349
|
-
"comment": "Projectors and televisions"
|
|
350
|
-
},
|
|
351
|
-
{
|
|
352
|
-
"key": "{semantic.container-size.width.xxs}",
|
|
353
|
-
"value": "{\"min\":\"0\",\"max\":\"320px\"}",
|
|
354
|
-
"type": "dimension",
|
|
355
|
-
"description": "Small handheld devices and mini-windows",
|
|
356
|
-
"attributes": {
|
|
357
|
-
"category": "breakpoint",
|
|
358
|
-
"type": "dimension",
|
|
359
|
-
"item": "width",
|
|
360
|
-
"subitem": "xxs",
|
|
361
|
-
"value": {
|
|
362
|
-
"min": "0",
|
|
363
|
-
"max": "320px"
|
|
364
|
-
},
|
|
365
|
-
"description": "Small handheld devices and mini-windows",
|
|
366
|
-
"filePath": "src/tokens/semantic/container-size.json",
|
|
367
|
-
"isSource": true,
|
|
368
|
-
"key": "{semantic.container-size.width.xxs}",
|
|
369
|
-
"name": "calcite-semantic-container-size-width-xxs",
|
|
370
|
-
"path": ["semantic", "container-size", "width", "xxs"],
|
|
371
|
-
"comment": "Small handheld devices and mini-windows",
|
|
372
|
-
"names": {
|
|
373
|
-
"scss": "$calcite-container-size-width-xxs",
|
|
374
|
-
"css": "var(--calcite-container-size-width-xxs)",
|
|
375
|
-
"js": "semantic.container-size.width.xxs",
|
|
376
|
-
"docs": "semantic.container-size.width.xxs",
|
|
377
|
-
"es6": "calciteContainerSizeWidthXxs"
|
|
378
|
-
},
|
|
379
|
-
"calcite-schema": {
|
|
380
|
-
"system": "calcite",
|
|
381
|
-
"tier": "semantic",
|
|
382
|
-
"type": "dimension"
|
|
383
|
-
}
|
|
384
|
-
},
|
|
385
|
-
"filePath": "src/tokens/semantic/container-size.json",
|
|
386
|
-
"isSource": true,
|
|
387
|
-
"name": "Container Size Width Xxs",
|
|
388
|
-
"path": ["semantic", "container-size", "width", "xxs"],
|
|
389
|
-
"comment": "Small handheld devices and mini-windows"
|
|
390
|
-
},
|
|
391
|
-
{
|
|
392
|
-
"key": "{semantic.container-size.width.xs}",
|
|
393
|
-
"value": "{\"min\":\"321px\",\"max\":\"476px\"}",
|
|
394
|
-
"type": "dimension",
|
|
395
|
-
"description": "Handheld devices",
|
|
396
|
-
"attributes": {
|
|
397
|
-
"category": "breakpoint",
|
|
398
|
-
"type": "dimension",
|
|
399
|
-
"item": "width",
|
|
400
|
-
"subitem": "xs",
|
|
401
|
-
"value": {
|
|
402
|
-
"min": "320px + 1",
|
|
403
|
-
"max": "476px"
|
|
404
|
-
},
|
|
405
|
-
"description": "Handheld devices",
|
|
406
|
-
"filePath": "src/tokens/semantic/container-size.json",
|
|
407
|
-
"isSource": true,
|
|
408
|
-
"key": "{semantic.container-size.width.xs}",
|
|
409
|
-
"name": "calcite-semantic-container-size-width-xs",
|
|
410
|
-
"path": ["semantic", "container-size", "width", "xs"],
|
|
411
|
-
"comment": "Handheld devices",
|
|
412
|
-
"names": {
|
|
413
|
-
"scss": "$calcite-container-size-width-xs",
|
|
414
|
-
"css": "var(--calcite-container-size-width-xs)",
|
|
415
|
-
"js": "semantic.container-size.width.xs",
|
|
416
|
-
"docs": "semantic.container-size.width.xs",
|
|
417
|
-
"es6": "calciteContainerSizeWidthXs"
|
|
418
|
-
},
|
|
419
|
-
"calcite-schema": {
|
|
420
|
-
"system": "calcite",
|
|
421
|
-
"tier": "semantic",
|
|
422
|
-
"type": "dimension"
|
|
423
|
-
}
|
|
424
|
-
},
|
|
425
|
-
"filePath": "src/tokens/semantic/container-size.json",
|
|
426
|
-
"isSource": true,
|
|
427
|
-
"name": "Container Size Width Xs",
|
|
428
|
-
"path": ["semantic", "container-size", "width", "xs"],
|
|
429
|
-
"comment": "Handheld devices"
|
|
430
|
-
},
|
|
431
|
-
{
|
|
432
|
-
"key": "{semantic.container-size.width.sm}",
|
|
433
|
-
"value": "{\"min\":\"477px\",\"max\":\"768px\"}",
|
|
434
|
-
"type": "dimension",
|
|
435
|
-
"description": "Small tablets",
|
|
436
|
-
"attributes": {
|
|
437
|
-
"category": "breakpoint",
|
|
438
|
-
"type": "dimension",
|
|
439
|
-
"item": "width",
|
|
440
|
-
"subitem": "sm",
|
|
441
|
-
"value": {
|
|
442
|
-
"min": "476px + 1",
|
|
443
|
-
"max": "768px"
|
|
444
|
-
},
|
|
445
|
-
"description": "Small tablets",
|
|
446
|
-
"filePath": "src/tokens/semantic/container-size.json",
|
|
447
|
-
"isSource": true,
|
|
448
|
-
"key": "{semantic.container-size.width.sm}",
|
|
449
|
-
"name": "calcite-semantic-container-size-width-sm",
|
|
450
|
-
"path": ["semantic", "container-size", "width", "sm"],
|
|
451
|
-
"comment": "Small tablets",
|
|
452
|
-
"names": {
|
|
453
|
-
"scss": "$calcite-container-size-width-sm",
|
|
454
|
-
"css": "var(--calcite-container-size-width-sm)",
|
|
455
|
-
"js": "semantic.container-size.width.sm",
|
|
456
|
-
"docs": "semantic.container-size.width.sm",
|
|
457
|
-
"es6": "calciteContainerSizeWidthSm"
|
|
458
|
-
},
|
|
459
|
-
"calcite-schema": {
|
|
460
|
-
"system": "calcite",
|
|
461
|
-
"tier": "semantic",
|
|
462
|
-
"type": "dimension"
|
|
463
|
-
}
|
|
464
|
-
},
|
|
465
|
-
"filePath": "src/tokens/semantic/container-size.json",
|
|
466
|
-
"isSource": true,
|
|
467
|
-
"name": "Container Size Width Sm",
|
|
468
|
-
"path": ["semantic", "container-size", "width", "sm"],
|
|
469
|
-
"comment": "Small tablets"
|
|
470
|
-
},
|
|
471
|
-
{
|
|
472
|
-
"key": "{semantic.container-size.width.md}",
|
|
473
|
-
"value": "{\"min\":\"769px\",\"max\":\"1152px\"}",
|
|
474
|
-
"type": "dimension",
|
|
475
|
-
"description": "Small laptops",
|
|
476
|
-
"attributes": {
|
|
477
|
-
"category": "breakpoint",
|
|
478
|
-
"type": "dimension",
|
|
479
|
-
"item": "width",
|
|
480
|
-
"subitem": "md",
|
|
481
|
-
"value": {
|
|
482
|
-
"min": "768px + 1",
|
|
483
|
-
"max": "1152px"
|
|
484
|
-
},
|
|
485
|
-
"description": "Small laptops",
|
|
486
|
-
"filePath": "src/tokens/semantic/container-size.json",
|
|
487
|
-
"isSource": true,
|
|
488
|
-
"key": "{semantic.container-size.width.md}",
|
|
489
|
-
"name": "calcite-semantic-container-size-width-md",
|
|
490
|
-
"path": ["semantic", "container-size", "width", "md"],
|
|
491
|
-
"comment": "Small laptops",
|
|
492
|
-
"names": {
|
|
493
|
-
"scss": "$calcite-container-size-width-md",
|
|
494
|
-
"css": "var(--calcite-container-size-width-md)",
|
|
495
|
-
"js": "semantic.container-size.width.md",
|
|
496
|
-
"docs": "semantic.container-size.width.md",
|
|
497
|
-
"es6": "calciteContainerSizeWidthMd"
|
|
498
|
-
},
|
|
499
|
-
"calcite-schema": {
|
|
500
|
-
"system": "calcite",
|
|
501
|
-
"tier": "semantic",
|
|
502
|
-
"type": "dimension"
|
|
503
|
-
}
|
|
504
|
-
},
|
|
505
|
-
"filePath": "src/tokens/semantic/container-size.json",
|
|
506
|
-
"isSource": true,
|
|
507
|
-
"name": "Container Size Width Md",
|
|
508
|
-
"path": ["semantic", "container-size", "width", "md"],
|
|
509
|
-
"comment": "Small laptops"
|
|
510
|
-
},
|
|
511
|
-
{
|
|
512
|
-
"key": "{semantic.container-size.width.lg}",
|
|
513
|
-
"value": "{\"min\":\"1153px\",\"max\":\"1440px\"}",
|
|
514
|
-
"type": "dimension",
|
|
515
|
-
"description": "Large laptops and desktop computers",
|
|
516
|
-
"attributes": {
|
|
517
|
-
"category": "breakpoint",
|
|
518
|
-
"type": "dimension",
|
|
519
|
-
"item": "width",
|
|
520
|
-
"subitem": "lg",
|
|
521
|
-
"value": {
|
|
522
|
-
"min": "1152px + 1",
|
|
523
|
-
"max": "1440px"
|
|
524
|
-
},
|
|
525
|
-
"description": "Large laptops and desktop computers",
|
|
526
|
-
"filePath": "src/tokens/semantic/container-size.json",
|
|
527
|
-
"isSource": true,
|
|
528
|
-
"key": "{semantic.container-size.width.lg}",
|
|
529
|
-
"name": "calcite-semantic-container-size-width-lg",
|
|
530
|
-
"path": ["semantic", "container-size", "width", "lg"],
|
|
531
|
-
"comment": "Large laptops and desktop computers",
|
|
532
|
-
"names": {
|
|
533
|
-
"scss": "$calcite-container-size-width-lg",
|
|
534
|
-
"css": "var(--calcite-container-size-width-lg)",
|
|
535
|
-
"js": "semantic.container-size.width.lg",
|
|
536
|
-
"docs": "semantic.container-size.width.lg",
|
|
537
|
-
"es6": "calciteContainerSizeWidthLg"
|
|
538
|
-
},
|
|
539
|
-
"calcite-schema": {
|
|
540
|
-
"system": "calcite",
|
|
541
|
-
"tier": "semantic",
|
|
542
|
-
"type": "dimension"
|
|
543
|
-
}
|
|
544
|
-
},
|
|
545
|
-
"filePath": "src/tokens/semantic/container-size.json",
|
|
546
|
-
"isSource": true,
|
|
547
|
-
"name": "Container Size Width Lg",
|
|
548
|
-
"path": ["semantic", "container-size", "width", "lg"],
|
|
549
|
-
"comment": "Large laptops and desktop computers"
|
|
550
|
-
},
|
|
551
|
-
{
|
|
552
|
-
"key": "{semantic.container-size.width.xl}",
|
|
553
|
-
"value": "{\"min\":\"1441px\"}",
|
|
554
|
-
"type": "dimension",
|
|
555
|
-
"description": "Projectors and televisions",
|
|
556
|
-
"attributes": {
|
|
557
|
-
"category": "breakpoint",
|
|
558
|
-
"type": "dimension",
|
|
559
|
-
"item": "width",
|
|
560
|
-
"subitem": "xl",
|
|
561
|
-
"value": {
|
|
562
|
-
"min": "1440px + 1"
|
|
563
|
-
},
|
|
564
|
-
"description": "Projectors and televisions",
|
|
565
|
-
"filePath": "src/tokens/semantic/container-size.json",
|
|
566
|
-
"isSource": true,
|
|
567
|
-
"key": "{semantic.container-size.width.xl}",
|
|
568
|
-
"name": "calcite-semantic-container-size-width-xl",
|
|
569
|
-
"path": ["semantic", "container-size", "width", "xl"],
|
|
570
|
-
"comment": "Projectors and televisions",
|
|
571
|
-
"names": {
|
|
572
|
-
"scss": "$calcite-container-size-width-xl",
|
|
573
|
-
"css": "var(--calcite-container-size-width-xl)",
|
|
574
|
-
"js": "semantic.container-size.width.xl",
|
|
575
|
-
"docs": "semantic.container-size.width.xl",
|
|
576
|
-
"es6": "calciteContainerSizeWidthXl"
|
|
577
|
-
},
|
|
578
|
-
"calcite-schema": {
|
|
579
|
-
"system": "calcite",
|
|
580
|
-
"tier": "semantic",
|
|
581
|
-
"type": "dimension"
|
|
582
|
-
}
|
|
583
|
-
},
|
|
584
|
-
"filePath": "src/tokens/semantic/container-size.json",
|
|
585
|
-
"isSource": true,
|
|
586
|
-
"name": "Container Size Width Xl",
|
|
587
|
-
"path": ["semantic", "container-size", "width", "xl"],
|
|
588
|
-
"comment": "Projectors and televisions"
|
|
589
|
-
},
|
|
590
112
|
{
|
|
591
113
|
"key": "{semantic.container-size.margin}",
|
|
592
114
|
"value": "24px",
|
package/dist/es6/semantic.d.ts
CHANGED
|
@@ -7,30 +7,6 @@ export const calciteBorderWidthNone: string;
|
|
|
7
7
|
export const calciteBorderWidthSm: string;
|
|
8
8
|
export const calciteBorderWidthMd: string;
|
|
9
9
|
export const calciteBorderWidthLg: string;
|
|
10
|
-
/** Small handheld devices and mini-windows */
|
|
11
|
-
export const calciteContainerSizeHeightXxs: { min: string; max: string };
|
|
12
|
-
/** Handheld devices */
|
|
13
|
-
export const calciteContainerSizeHeightXs: { min: string; max: string };
|
|
14
|
-
/** Small tablets */
|
|
15
|
-
export const calciteContainerSizeHeightSm: { min: string; max: string };
|
|
16
|
-
/** Small laptops */
|
|
17
|
-
export const calciteContainerSizeHeightMd: { min: string; max: string };
|
|
18
|
-
/** Large laptops and desktop computers */
|
|
19
|
-
export const calciteContainerSizeHeightLg: { min: string; max: string };
|
|
20
|
-
/** Projectors and televisions */
|
|
21
|
-
export const calciteContainerSizeHeightXl: { min: string };
|
|
22
|
-
/** Small handheld devices and mini-windows */
|
|
23
|
-
export const calciteContainerSizeWidthXxs: { min: string; max: string };
|
|
24
|
-
/** Handheld devices */
|
|
25
|
-
export const calciteContainerSizeWidthXs: { min: string; max: string };
|
|
26
|
-
/** Small tablets */
|
|
27
|
-
export const calciteContainerSizeWidthSm: { min: string; max: string };
|
|
28
|
-
/** Small laptops */
|
|
29
|
-
export const calciteContainerSizeWidthMd: { min: string; max: string };
|
|
30
|
-
/** Large laptops and desktop computers */
|
|
31
|
-
export const calciteContainerSizeWidthLg: { min: string; max: string };
|
|
32
|
-
/** Projectors and televisions */
|
|
33
|
-
export const calciteContainerSizeWidthXl: { min: string };
|
|
34
10
|
export const calciteContainerSizeMargin: string;
|
|
35
11
|
export const calciteContainerSizeGutter: string;
|
|
36
12
|
/** for fluid grid widths */
|
package/dist/es6/semantic.js
CHANGED
|
@@ -7,18 +7,6 @@ export const calciteBorderWidthNone = "0";
|
|
|
7
7
|
export const calciteBorderWidthSm = "1px";
|
|
8
8
|
export const calciteBorderWidthMd = "2px";
|
|
9
9
|
export const calciteBorderWidthLg = "4px";
|
|
10
|
-
export const calciteContainerSizeHeightXxs = { min: "0", max: "154px" }; // Small handheld devices and mini-windows
|
|
11
|
-
export const calciteContainerSizeHeightXs = { min: "155px", max: "328px" }; // Handheld devices
|
|
12
|
-
export const calciteContainerSizeHeightSm = { min: "329px", max: "504px" }; // Small tablets
|
|
13
|
-
export const calciteContainerSizeHeightMd = { min: "505px", max: "678px" }; // Small laptops
|
|
14
|
-
export const calciteContainerSizeHeightLg = { min: "679px", max: "854px" }; // Large laptops and desktop computers
|
|
15
|
-
export const calciteContainerSizeHeightXl = { min: "855px" }; // Projectors and televisions
|
|
16
|
-
export const calciteContainerSizeWidthXxs = { min: "0", max: "320px" }; // Small handheld devices and mini-windows
|
|
17
|
-
export const calciteContainerSizeWidthXs = { min: "321px", max: "476px" }; // Handheld devices
|
|
18
|
-
export const calciteContainerSizeWidthSm = { min: "477px", max: "768px" }; // Small tablets
|
|
19
|
-
export const calciteContainerSizeWidthMd = { min: "769px", max: "1152px" }; // Small laptops
|
|
20
|
-
export const calciteContainerSizeWidthLg = { min: "1153px", max: "1440px" }; // Large laptops and desktop computers
|
|
21
|
-
export const calciteContainerSizeWidthXl = { min: "1441px" }; // Projectors and televisions
|
|
22
10
|
export const calciteContainerSizeMargin = "24px";
|
|
23
11
|
export const calciteContainerSizeGutter = "16px";
|
|
24
12
|
export const calciteContainerSizeContentFluid = "100%"; // for fluid grid widths
|
package/dist/js/semantic.d.ts
CHANGED
|
@@ -26,22 +26,6 @@ declare const tokens: {
|
|
|
26
26
|
};
|
|
27
27
|
};
|
|
28
28
|
"container-size": {
|
|
29
|
-
height: {
|
|
30
|
-
xxs: DesignToken;
|
|
31
|
-
xs: DesignToken;
|
|
32
|
-
sm: DesignToken;
|
|
33
|
-
md: DesignToken;
|
|
34
|
-
lg: DesignToken;
|
|
35
|
-
xl: DesignToken;
|
|
36
|
-
};
|
|
37
|
-
width: {
|
|
38
|
-
xxs: DesignToken;
|
|
39
|
-
xs: DesignToken;
|
|
40
|
-
sm: DesignToken;
|
|
41
|
-
md: DesignToken;
|
|
42
|
-
lg: DesignToken;
|
|
43
|
-
xl: DesignToken;
|
|
44
|
-
};
|
|
45
29
|
margin: DesignToken;
|
|
46
30
|
gutter: DesignToken;
|
|
47
31
|
content: {
|
package/dist/js/semantic.js
CHANGED
|
@@ -150,664 +150,6 @@ export default {
|
|
|
150
150
|
},
|
|
151
151
|
},
|
|
152
152
|
"container-size": {
|
|
153
|
-
height: {
|
|
154
|
-
xxs: {
|
|
155
|
-
key: "{semantic.container-size.height.xxs}",
|
|
156
|
-
value: {
|
|
157
|
-
min: "0",
|
|
158
|
-
max: "154px",
|
|
159
|
-
},
|
|
160
|
-
type: "dimension",
|
|
161
|
-
description: "Small handheld devices and mini-windows",
|
|
162
|
-
attributes: {
|
|
163
|
-
category: "breakpoint",
|
|
164
|
-
type: "dimension",
|
|
165
|
-
item: "height",
|
|
166
|
-
subitem: "xxs",
|
|
167
|
-
value: {
|
|
168
|
-
min: "0",
|
|
169
|
-
max: "154px",
|
|
170
|
-
},
|
|
171
|
-
description: "Small handheld devices and mini-windows",
|
|
172
|
-
filePath: "src/tokens/semantic/container-size.json",
|
|
173
|
-
isSource: true,
|
|
174
|
-
key: "{semantic.container-size.height.xxs}",
|
|
175
|
-
name: "calcite-semantic-container-size-height-xxs",
|
|
176
|
-
path: ["semantic", "container-size", "height", "xxs"],
|
|
177
|
-
comment: "Small handheld devices and mini-windows",
|
|
178
|
-
names: {
|
|
179
|
-
scss: "$calcite-container-size-height-xxs",
|
|
180
|
-
css: "var(--calcite-container-size-height-xxs)",
|
|
181
|
-
js: "semantic.container-size.height.xxs",
|
|
182
|
-
docs: "semantic.container-size.height.xxs",
|
|
183
|
-
es6: "calciteContainerSizeHeightXxs",
|
|
184
|
-
},
|
|
185
|
-
"calcite-schema": {
|
|
186
|
-
system: "calcite",
|
|
187
|
-
tier: "semantic",
|
|
188
|
-
type: "dimension",
|
|
189
|
-
},
|
|
190
|
-
},
|
|
191
|
-
filePath: "src/tokens/semantic/container-size.json",
|
|
192
|
-
isSource: true,
|
|
193
|
-
original: {
|
|
194
|
-
value: {
|
|
195
|
-
min: "0",
|
|
196
|
-
max: "{core.container-size.154}",
|
|
197
|
-
},
|
|
198
|
-
type: "dimension",
|
|
199
|
-
description: "Small handheld devices and mini-windows",
|
|
200
|
-
attributes: {
|
|
201
|
-
category: "breakpoint",
|
|
202
|
-
},
|
|
203
|
-
key: "{semantic.container-size.height.xxs}",
|
|
204
|
-
},
|
|
205
|
-
name: "Container Size Height Xxs",
|
|
206
|
-
path: ["semantic", "container-size", "height", "xxs"],
|
|
207
|
-
comment: "Small handheld devices and mini-windows",
|
|
208
|
-
},
|
|
209
|
-
xs: {
|
|
210
|
-
key: "{semantic.container-size.height.xs}",
|
|
211
|
-
value: {
|
|
212
|
-
min: "155px",
|
|
213
|
-
max: "328px",
|
|
214
|
-
},
|
|
215
|
-
type: "dimension",
|
|
216
|
-
description: "Handheld devices",
|
|
217
|
-
attributes: {
|
|
218
|
-
category: "breakpoint",
|
|
219
|
-
type: "dimension",
|
|
220
|
-
item: "height",
|
|
221
|
-
subitem: "xs",
|
|
222
|
-
value: {
|
|
223
|
-
min: "154px + 1",
|
|
224
|
-
max: "328px",
|
|
225
|
-
},
|
|
226
|
-
description: "Handheld devices",
|
|
227
|
-
filePath: "src/tokens/semantic/container-size.json",
|
|
228
|
-
isSource: true,
|
|
229
|
-
key: "{semantic.container-size.height.xs}",
|
|
230
|
-
name: "calcite-semantic-container-size-height-xs",
|
|
231
|
-
path: ["semantic", "container-size", "height", "xs"],
|
|
232
|
-
comment: "Handheld devices",
|
|
233
|
-
names: {
|
|
234
|
-
scss: "$calcite-container-size-height-xs",
|
|
235
|
-
css: "var(--calcite-container-size-height-xs)",
|
|
236
|
-
js: "semantic.container-size.height.xs",
|
|
237
|
-
docs: "semantic.container-size.height.xs",
|
|
238
|
-
es6: "calciteContainerSizeHeightXs",
|
|
239
|
-
},
|
|
240
|
-
"calcite-schema": {
|
|
241
|
-
system: "calcite",
|
|
242
|
-
tier: "semantic",
|
|
243
|
-
type: "dimension",
|
|
244
|
-
},
|
|
245
|
-
},
|
|
246
|
-
filePath: "src/tokens/semantic/container-size.json",
|
|
247
|
-
isSource: true,
|
|
248
|
-
original: {
|
|
249
|
-
value: {
|
|
250
|
-
min: "{core.container-size.154} + 1",
|
|
251
|
-
max: "{core.container-size.328}",
|
|
252
|
-
},
|
|
253
|
-
type: "dimension",
|
|
254
|
-
description: "Handheld devices",
|
|
255
|
-
attributes: {
|
|
256
|
-
category: "breakpoint",
|
|
257
|
-
},
|
|
258
|
-
key: "{semantic.container-size.height.xs}",
|
|
259
|
-
},
|
|
260
|
-
name: "Container Size Height Xs",
|
|
261
|
-
path: ["semantic", "container-size", "height", "xs"],
|
|
262
|
-
comment: "Handheld devices",
|
|
263
|
-
},
|
|
264
|
-
sm: {
|
|
265
|
-
key: "{semantic.container-size.height.sm}",
|
|
266
|
-
value: {
|
|
267
|
-
min: "329px",
|
|
268
|
-
max: "504px",
|
|
269
|
-
},
|
|
270
|
-
type: "dimension",
|
|
271
|
-
description: "Small tablets",
|
|
272
|
-
attributes: {
|
|
273
|
-
category: "breakpoint",
|
|
274
|
-
type: "dimension",
|
|
275
|
-
item: "height",
|
|
276
|
-
subitem: "sm",
|
|
277
|
-
value: {
|
|
278
|
-
min: "328px + 1",
|
|
279
|
-
max: "504px",
|
|
280
|
-
},
|
|
281
|
-
description: "Small tablets",
|
|
282
|
-
filePath: "src/tokens/semantic/container-size.json",
|
|
283
|
-
isSource: true,
|
|
284
|
-
key: "{semantic.container-size.height.sm}",
|
|
285
|
-
name: "calcite-semantic-container-size-height-sm",
|
|
286
|
-
path: ["semantic", "container-size", "height", "sm"],
|
|
287
|
-
comment: "Small tablets",
|
|
288
|
-
names: {
|
|
289
|
-
scss: "$calcite-container-size-height-sm",
|
|
290
|
-
css: "var(--calcite-container-size-height-sm)",
|
|
291
|
-
js: "semantic.container-size.height.sm",
|
|
292
|
-
docs: "semantic.container-size.height.sm",
|
|
293
|
-
es6: "calciteContainerSizeHeightSm",
|
|
294
|
-
},
|
|
295
|
-
"calcite-schema": {
|
|
296
|
-
system: "calcite",
|
|
297
|
-
tier: "semantic",
|
|
298
|
-
type: "dimension",
|
|
299
|
-
},
|
|
300
|
-
},
|
|
301
|
-
filePath: "src/tokens/semantic/container-size.json",
|
|
302
|
-
isSource: true,
|
|
303
|
-
original: {
|
|
304
|
-
value: {
|
|
305
|
-
min: "{core.container-size.328} + 1",
|
|
306
|
-
max: "{core.container-size.504}",
|
|
307
|
-
},
|
|
308
|
-
type: "dimension",
|
|
309
|
-
description: "Small tablets",
|
|
310
|
-
attributes: {
|
|
311
|
-
category: "breakpoint",
|
|
312
|
-
},
|
|
313
|
-
key: "{semantic.container-size.height.sm}",
|
|
314
|
-
},
|
|
315
|
-
name: "Container Size Height Sm",
|
|
316
|
-
path: ["semantic", "container-size", "height", "sm"],
|
|
317
|
-
comment: "Small tablets",
|
|
318
|
-
},
|
|
319
|
-
md: {
|
|
320
|
-
key: "{semantic.container-size.height.md}",
|
|
321
|
-
value: {
|
|
322
|
-
min: "505px",
|
|
323
|
-
max: "678px",
|
|
324
|
-
},
|
|
325
|
-
type: "dimension",
|
|
326
|
-
description: "Small laptops",
|
|
327
|
-
attributes: {
|
|
328
|
-
category: "breakpoint",
|
|
329
|
-
type: "dimension",
|
|
330
|
-
item: "height",
|
|
331
|
-
subitem: "md",
|
|
332
|
-
value: {
|
|
333
|
-
min: "504px + 1",
|
|
334
|
-
max: "678px",
|
|
335
|
-
},
|
|
336
|
-
description: "Small laptops",
|
|
337
|
-
filePath: "src/tokens/semantic/container-size.json",
|
|
338
|
-
isSource: true,
|
|
339
|
-
key: "{semantic.container-size.height.md}",
|
|
340
|
-
name: "calcite-semantic-container-size-height-md",
|
|
341
|
-
path: ["semantic", "container-size", "height", "md"],
|
|
342
|
-
comment: "Small laptops",
|
|
343
|
-
names: {
|
|
344
|
-
scss: "$calcite-container-size-height-md",
|
|
345
|
-
css: "var(--calcite-container-size-height-md)",
|
|
346
|
-
js: "semantic.container-size.height.md",
|
|
347
|
-
docs: "semantic.container-size.height.md",
|
|
348
|
-
es6: "calciteContainerSizeHeightMd",
|
|
349
|
-
},
|
|
350
|
-
"calcite-schema": {
|
|
351
|
-
system: "calcite",
|
|
352
|
-
tier: "semantic",
|
|
353
|
-
type: "dimension",
|
|
354
|
-
},
|
|
355
|
-
},
|
|
356
|
-
filePath: "src/tokens/semantic/container-size.json",
|
|
357
|
-
isSource: true,
|
|
358
|
-
original: {
|
|
359
|
-
value: {
|
|
360
|
-
min: "{core.container-size.504} + 1",
|
|
361
|
-
max: "{core.container-size.678}",
|
|
362
|
-
},
|
|
363
|
-
type: "dimension",
|
|
364
|
-
description: "Small laptops",
|
|
365
|
-
attributes: {
|
|
366
|
-
category: "breakpoint",
|
|
367
|
-
},
|
|
368
|
-
key: "{semantic.container-size.height.md}",
|
|
369
|
-
},
|
|
370
|
-
name: "Container Size Height Md",
|
|
371
|
-
path: ["semantic", "container-size", "height", "md"],
|
|
372
|
-
comment: "Small laptops",
|
|
373
|
-
},
|
|
374
|
-
lg: {
|
|
375
|
-
key: "{semantic.container-size.height.lg}",
|
|
376
|
-
value: {
|
|
377
|
-
min: "679px",
|
|
378
|
-
max: "854px",
|
|
379
|
-
},
|
|
380
|
-
type: "dimension",
|
|
381
|
-
description: "Large laptops and desktop computers",
|
|
382
|
-
attributes: {
|
|
383
|
-
category: "breakpoint",
|
|
384
|
-
type: "dimension",
|
|
385
|
-
item: "height",
|
|
386
|
-
subitem: "lg",
|
|
387
|
-
value: {
|
|
388
|
-
min: "678px + 1",
|
|
389
|
-
max: "854px",
|
|
390
|
-
},
|
|
391
|
-
description: "Large laptops and desktop computers",
|
|
392
|
-
filePath: "src/tokens/semantic/container-size.json",
|
|
393
|
-
isSource: true,
|
|
394
|
-
key: "{semantic.container-size.height.lg}",
|
|
395
|
-
name: "calcite-semantic-container-size-height-lg",
|
|
396
|
-
path: ["semantic", "container-size", "height", "lg"],
|
|
397
|
-
comment: "Large laptops and desktop computers",
|
|
398
|
-
names: {
|
|
399
|
-
scss: "$calcite-container-size-height-lg",
|
|
400
|
-
css: "var(--calcite-container-size-height-lg)",
|
|
401
|
-
js: "semantic.container-size.height.lg",
|
|
402
|
-
docs: "semantic.container-size.height.lg",
|
|
403
|
-
es6: "calciteContainerSizeHeightLg",
|
|
404
|
-
},
|
|
405
|
-
"calcite-schema": {
|
|
406
|
-
system: "calcite",
|
|
407
|
-
tier: "semantic",
|
|
408
|
-
type: "dimension",
|
|
409
|
-
},
|
|
410
|
-
},
|
|
411
|
-
filePath: "src/tokens/semantic/container-size.json",
|
|
412
|
-
isSource: true,
|
|
413
|
-
original: {
|
|
414
|
-
value: {
|
|
415
|
-
min: "{core.container-size.678} + 1",
|
|
416
|
-
max: "{core.container-size.854}",
|
|
417
|
-
},
|
|
418
|
-
type: "dimension",
|
|
419
|
-
description: "Large laptops and desktop computers",
|
|
420
|
-
attributes: {
|
|
421
|
-
category: "breakpoint",
|
|
422
|
-
},
|
|
423
|
-
key: "{semantic.container-size.height.lg}",
|
|
424
|
-
},
|
|
425
|
-
name: "Container Size Height Lg",
|
|
426
|
-
path: ["semantic", "container-size", "height", "lg"],
|
|
427
|
-
comment: "Large laptops and desktop computers",
|
|
428
|
-
},
|
|
429
|
-
xl: {
|
|
430
|
-
key: "{semantic.container-size.height.xl}",
|
|
431
|
-
value: {
|
|
432
|
-
min: "855px",
|
|
433
|
-
},
|
|
434
|
-
type: "dimension",
|
|
435
|
-
description: "Projectors and televisions",
|
|
436
|
-
attributes: {
|
|
437
|
-
category: "breakpoint",
|
|
438
|
-
type: "dimension",
|
|
439
|
-
item: "height",
|
|
440
|
-
subitem: "xl",
|
|
441
|
-
value: {
|
|
442
|
-
min: "854px + 1",
|
|
443
|
-
},
|
|
444
|
-
description: "Projectors and televisions",
|
|
445
|
-
filePath: "src/tokens/semantic/container-size.json",
|
|
446
|
-
isSource: true,
|
|
447
|
-
key: "{semantic.container-size.height.xl}",
|
|
448
|
-
name: "calcite-semantic-container-size-height-xl",
|
|
449
|
-
path: ["semantic", "container-size", "height", "xl"],
|
|
450
|
-
comment: "Projectors and televisions",
|
|
451
|
-
names: {
|
|
452
|
-
scss: "$calcite-container-size-height-xl",
|
|
453
|
-
css: "var(--calcite-container-size-height-xl)",
|
|
454
|
-
js: "semantic.container-size.height.xl",
|
|
455
|
-
docs: "semantic.container-size.height.xl",
|
|
456
|
-
es6: "calciteContainerSizeHeightXl",
|
|
457
|
-
},
|
|
458
|
-
"calcite-schema": {
|
|
459
|
-
system: "calcite",
|
|
460
|
-
tier: "semantic",
|
|
461
|
-
type: "dimension",
|
|
462
|
-
},
|
|
463
|
-
},
|
|
464
|
-
filePath: "src/tokens/semantic/container-size.json",
|
|
465
|
-
isSource: true,
|
|
466
|
-
original: {
|
|
467
|
-
value: {
|
|
468
|
-
min: "{core.container-size.854} + 1",
|
|
469
|
-
},
|
|
470
|
-
type: "dimension",
|
|
471
|
-
description: "Projectors and televisions",
|
|
472
|
-
attributes: {
|
|
473
|
-
category: "breakpoint",
|
|
474
|
-
},
|
|
475
|
-
key: "{semantic.container-size.height.xl}",
|
|
476
|
-
},
|
|
477
|
-
name: "Container Size Height Xl",
|
|
478
|
-
path: ["semantic", "container-size", "height", "xl"],
|
|
479
|
-
comment: "Projectors and televisions",
|
|
480
|
-
},
|
|
481
|
-
},
|
|
482
|
-
width: {
|
|
483
|
-
xxs: {
|
|
484
|
-
key: "{semantic.container-size.width.xxs}",
|
|
485
|
-
value: {
|
|
486
|
-
min: "0",
|
|
487
|
-
max: "320px",
|
|
488
|
-
},
|
|
489
|
-
type: "dimension",
|
|
490
|
-
description: "Small handheld devices and mini-windows",
|
|
491
|
-
attributes: {
|
|
492
|
-
category: "breakpoint",
|
|
493
|
-
type: "dimension",
|
|
494
|
-
item: "width",
|
|
495
|
-
subitem: "xxs",
|
|
496
|
-
value: {
|
|
497
|
-
min: "0",
|
|
498
|
-
max: "320px",
|
|
499
|
-
},
|
|
500
|
-
description: "Small handheld devices and mini-windows",
|
|
501
|
-
filePath: "src/tokens/semantic/container-size.json",
|
|
502
|
-
isSource: true,
|
|
503
|
-
key: "{semantic.container-size.width.xxs}",
|
|
504
|
-
name: "calcite-semantic-container-size-width-xxs",
|
|
505
|
-
path: ["semantic", "container-size", "width", "xxs"],
|
|
506
|
-
comment: "Small handheld devices and mini-windows",
|
|
507
|
-
names: {
|
|
508
|
-
scss: "$calcite-container-size-width-xxs",
|
|
509
|
-
css: "var(--calcite-container-size-width-xxs)",
|
|
510
|
-
js: "semantic.container-size.width.xxs",
|
|
511
|
-
docs: "semantic.container-size.width.xxs",
|
|
512
|
-
es6: "calciteContainerSizeWidthXxs",
|
|
513
|
-
},
|
|
514
|
-
"calcite-schema": {
|
|
515
|
-
system: "calcite",
|
|
516
|
-
tier: "semantic",
|
|
517
|
-
type: "dimension",
|
|
518
|
-
},
|
|
519
|
-
},
|
|
520
|
-
filePath: "src/tokens/semantic/container-size.json",
|
|
521
|
-
isSource: true,
|
|
522
|
-
original: {
|
|
523
|
-
value: {
|
|
524
|
-
min: "0",
|
|
525
|
-
max: "{core.container-size.320}",
|
|
526
|
-
},
|
|
527
|
-
type: "dimension",
|
|
528
|
-
description: "Small handheld devices and mini-windows",
|
|
529
|
-
attributes: {
|
|
530
|
-
category: "breakpoint",
|
|
531
|
-
},
|
|
532
|
-
key: "{semantic.container-size.width.xxs}",
|
|
533
|
-
},
|
|
534
|
-
name: "Container Size Width Xxs",
|
|
535
|
-
path: ["semantic", "container-size", "width", "xxs"],
|
|
536
|
-
comment: "Small handheld devices and mini-windows",
|
|
537
|
-
},
|
|
538
|
-
xs: {
|
|
539
|
-
key: "{semantic.container-size.width.xs}",
|
|
540
|
-
value: {
|
|
541
|
-
min: "321px",
|
|
542
|
-
max: "476px",
|
|
543
|
-
},
|
|
544
|
-
type: "dimension",
|
|
545
|
-
description: "Handheld devices",
|
|
546
|
-
attributes: {
|
|
547
|
-
category: "breakpoint",
|
|
548
|
-
type: "dimension",
|
|
549
|
-
item: "width",
|
|
550
|
-
subitem: "xs",
|
|
551
|
-
value: {
|
|
552
|
-
min: "320px + 1",
|
|
553
|
-
max: "476px",
|
|
554
|
-
},
|
|
555
|
-
description: "Handheld devices",
|
|
556
|
-
filePath: "src/tokens/semantic/container-size.json",
|
|
557
|
-
isSource: true,
|
|
558
|
-
key: "{semantic.container-size.width.xs}",
|
|
559
|
-
name: "calcite-semantic-container-size-width-xs",
|
|
560
|
-
path: ["semantic", "container-size", "width", "xs"],
|
|
561
|
-
comment: "Handheld devices",
|
|
562
|
-
names: {
|
|
563
|
-
scss: "$calcite-container-size-width-xs",
|
|
564
|
-
css: "var(--calcite-container-size-width-xs)",
|
|
565
|
-
js: "semantic.container-size.width.xs",
|
|
566
|
-
docs: "semantic.container-size.width.xs",
|
|
567
|
-
es6: "calciteContainerSizeWidthXs",
|
|
568
|
-
},
|
|
569
|
-
"calcite-schema": {
|
|
570
|
-
system: "calcite",
|
|
571
|
-
tier: "semantic",
|
|
572
|
-
type: "dimension",
|
|
573
|
-
},
|
|
574
|
-
},
|
|
575
|
-
filePath: "src/tokens/semantic/container-size.json",
|
|
576
|
-
isSource: true,
|
|
577
|
-
original: {
|
|
578
|
-
value: {
|
|
579
|
-
min: "{core.container-size.320} + 1",
|
|
580
|
-
max: "{core.container-size.476}",
|
|
581
|
-
},
|
|
582
|
-
type: "dimension",
|
|
583
|
-
description: "Handheld devices",
|
|
584
|
-
attributes: {
|
|
585
|
-
category: "breakpoint",
|
|
586
|
-
},
|
|
587
|
-
key: "{semantic.container-size.width.xs}",
|
|
588
|
-
},
|
|
589
|
-
name: "Container Size Width Xs",
|
|
590
|
-
path: ["semantic", "container-size", "width", "xs"],
|
|
591
|
-
comment: "Handheld devices",
|
|
592
|
-
},
|
|
593
|
-
sm: {
|
|
594
|
-
key: "{semantic.container-size.width.sm}",
|
|
595
|
-
value: {
|
|
596
|
-
min: "477px",
|
|
597
|
-
max: "768px",
|
|
598
|
-
},
|
|
599
|
-
type: "dimension",
|
|
600
|
-
description: "Small tablets",
|
|
601
|
-
attributes: {
|
|
602
|
-
category: "breakpoint",
|
|
603
|
-
type: "dimension",
|
|
604
|
-
item: "width",
|
|
605
|
-
subitem: "sm",
|
|
606
|
-
value: {
|
|
607
|
-
min: "476px + 1",
|
|
608
|
-
max: "768px",
|
|
609
|
-
},
|
|
610
|
-
description: "Small tablets",
|
|
611
|
-
filePath: "src/tokens/semantic/container-size.json",
|
|
612
|
-
isSource: true,
|
|
613
|
-
key: "{semantic.container-size.width.sm}",
|
|
614
|
-
name: "calcite-semantic-container-size-width-sm",
|
|
615
|
-
path: ["semantic", "container-size", "width", "sm"],
|
|
616
|
-
comment: "Small tablets",
|
|
617
|
-
names: {
|
|
618
|
-
scss: "$calcite-container-size-width-sm",
|
|
619
|
-
css: "var(--calcite-container-size-width-sm)",
|
|
620
|
-
js: "semantic.container-size.width.sm",
|
|
621
|
-
docs: "semantic.container-size.width.sm",
|
|
622
|
-
es6: "calciteContainerSizeWidthSm",
|
|
623
|
-
},
|
|
624
|
-
"calcite-schema": {
|
|
625
|
-
system: "calcite",
|
|
626
|
-
tier: "semantic",
|
|
627
|
-
type: "dimension",
|
|
628
|
-
},
|
|
629
|
-
},
|
|
630
|
-
filePath: "src/tokens/semantic/container-size.json",
|
|
631
|
-
isSource: true,
|
|
632
|
-
original: {
|
|
633
|
-
value: {
|
|
634
|
-
min: "{core.container-size.476} + 1",
|
|
635
|
-
max: "{core.container-size.768}",
|
|
636
|
-
},
|
|
637
|
-
type: "dimension",
|
|
638
|
-
description: "Small tablets",
|
|
639
|
-
attributes: {
|
|
640
|
-
category: "breakpoint",
|
|
641
|
-
},
|
|
642
|
-
key: "{semantic.container-size.width.sm}",
|
|
643
|
-
},
|
|
644
|
-
name: "Container Size Width Sm",
|
|
645
|
-
path: ["semantic", "container-size", "width", "sm"],
|
|
646
|
-
comment: "Small tablets",
|
|
647
|
-
},
|
|
648
|
-
md: {
|
|
649
|
-
key: "{semantic.container-size.width.md}",
|
|
650
|
-
value: {
|
|
651
|
-
min: "769px",
|
|
652
|
-
max: "1152px",
|
|
653
|
-
},
|
|
654
|
-
type: "dimension",
|
|
655
|
-
description: "Small laptops",
|
|
656
|
-
attributes: {
|
|
657
|
-
category: "breakpoint",
|
|
658
|
-
type: "dimension",
|
|
659
|
-
item: "width",
|
|
660
|
-
subitem: "md",
|
|
661
|
-
value: {
|
|
662
|
-
min: "768px + 1",
|
|
663
|
-
max: "1152px",
|
|
664
|
-
},
|
|
665
|
-
description: "Small laptops",
|
|
666
|
-
filePath: "src/tokens/semantic/container-size.json",
|
|
667
|
-
isSource: true,
|
|
668
|
-
key: "{semantic.container-size.width.md}",
|
|
669
|
-
name: "calcite-semantic-container-size-width-md",
|
|
670
|
-
path: ["semantic", "container-size", "width", "md"],
|
|
671
|
-
comment: "Small laptops",
|
|
672
|
-
names: {
|
|
673
|
-
scss: "$calcite-container-size-width-md",
|
|
674
|
-
css: "var(--calcite-container-size-width-md)",
|
|
675
|
-
js: "semantic.container-size.width.md",
|
|
676
|
-
docs: "semantic.container-size.width.md",
|
|
677
|
-
es6: "calciteContainerSizeWidthMd",
|
|
678
|
-
},
|
|
679
|
-
"calcite-schema": {
|
|
680
|
-
system: "calcite",
|
|
681
|
-
tier: "semantic",
|
|
682
|
-
type: "dimension",
|
|
683
|
-
},
|
|
684
|
-
},
|
|
685
|
-
filePath: "src/tokens/semantic/container-size.json",
|
|
686
|
-
isSource: true,
|
|
687
|
-
original: {
|
|
688
|
-
value: {
|
|
689
|
-
min: "{core.container-size.768} + 1",
|
|
690
|
-
max: "{core.container-size.1152}",
|
|
691
|
-
},
|
|
692
|
-
type: "dimension",
|
|
693
|
-
description: "Small laptops",
|
|
694
|
-
attributes: {
|
|
695
|
-
category: "breakpoint",
|
|
696
|
-
},
|
|
697
|
-
key: "{semantic.container-size.width.md}",
|
|
698
|
-
},
|
|
699
|
-
name: "Container Size Width Md",
|
|
700
|
-
path: ["semantic", "container-size", "width", "md"],
|
|
701
|
-
comment: "Small laptops",
|
|
702
|
-
},
|
|
703
|
-
lg: {
|
|
704
|
-
key: "{semantic.container-size.width.lg}",
|
|
705
|
-
value: {
|
|
706
|
-
min: "1153px",
|
|
707
|
-
max: "1440px",
|
|
708
|
-
},
|
|
709
|
-
type: "dimension",
|
|
710
|
-
description: "Large laptops and desktop computers",
|
|
711
|
-
attributes: {
|
|
712
|
-
category: "breakpoint",
|
|
713
|
-
type: "dimension",
|
|
714
|
-
item: "width",
|
|
715
|
-
subitem: "lg",
|
|
716
|
-
value: {
|
|
717
|
-
min: "1152px + 1",
|
|
718
|
-
max: "1440px",
|
|
719
|
-
},
|
|
720
|
-
description: "Large laptops and desktop computers",
|
|
721
|
-
filePath: "src/tokens/semantic/container-size.json",
|
|
722
|
-
isSource: true,
|
|
723
|
-
key: "{semantic.container-size.width.lg}",
|
|
724
|
-
name: "calcite-semantic-container-size-width-lg",
|
|
725
|
-
path: ["semantic", "container-size", "width", "lg"],
|
|
726
|
-
comment: "Large laptops and desktop computers",
|
|
727
|
-
names: {
|
|
728
|
-
scss: "$calcite-container-size-width-lg",
|
|
729
|
-
css: "var(--calcite-container-size-width-lg)",
|
|
730
|
-
js: "semantic.container-size.width.lg",
|
|
731
|
-
docs: "semantic.container-size.width.lg",
|
|
732
|
-
es6: "calciteContainerSizeWidthLg",
|
|
733
|
-
},
|
|
734
|
-
"calcite-schema": {
|
|
735
|
-
system: "calcite",
|
|
736
|
-
tier: "semantic",
|
|
737
|
-
type: "dimension",
|
|
738
|
-
},
|
|
739
|
-
},
|
|
740
|
-
filePath: "src/tokens/semantic/container-size.json",
|
|
741
|
-
isSource: true,
|
|
742
|
-
original: {
|
|
743
|
-
value: {
|
|
744
|
-
min: "{core.container-size.1152} + 1",
|
|
745
|
-
max: "{core.container-size.1440}",
|
|
746
|
-
},
|
|
747
|
-
type: "dimension",
|
|
748
|
-
description: "Large laptops and desktop computers",
|
|
749
|
-
attributes: {
|
|
750
|
-
category: "breakpoint",
|
|
751
|
-
},
|
|
752
|
-
key: "{semantic.container-size.width.lg}",
|
|
753
|
-
},
|
|
754
|
-
name: "Container Size Width Lg",
|
|
755
|
-
path: ["semantic", "container-size", "width", "lg"],
|
|
756
|
-
comment: "Large laptops and desktop computers",
|
|
757
|
-
},
|
|
758
|
-
xl: {
|
|
759
|
-
key: "{semantic.container-size.width.xl}",
|
|
760
|
-
value: {
|
|
761
|
-
min: "1441px",
|
|
762
|
-
},
|
|
763
|
-
type: "dimension",
|
|
764
|
-
description: "Projectors and televisions",
|
|
765
|
-
attributes: {
|
|
766
|
-
category: "breakpoint",
|
|
767
|
-
type: "dimension",
|
|
768
|
-
item: "width",
|
|
769
|
-
subitem: "xl",
|
|
770
|
-
value: {
|
|
771
|
-
min: "1440px + 1",
|
|
772
|
-
},
|
|
773
|
-
description: "Projectors and televisions",
|
|
774
|
-
filePath: "src/tokens/semantic/container-size.json",
|
|
775
|
-
isSource: true,
|
|
776
|
-
key: "{semantic.container-size.width.xl}",
|
|
777
|
-
name: "calcite-semantic-container-size-width-xl",
|
|
778
|
-
path: ["semantic", "container-size", "width", "xl"],
|
|
779
|
-
comment: "Projectors and televisions",
|
|
780
|
-
names: {
|
|
781
|
-
scss: "$calcite-container-size-width-xl",
|
|
782
|
-
css: "var(--calcite-container-size-width-xl)",
|
|
783
|
-
js: "semantic.container-size.width.xl",
|
|
784
|
-
docs: "semantic.container-size.width.xl",
|
|
785
|
-
es6: "calciteContainerSizeWidthXl",
|
|
786
|
-
},
|
|
787
|
-
"calcite-schema": {
|
|
788
|
-
system: "calcite",
|
|
789
|
-
tier: "semantic",
|
|
790
|
-
type: "dimension",
|
|
791
|
-
},
|
|
792
|
-
},
|
|
793
|
-
filePath: "src/tokens/semantic/container-size.json",
|
|
794
|
-
isSource: true,
|
|
795
|
-
original: {
|
|
796
|
-
value: {
|
|
797
|
-
min: "{core.container-size.1440} + 1",
|
|
798
|
-
},
|
|
799
|
-
type: "dimension",
|
|
800
|
-
description: "Projectors and televisions",
|
|
801
|
-
attributes: {
|
|
802
|
-
category: "breakpoint",
|
|
803
|
-
},
|
|
804
|
-
key: "{semantic.container-size.width.xl}",
|
|
805
|
-
},
|
|
806
|
-
name: "Container Size Width Xl",
|
|
807
|
-
path: ["semantic", "container-size", "width", "xl"],
|
|
808
|
-
comment: "Projectors and televisions",
|
|
809
|
-
},
|
|
810
|
-
},
|
|
811
153
|
margin: {
|
|
812
154
|
key: "{semantic.container-size.margin}",
|
|
813
155
|
value: "24px",
|
package/dist/scss/semantic.scss
CHANGED
|
@@ -2,8 +2,6 @@
|
|
|
2
2
|
// Calcite Design System
|
|
3
3
|
// Do not edit directly, this file was auto-generated.
|
|
4
4
|
|
|
5
|
-
$calcite-container-size-height-xxs-min: 0; // Small handheld devices and mini-windows
|
|
6
|
-
$calcite-container-size-width-xxs-min: 0; // Small handheld devices and mini-windows
|
|
7
5
|
$calcite-border-width-none: 0;
|
|
8
6
|
$calcite-border-width-sm: 1px;
|
|
9
7
|
$calcite-border-width-md: 2px;
|
|
@@ -111,26 +109,6 @@ $calcite-z-index-overlay: 700;
|
|
|
111
109
|
$calcite-z-index-modal: 800;
|
|
112
110
|
$calcite-z-index-popup: 900;
|
|
113
111
|
$calcite-z-index-tooltip: 901;
|
|
114
|
-
$calcite-container-size-height-xxs-max: 154px; // Small handheld devices and mini-windows
|
|
115
|
-
$calcite-container-size-height-xs-min: 155px; // Handheld devices
|
|
116
|
-
$calcite-container-size-height-xs-max: 328px; // Handheld devices
|
|
117
|
-
$calcite-container-size-height-sm-min: 329px; // Small tablets
|
|
118
|
-
$calcite-container-size-height-sm-max: 504px; // Small tablets
|
|
119
|
-
$calcite-container-size-height-md-min: 505px; // Small laptops
|
|
120
|
-
$calcite-container-size-height-md-max: 678px; // Small laptops
|
|
121
|
-
$calcite-container-size-height-lg-min: 679px; // Large laptops and desktop computers
|
|
122
|
-
$calcite-container-size-height-lg-max: 854px; // Large laptops and desktop computers
|
|
123
|
-
$calcite-container-size-height-xl-min: 855px; // Projectors and televisions
|
|
124
|
-
$calcite-container-size-width-xxs-max: 320px; // Small handheld devices and mini-windows
|
|
125
|
-
$calcite-container-size-width-xs-min: 321px; // Handheld devices
|
|
126
|
-
$calcite-container-size-width-xs-max: 476px; // Handheld devices
|
|
127
|
-
$calcite-container-size-width-sm-min: 477px; // Small tablets
|
|
128
|
-
$calcite-container-size-width-sm-max: 768px; // Small tablets
|
|
129
|
-
$calcite-container-size-width-md-min: 769px; // Small laptops
|
|
130
|
-
$calcite-container-size-width-md-max: 1152px; // Small laptops
|
|
131
|
-
$calcite-container-size-width-lg-min: 1153px; // Large laptops and desktop computers
|
|
132
|
-
$calcite-container-size-width-lg-max: 1440px; // Large laptops and desktop computers
|
|
133
|
-
$calcite-container-size-width-xl-min: 1441px; // Projectors and televisions
|
|
134
112
|
$calcite-corner-radius: $calcite-corner-radius-none;
|
|
135
113
|
$calcite-shadow-none: 0 0 0 0 rgba(0, 0, 0, 0);
|
|
136
114
|
$calcite-shadow-sm: 0 2px 8px 0 rgba(0, 0, 0, 0.04), 0 4px 16px 0 rgba(0, 0, 0, 0.08);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@esri/calcite-design-tokens",
|
|
3
|
-
"version": "3.2.0-next.
|
|
3
|
+
"version": "3.2.0-next.4",
|
|
4
4
|
"description": "Esri's Calcite Design System Tokens",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"Calcite",
|
|
@@ -46,5 +46,5 @@
|
|
|
46
46
|
"devDependencies": {
|
|
47
47
|
"vitest": "3.2.4"
|
|
48
48
|
},
|
|
49
|
-
"gitHead": "
|
|
49
|
+
"gitHead": "a2b9ffecf8b347f31428b8fed33a67ddc27652e4"
|
|
50
50
|
}
|