@sage/design-tokens 2.2.0 → 2.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 (38) hide show
  1. package/android/base.xml +385 -0
  2. package/assets/fonts/sageui.css +18 -18
  3. package/css/base.css +387 -0
  4. package/data/tokens.json +1450 -257
  5. package/docs/tokens/{no-theme → base}/border-radius/index.html +25 -20
  6. package/docs/tokens/{no-theme → base}/border-width/index.html +35 -30
  7. package/docs/tokens/base/box-shadow/index.html +451 -0
  8. package/docs/tokens/base/colors/index.html +4063 -0
  9. package/docs/tokens/{no-theme → base}/font-families/index.html +33 -28
  10. package/docs/tokens/{no-theme → base}/font-sizes/index.html +65 -60
  11. package/docs/tokens/{no-theme → base}/font-weights/index.html +29 -24
  12. package/docs/tokens/base/index.html +8353 -0
  13. package/docs/tokens/{no-theme → base}/line-heights/index.html +47 -21
  14. package/docs/tokens/{no-theme/box-shadow → base/opacity}/index.html +42 -58
  15. package/docs/tokens/{no-theme → base}/sizing/index.html +167 -78
  16. package/docs/tokens/{no-theme → base}/spacing/index.html +71 -66
  17. package/docs/tokens/base/typography/index.html +2698 -0
  18. package/docs/tokens/index.html +4318 -1771
  19. package/index.d.ts +2 -2
  20. package/index.js +2 -2
  21. package/ios/base.h +389 -0
  22. package/js/{no-theme → base}/common.d.ts +136 -16
  23. package/js/base/common.js +387 -0
  24. package/js/{no-theme → base}/es6.d.ts +136 -16
  25. package/js/base/es6.js +382 -0
  26. package/package.json +1 -1
  27. package/sage-design-tokens-2.3.0.tgz +0 -0
  28. package/scss/base.scss +384 -0
  29. package/android/no-theme.xml +0 -265
  30. package/css/no-theme.css +0 -267
  31. package/docs/tokens/no-theme/colors/index.html +0 -2903
  32. package/docs/tokens/no-theme/index.html +0 -5811
  33. package/docs/tokens/no-theme/typography/index.html +0 -1559
  34. package/ios/no-theme.h +0 -269
  35. package/js/no-theme/common.js +0 -267
  36. package/js/no-theme/es6.js +0 -262
  37. package/sage-design-tokens-2.2.0.tgz +0 -0
  38. package/scss/no-theme.scss +0 -264
package/docs/tokens/no-theme/typography/index.html DELETED
@@ -1,1559 +0,0 @@
1
- <!doctype html>
2
- <html class="no-js" lang="en">
3
- <head>
4
- <meta charset="utf-8">
5
- <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
6
- <meta http-equiv="Pragma" content="no-cache" />
7
- <meta http-equiv="Expires" content="0" />
8
-
9
- <title>Sage Design Tokens / no-theme / typography</title>
10
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.3/css/bulma.min.css">
11
- <link rel="preconnect" href="https://fonts.googleapis.com">
12
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
13
- <link href="https://fonts.googleapis.com/css?family=Lato:400,500,600" rel="stylesheet">
14
- <meta name="description" content="">
15
- <style>
16
- *, *::before, *::after {
17
- box-sizing: border-box;
18
- }
19
-
20
- html {
21
- font-size: 62.5%;
22
- }
23
-
24
- body {
25
- font-size: 1.4rem;
26
- font-family: 'Lato', Arial, sans-serif;
27
- padding: 20px 40px;
28
- }
29
-
30
- table {
31
- width: 100%;
32
- }
33
-
34
- .menu {
35
- position: sticky;
36
- display: inline-block;
37
- vertical-align: top;
38
- max-height: 100vh;
39
- overflow-y: auto;
40
- top: 0;
41
- bottom: 0;
42
- font-size: 14px;
43
- }
44
-
45
- .with-icons:hover .permalink {
46
- visibility: visible;
47
- }
48
-
49
- .permalink {
50
- visibility: hidden;
51
- font-size: 80%;
52
- line-height: inherit;
53
- text-decoration: none;
54
- vertical-align: middle;
55
- }
56
-
57
- .table__color-preview,
58
- .table__spacing-preview,
59
- .table__border-width-preview,
60
- .table__font-size-preview,
61
- .table__sizing-preview,
62
- .table__opacity-preview,
63
- .table__typography-preview,
64
- .table__font-weight-preview,
65
- .table__box-shadow-preview,
66
- .table__font-family-preview,
67
- .table__border-radius-preview {
68
- height: 40px;
69
- width: 100%;
70
- }
71
-
72
- .table__font-size-preview,
73
- .table__typography-preview,
74
- .table__font-weight-preview,
75
- .table__font-family-preview {
76
- vertical-align: middle;
77
- display: table-cell;
78
- }
79
-
80
- .table__box-shadow-preview {
81
- height: 50px;
82
- }
83
-
84
- .table__spacing-preview {
85
- background-color: #626566;
86
- height: 10px;
87
- }
88
-
89
- .table__border-width-preview {
90
- border-style: solid;
91
- border-color: #CCD6DB;
92
- background-color: #626566;
93
- }
94
-
95
- .table__sizing-preview {
96
- background-color: #626566;
97
- }
98
-
99
- .table__opacity-preview {
100
- background-color: #ccc;
101
- }
102
-
103
- .table__opacity-preview div {
104
- width: 100%;
105
- height: 100%;
106
- background-color: #fff;
107
- }
108
-
109
- .table__border-radius-preview {
110
- width: 40px;
111
- border-color: #626566;
112
- border-width: 3px 3px 0 0;
113
- border-style: solid;
114
- }
115
-
116
- #main-container {
117
- max-width: 1024px;
118
- margin: 0 auto;
119
- }
120
-
121
- .embedded #main-container {
122
- max-width: 100%;
123
- }
124
-
125
- #icons-container {
126
- display: grid;
127
- grid-template-columns: repeat(6, 1fr);
128
- grid-gap: 20px;
129
- }
130
-
131
- .divider {
132
- margin: 20px 0 30px;
133
- }
134
-
135
- .grid-item {
136
- display: block;
137
- text-align: center;
138
- position: relative;
139
- padding-bottom: 40px;
140
- padding-top: 20px;
141
- border: 1px solid #dbdbdb;
142
- }
143
-
144
- .grid-item .codes {
145
- position: absolute;
146
- display: flex;
147
- justify-content: space-between;
148
- padding: 5px 20px;
149
- bottom: 0;
150
- left: 0;
151
- right: 0;
152
- border-top: 1px solid rgba(10, 10, 10, .1);
153
- }
154
-
155
- .grid-item .codes div {
156
- cursor: default;
157
- color: rgba(10, 10, 10, .6);
158
- }
159
-
160
- .preview {
161
- display: block;
162
- width: 32px;
163
- height: auto;
164
- }
165
-
166
- .layout {
167
- display: flex;
168
- }
169
-
170
- .layout .navigation {
171
- flex: 0 0 200px;
172
- }
173
-
174
- .layout .content {
175
- flex: 1 1 auto;
176
- }
177
-
178
- .embedded {
179
- padding: 10px;
180
- }
181
-
182
- .embedded .hide-on-embedded {
183
- display: none;
184
- }
185
- </style>
186
- </head>
187
- <body>
188
- <div id="main-container">
189
- <div class="layout">
190
- <aside class="hide-on-embedded navigation menu py-0">
191
- <section class="my-6">
192
- <p class="menu-label">
193
- <a href="../../no-theme/index.html">
194
- no-theme
195
- </a>
196
- </p>
197
- <ul class="menu-list">
198
- <li>
199
- <a href="../../no-theme/colors/index.html">
200
- colors
201
- </a>
202
- </li>
203
- <li>
204
- <a href="../../no-theme/sizing/index.html">
205
- sizing
206
- </a>
207
- </li>
208
- <li>
209
- <a href="../../no-theme/spacing/index.html">
210
- spacing
211
- </a>
212
- </li>
213
- <li>
214
- <a href="../../no-theme/border-width/index.html">
215
- borderWidth
216
- </a>
217
- </li>
218
- <li>
219
- <a href="../../no-theme/font-sizes/index.html">
220
- fontSizes
221
- </a>
222
- </li>
223
- <li>
224
- <a href="../../no-theme/box-shadow/index.html">
225
- boxShadow
226
- </a>
227
- </li>
228
- <li>
229
- <a href="../../no-theme/font-weights/index.html">
230
- fontWeights
231
- </a>
232
- </li>
233
- <li>
234
- <a href="../../no-theme/line-heights/index.html">
235
- lineHeights
236
- </a>
237
- </li>
238
- <li>
239
- <a href="../../no-theme/font-families/index.html">
240
- fontFamilies
241
- </a>
242
- </li>
243
- <li>
244
- <a href="../../no-theme/border-radius/index.html">
245
- borderRadius
246
- </a>
247
- </li>
248
- <li>
249
- <a href="../../no-theme/typography/index.html">
250
- typography
251
- </a>
252
- </li>
253
- </ul>
254
- </section>
255
- </aside>
256
- <main class="content">
257
- <h1 class="hide-on-embedded">
258
- <a href="../../index.html">
259
- Sage Design Tokens
260
- </a>
261
- /
262
- <a href="../index.html">
263
- no-theme
264
- </a>
265
- /
266
- typography
267
- </h1>
268
-
269
- <section class="my-6">
270
- <table class="table is-bordered is-hoverable is-fullwidth">
271
- <colgroup>
272
- <col width="50%">
273
- <col width="25%">
274
- <col width="35%">
275
- </colgroup>
276
- <thead>
277
- <tr>
278
- <th class="has-background-light">Name</th>
279
- <th class="has-background-light">Value</th>
280
- <th class="has-background-light">Preview</th>
281
- </tr>
282
- </thead>
283
- <tr>
284
- <td class="with-icons is-vcentered"
285
- id="no-theme-typographyButtonLabelS"
286
- title="theme: no-theme; category: typography; group: button; name: label; variant: s; ">
287
- typographyButtonLabelS
288
- <a href="#no-theme-typographyButtonLabelS"
289
- title="permalink"
290
- class="permalink">
291
- 🔗
292
- </a>
293
- </td>
294
- <td class="is-vcentered">
295
- <pre>700 14px/150% Pridi</pre>
296
- </td>
297
- <td class="is-vcentered">
298
- <div class="table__typography-preview">
299
- n/a
300
- </div>
301
-
302
- </td>
303
- </tr>
304
- <tr>
305
- <td class="with-icons is-vcentered"
306
- id="no-theme-typographyButtonLabelM"
307
- title="theme: no-theme; category: typography; group: button; name: label; variant: m; ">
308
- typographyButtonLabelM
309
- <a href="#no-theme-typographyButtonLabelM"
310
- title="permalink"
311
- class="permalink">
312
- 🔗
313
- </a>
314
- </td>
315
- <td class="is-vcentered">
316
- <pre>700 14px/150% Pridi</pre>
317
- </td>
318
- <td class="is-vcentered">
319
- <div class="table__typography-preview">
320
- n/a
321
- </div>
322
-
323
- </td>
324
- </tr>
325
- <tr>
326
- <td class="with-icons is-vcentered"
327
- id="no-theme-typographyButtonLabelL"
328
- title="theme: no-theme; category: typography; group: button; name: label; variant: l; ">
329
- typographyButtonLabelL
330
- <a href="#no-theme-typographyButtonLabelL"
331
- title="permalink"
332
- class="permalink">
333
- 🔗
334
- </a>
335
- </td>
336
- <td class="is-vcentered">
337
- <pre>700 16px/150% Pridi</pre>
338
- </td>
339
- <td class="is-vcentered">
340
- <div class="table__typography-preview">
341
- n/a
342
- </div>
343
-
344
- </td>
345
- </tr>
346
- <tr>
347
- <td class="with-icons is-vcentered"
348
- id="no-theme-typographyDialogTitleXs"
349
- title="theme: no-theme; category: typography; group: dialog; name: title; variant: xs; ">
350
- typographyDialogTitleXs
351
- <a href="#no-theme-typographyDialogTitleXs"
352
- title="permalink"
353
- class="permalink">
354
- 🔗
355
- </a>
356
- </td>
357
- <td class="is-vcentered">
358
- <pre>700 20px/125% Pridi</pre>
359
- </td>
360
- <td class="is-vcentered">
361
- <div class="table__typography-preview">
362
- n/a
363
- </div>
364
-
365
- </td>
366
- </tr>
367
- <tr>
368
- <td class="with-icons is-vcentered"
369
- id="no-theme-typographyDialogTitleS"
370
- title="theme: no-theme; category: typography; group: dialog; name: title; variant: s; ">
371
- typographyDialogTitleS
372
- <a href="#no-theme-typographyDialogTitleS"
373
- title="permalink"
374
- class="permalink">
375
- 🔗
376
- </a>
377
- </td>
378
- <td class="is-vcentered">
379
- <pre>700 20px/125% Pridi</pre>
380
- </td>
381
- <td class="is-vcentered">
382
- <div class="table__typography-preview">
383
- n/a
384
- </div>
385
-
386
- </td>
387
- </tr>
388
- <tr>
389
- <td class="with-icons is-vcentered"
390
- id="no-theme-typographyDialogTitleMs"
391
- title="theme: no-theme; category: typography; group: dialog; name: title; variant: ms; ">
392
- typographyDialogTitleMs
393
- <a href="#no-theme-typographyDialogTitleMs"
394
- title="permalink"
395
- class="permalink">
396
- 🔗
397
- </a>
398
- </td>
399
- <td class="is-vcentered">
400
- <pre>700 20px/125% Pridi</pre>
401
- </td>
402
- <td class="is-vcentered">
403
- <div class="table__typography-preview">
404
- n/a
405
- </div>
406
-
407
- </td>
408
- </tr>
409
- <tr>
410
- <td class="with-icons is-vcentered"
411
- id="no-theme-typographyDialogTitleM"
412
- title="theme: no-theme; category: typography; group: dialog; name: title; variant: m; ">
413
- typographyDialogTitleM
414
- <a href="#no-theme-typographyDialogTitleM"
415
- title="permalink"
416
- class="permalink">
417
- 🔗
418
- </a>
419
- </td>
420
- <td class="is-vcentered">
421
- <pre>700 20px/125% Pridi</pre>
422
- </td>
423
- <td class="is-vcentered">
424
- <div class="table__typography-preview">
425
- n/a
426
- </div>
427
-
428
- </td>
429
- </tr>
430
- <tr>
431
- <td class="with-icons is-vcentered"
432
- id="no-theme-typographyDialogTitleMl"
433
- title="theme: no-theme; category: typography; group: dialog; name: title; variant: ml; ">
434
- typographyDialogTitleMl
435
- <a href="#no-theme-typographyDialogTitleMl"
436
- title="permalink"
437
- class="permalink">
438
- 🔗
439
- </a>
440
- </td>
441
- <td class="is-vcentered">
442
- <pre>700 20px/125% Pridi</pre>
443
- </td>
444
- <td class="is-vcentered">
445
- <div class="table__typography-preview">
446
- n/a
447
- </div>
448
-
449
- </td>
450
- </tr>
451
- <tr>
452
- <td class="with-icons is-vcentered"
453
- id="no-theme-typographyDialogTitleL"
454
- title="theme: no-theme; category: typography; group: dialog; name: title; variant: l; ">
455
- typographyDialogTitleL
456
- <a href="#no-theme-typographyDialogTitleL"
457
- title="permalink"
458
- class="permalink">
459
- 🔗
460
- </a>
461
- </td>
462
- <td class="is-vcentered">
463
- <pre>700 20px/125% Pridi</pre>
464
- </td>
465
- <td class="is-vcentered">
466
- <div class="table__typography-preview">
467
- n/a
468
- </div>
469
-
470
- </td>
471
- </tr>
472
- <tr>
473
- <td class="with-icons is-vcentered"
474
- id="no-theme-typographyDialogTitleXl"
475
- title="theme: no-theme; category: typography; group: dialog; name: title; variant: xl; ">
476
- typographyDialogTitleXl
477
- <a href="#no-theme-typographyDialogTitleXl"
478
- title="permalink"
479
- class="permalink">
480
- 🔗
481
- </a>
482
- </td>
483
- <td class="is-vcentered">
484
- <pre>700 20px/125% Pridi</pre>
485
- </td>
486
- <td class="is-vcentered">
487
- <div class="table__typography-preview">
488
- n/a
489
- </div>
490
-
491
- </td>
492
- </tr>
493
- <tr>
494
- <td class="with-icons is-vcentered"
495
- id="no-theme-typographyFlashTextM"
496
- title="theme: no-theme; category: typography; group: flash; name: text; variant: m; ">
497
- typographyFlashTextM
498
- <a href="#no-theme-typographyFlashTextM"
499
- title="permalink"
500
- class="permalink">
501
- 🔗
502
- </a>
503
- </td>
504
- <td class="is-vcentered">
505
- <pre>400 14px/150% Pridi</pre>
506
- </td>
507
- <td class="is-vcentered">
508
- <div class="table__typography-preview">
509
- n/a
510
- </div>
511
-
512
- </td>
513
- </tr>
514
- <tr>
515
- <td class="with-icons is-vcentered"
516
- id="no-theme-typographyFlashTextL"
517
- title="theme: no-theme; category: typography; group: flash; name: text; variant: l; ">
518
- typographyFlashTextL
519
- <a href="#no-theme-typographyFlashTextL"
520
- title="permalink"
521
- class="permalink">
522
- 🔗
523
- </a>
524
- </td>
525
- <td class="is-vcentered">
526
- <pre>400 16px/150% Pridi</pre>
527
- </td>
528
- <td class="is-vcentered">
529
- <div class="table__typography-preview">
530
- n/a
531
- </div>
532
-
533
- </td>
534
- </tr>
535
- <tr>
536
- <td class="with-icons is-vcentered"
537
- id="no-theme-typographyFormFieldLabelXs"
538
- title="theme: no-theme; category: typography; group: formField; name: label; variant: xs; ">
539
- typographyFormFieldLabelXs
540
- <a href="#no-theme-typographyFormFieldLabelXs"
541
- title="permalink"
542
- class="permalink">
543
- 🔗
544
- </a>
545
- </td>
546
- <td class="is-vcentered">
547
- <pre>500 14px/150% Pridi</pre>
548
- </td>
549
- <td class="is-vcentered">
550
- <div class="table__typography-preview">
551
- n/a
552
- </div>
553
-
554
- </td>
555
- </tr>
556
- <tr>
557
- <td class="with-icons is-vcentered"
558
- id="no-theme-typographyFormFieldLabelS"
559
- title="theme: no-theme; category: typography; group: formField; name: label; variant: s; ">
560
- typographyFormFieldLabelS
561
- <a href="#no-theme-typographyFormFieldLabelS"
562
- title="permalink"
563
- class="permalink">
564
- 🔗
565
- </a>
566
- </td>
567
- <td class="is-vcentered">
568
- <pre>500 14px/150% Pridi</pre>
569
- </td>
570
- <td class="is-vcentered">
571
- <div class="table__typography-preview">
572
- n/a
573
- </div>
574
-
575
- </td>
576
- </tr>
577
- <tr>
578
- <td class="with-icons is-vcentered"
579
- id="no-theme-typographyFormFieldLabelM"
580
- title="theme: no-theme; category: typography; group: formField; name: label; variant: m; ">
581
- typographyFormFieldLabelM
582
- <a href="#no-theme-typographyFormFieldLabelM"
583
- title="permalink"
584
- class="permalink">
585
- 🔗
586
- </a>
587
- </td>
588
- <td class="is-vcentered">
589
- <pre>500 14px/150% Pridi</pre>
590
- </td>
591
- <td class="is-vcentered">
592
- <div class="table__typography-preview">
593
- n/a
594
- </div>
595
-
596
- </td>
597
- </tr>
598
- <tr>
599
- <td class="with-icons is-vcentered"
600
- id="no-theme-typographyFormFieldLabelL"
601
- title="theme: no-theme; category: typography; group: formField; name: label; variant: l; ">
602
- typographyFormFieldLabelL
603
- <a href="#no-theme-typographyFormFieldLabelL"
604
- title="permalink"
605
- class="permalink">
606
- 🔗
607
- </a>
608
- </td>
609
- <td class="is-vcentered">
610
- <pre>500 16px/150% Pridi</pre>
611
- </td>
612
- <td class="is-vcentered">
613
- <div class="table__typography-preview">
614
- n/a
615
- </div>
616
-
617
- </td>
618
- </tr>
619
- <tr>
620
- <td class="with-icons is-vcentered"
621
- id="no-theme-typographyFormFieldHintTextXs"
622
- title="theme: no-theme; category: typography; group: formField; name: hintText; variant: xs; ">
623
- typographyFormFieldHintTextXs
624
- <a href="#no-theme-typographyFormFieldHintTextXs"
625
- title="permalink"
626
- class="permalink">
627
- 🔗
628
- </a>
629
- </td>
630
- <td class="is-vcentered">
631
- <pre>400 14px/150% Pridi</pre>
632
- </td>
633
- <td class="is-vcentered">
634
- <div class="table__typography-preview">
635
- n/a
636
- </div>
637
-
638
- </td>
639
- </tr>
640
- <tr>
641
- <td class="with-icons is-vcentered"
642
- id="no-theme-typographyFormFieldHintTextS"
643
- title="theme: no-theme; category: typography; group: formField; name: hintText; variant: s; ">
644
- typographyFormFieldHintTextS
645
- <a href="#no-theme-typographyFormFieldHintTextS"
646
- title="permalink"
647
- class="permalink">
648
- 🔗
649
- </a>
650
- </td>
651
- <td class="is-vcentered">
652
- <pre>400 14px/150% Pridi</pre>
653
- </td>
654
- <td class="is-vcentered">
655
- <div class="table__typography-preview">
656
- n/a
657
- </div>
658
-
659
- </td>
660
- </tr>
661
- <tr>
662
- <td class="with-icons is-vcentered"
663
- id="no-theme-typographyFormFieldHintTextM"
664
- title="theme: no-theme; category: typography; group: formField; name: hintText; variant: m; ">
665
- typographyFormFieldHintTextM
666
- <a href="#no-theme-typographyFormFieldHintTextM"
667
- title="permalink"
668
- class="permalink">
669
- 🔗
670
- </a>
671
- </td>
672
- <td class="is-vcentered">
673
- <pre>400 14px/150% Pridi</pre>
674
- </td>
675
- <td class="is-vcentered">
676
- <div class="table__typography-preview">
677
- n/a
678
- </div>
679
-
680
- </td>
681
- </tr>
682
- <tr>
683
- <td class="with-icons is-vcentered"
684
- id="no-theme-typographyFormFieldHintTextL"
685
- title="theme: no-theme; category: typography; group: formField; name: hintText; variant: l; ">
686
- typographyFormFieldHintTextL
687
- <a href="#no-theme-typographyFormFieldHintTextL"
688
- title="permalink"
689
- class="permalink">
690
- 🔗
691
- </a>
692
- </td>
693
- <td class="is-vcentered">
694
- <pre>400 16px/150% Pridi</pre>
695
- </td>
696
- <td class="is-vcentered">
697
- <div class="table__typography-preview">
698
- n/a
699
- </div>
700
-
701
- </td>
702
- </tr>
703
- <tr>
704
- <td class="with-icons is-vcentered"
705
- id="no-theme-typographyFormFieldErrorMessageXs"
706
- title="theme: no-theme; category: typography; group: formField; name: errorMessage; variant: xs; ">
707
- typographyFormFieldErrorMessageXs
708
- <a href="#no-theme-typographyFormFieldErrorMessageXs"
709
- title="permalink"
710
- class="permalink">
711
- 🔗
712
- </a>
713
- </td>
714
- <td class="is-vcentered">
715
- <pre>500 14px/150% Pridi</pre>
716
- </td>
717
- <td class="is-vcentered">
718
- <div class="table__typography-preview">
719
- n/a
720
- </div>
721
-
722
- </td>
723
- </tr>
724
- <tr>
725
- <td class="with-icons is-vcentered"
726
- id="no-theme-typographyFormFieldErrorMessageS"
727
- title="theme: no-theme; category: typography; group: formField; name: errorMessage; variant: s; ">
728
- typographyFormFieldErrorMessageS
729
- <a href="#no-theme-typographyFormFieldErrorMessageS"
730
- title="permalink"
731
- class="permalink">
732
- 🔗
733
- </a>
734
- </td>
735
- <td class="is-vcentered">
736
- <pre>500 14px/150% Pridi</pre>
737
- </td>
738
- <td class="is-vcentered">
739
- <div class="table__typography-preview">
740
- n/a
741
- </div>
742
-
743
- </td>
744
- </tr>
745
- <tr>
746
- <td class="with-icons is-vcentered"
747
- id="no-theme-typographyFormFieldErrorMessageM"
748
- title="theme: no-theme; category: typography; group: formField; name: errorMessage; variant: m; ">
749
- typographyFormFieldErrorMessageM
750
- <a href="#no-theme-typographyFormFieldErrorMessageM"
751
- title="permalink"
752
- class="permalink">
753
- 🔗
754
- </a>
755
- </td>
756
- <td class="is-vcentered">
757
- <pre>500 14px/150% Pridi</pre>
758
- </td>
759
- <td class="is-vcentered">
760
- <div class="table__typography-preview">
761
- n/a
762
- </div>
763
-
764
- </td>
765
- </tr>
766
- <tr>
767
- <td class="with-icons is-vcentered"
768
- id="no-theme-typographyFormFieldErrorMessageL"
769
- title="theme: no-theme; category: typography; group: formField; name: errorMessage; variant: l; ">
770
- typographyFormFieldErrorMessageL
771
- <a href="#no-theme-typographyFormFieldErrorMessageL"
772
- title="permalink"
773
- class="permalink">
774
- 🔗
775
- </a>
776
- </td>
777
- <td class="is-vcentered">
778
- <pre>500 16px/150% Pridi</pre>
779
- </td>
780
- <td class="is-vcentered">
781
- <div class="table__typography-preview">
782
- n/a
783
- </div>
784
-
785
- </td>
786
- </tr>
787
- <tr>
788
- <td class="with-icons is-vcentered"
789
- id="no-theme-typographyFormFieldCautionMessageXs"
790
- title="theme: no-theme; category: typography; group: formField; name: cautionMessage; variant: xs; ">
791
- typographyFormFieldCautionMessageXs
792
- <a href="#no-theme-typographyFormFieldCautionMessageXs"
793
- title="permalink"
794
- class="permalink">
795
- 🔗
796
- </a>
797
- </td>
798
- <td class="is-vcentered">
799
- <pre>400 14px/150% Pridi</pre>
800
- </td>
801
- <td class="is-vcentered">
802
- <div class="table__typography-preview">
803
- n/a
804
- </div>
805
-
806
- </td>
807
- </tr>
808
- <tr>
809
- <td class="with-icons is-vcentered"
810
- id="no-theme-typographyFormFieldCautionMessageS"
811
- title="theme: no-theme; category: typography; group: formField; name: cautionMessage; variant: s; ">
812
- typographyFormFieldCautionMessageS
813
- <a href="#no-theme-typographyFormFieldCautionMessageS"
814
- title="permalink"
815
- class="permalink">
816
- 🔗
817
- </a>
818
- </td>
819
- <td class="is-vcentered">
820
- <pre>400 14px/150% Pridi</pre>
821
- </td>
822
- <td class="is-vcentered">
823
- <div class="table__typography-preview">
824
- n/a
825
- </div>
826
-
827
- </td>
828
- </tr>
829
- <tr>
830
- <td class="with-icons is-vcentered"
831
- id="no-theme-typographyFormFieldCautionMessageM"
832
- title="theme: no-theme; category: typography; group: formField; name: cautionMessage; variant: m; ">
833
- typographyFormFieldCautionMessageM
834
- <a href="#no-theme-typographyFormFieldCautionMessageM"
835
- title="permalink"
836
- class="permalink">
837
- 🔗
838
- </a>
839
- </td>
840
- <td class="is-vcentered">
841
- <pre>400 14px/150% Pridi</pre>
842
- </td>
843
- <td class="is-vcentered">
844
- <div class="table__typography-preview">
845
- n/a
846
- </div>
847
-
848
- </td>
849
- </tr>
850
- <tr>
851
- <td class="with-icons is-vcentered"
852
- id="no-theme-typographyFormFieldCautionMessageL"
853
- title="theme: no-theme; category: typography; group: formField; name: cautionMessage; variant: l; ">
854
- typographyFormFieldCautionMessageL
855
- <a href="#no-theme-typographyFormFieldCautionMessageL"
856
- title="permalink"
857
- class="permalink">
858
- 🔗
859
- </a>
860
- </td>
861
- <td class="is-vcentered">
862
- <pre>400 16px/150% Pridi</pre>
863
- </td>
864
- <td class="is-vcentered">
865
- <div class="table__typography-preview">
866
- n/a
867
- </div>
868
-
869
- </td>
870
- </tr>
871
- <tr>
872
- <td class="with-icons is-vcentered"
873
- id="no-theme-typographyFormFieldInputTextXs"
874
- title="theme: no-theme; category: typography; group: formField; name: inputText; variant: xs; ">
875
- typographyFormFieldInputTextXs
876
- <a href="#no-theme-typographyFormFieldInputTextXs"
877
- title="permalink"
878
- class="permalink">
879
- 🔗
880
- </a>
881
- </td>
882
- <td class="is-vcentered">
883
- <pre>400 14px/150% Pridi</pre>
884
- </td>
885
- <td class="is-vcentered">
886
- <div class="table__typography-preview">
887
- n/a
888
- </div>
889
-
890
- </td>
891
- </tr>
892
- <tr>
893
- <td class="with-icons is-vcentered"
894
- id="no-theme-typographyFormFieldInputTextS"
895
- title="theme: no-theme; category: typography; group: formField; name: inputText; variant: s; ">
896
- typographyFormFieldInputTextS
897
- <a href="#no-theme-typographyFormFieldInputTextS"
898
- title="permalink"
899
- class="permalink">
900
- 🔗
901
- </a>
902
- </td>
903
- <td class="is-vcentered">
904
- <pre>400 14px/150% Pridi</pre>
905
- </td>
906
- <td class="is-vcentered">
907
- <div class="table__typography-preview">
908
- n/a
909
- </div>
910
-
911
- </td>
912
- </tr>
913
- <tr>
914
- <td class="with-icons is-vcentered"
915
- id="no-theme-typographyFormFieldInputTextM"
916
- title="theme: no-theme; category: typography; group: formField; name: inputText; variant: m; ">
917
- typographyFormFieldInputTextM
918
- <a href="#no-theme-typographyFormFieldInputTextM"
919
- title="permalink"
920
- class="permalink">
921
- 🔗
922
- </a>
923
- </td>
924
- <td class="is-vcentered">
925
- <pre>400 14px/150% Pridi</pre>
926
- </td>
927
- <td class="is-vcentered">
928
- <div class="table__typography-preview">
929
- n/a
930
- </div>
931
-
932
- </td>
933
- </tr>
934
- <tr>
935
- <td class="with-icons is-vcentered"
936
- id="no-theme-typographyFormFieldInputTextL"
937
- title="theme: no-theme; category: typography; group: formField; name: inputText; variant: l; ">
938
- typographyFormFieldInputTextL
939
- <a href="#no-theme-typographyFormFieldInputTextL"
940
- title="permalink"
941
- class="permalink">
942
- 🔗
943
- </a>
944
- </td>
945
- <td class="is-vcentered">
946
- <pre>400 16px/150% Pridi</pre>
947
- </td>
948
- <td class="is-vcentered">
949
- <div class="table__typography-preview">
950
- n/a
951
- </div>
952
-
953
- </td>
954
- </tr>
955
- <tr>
956
- <td class="with-icons is-vcentered"
957
- id="no-theme-typographyFormFieldDropdownOptionsXs"
958
- title="theme: no-theme; category: typography; group: formField; name: dropdownOptions; variant: xs; ">
959
- typographyFormFieldDropdownOptionsXs
960
- <a href="#no-theme-typographyFormFieldDropdownOptionsXs"
961
- title="permalink"
962
- class="permalink">
963
- 🔗
964
- </a>
965
- </td>
966
- <td class="is-vcentered">
967
- <pre>400 14px/150% Pridi</pre>
968
- </td>
969
- <td class="is-vcentered">
970
- <div class="table__typography-preview">
971
- n/a
972
- </div>
973
-
974
- </td>
975
- </tr>
976
- <tr>
977
- <td class="with-icons is-vcentered"
978
- id="no-theme-typographyFormFieldDropdownOptionsS"
979
- title="theme: no-theme; category: typography; group: formField; name: dropdownOptions; variant: s; ">
980
- typographyFormFieldDropdownOptionsS
981
- <a href="#no-theme-typographyFormFieldDropdownOptionsS"
982
- title="permalink"
983
- class="permalink">
984
- 🔗
985
- </a>
986
- </td>
987
- <td class="is-vcentered">
988
- <pre>400 14px/150% Pridi</pre>
989
- </td>
990
- <td class="is-vcentered">
991
- <div class="table__typography-preview">
992
- n/a
993
- </div>
994
-
995
- </td>
996
- </tr>
997
- <tr>
998
- <td class="with-icons is-vcentered"
999
- id="no-theme-typographyFormFieldDropdownOptionsM"
1000
- title="theme: no-theme; category: typography; group: formField; name: dropdownOptions; variant: m; ">
1001
- typographyFormFieldDropdownOptionsM
1002
- <a href="#no-theme-typographyFormFieldDropdownOptionsM"
1003
- title="permalink"
1004
- class="permalink">
1005
- 🔗
1006
- </a>
1007
- </td>
1008
- <td class="is-vcentered">
1009
- <pre>400 14px/150% Pridi</pre>
1010
- </td>
1011
- <td class="is-vcentered">
1012
- <div class="table__typography-preview">
1013
- n/a
1014
- </div>
1015
-
1016
- </td>
1017
- </tr>
1018
- <tr>
1019
- <td class="with-icons is-vcentered"
1020
- id="no-theme-typographyFormFieldDropdownOptionsL"
1021
- title="theme: no-theme; category: typography; group: formField; name: dropdownOptions; variant: l; ">
1022
- typographyFormFieldDropdownOptionsL
1023
- <a href="#no-theme-typographyFormFieldDropdownOptionsL"
1024
- title="permalink"
1025
- class="permalink">
1026
- 🔗
1027
- </a>
1028
- </td>
1029
- <td class="is-vcentered">
1030
- <pre>400 16px/150% Pridi</pre>
1031
- </td>
1032
- <td class="is-vcentered">
1033
- <div class="table__typography-preview">
1034
- n/a
1035
- </div>
1036
-
1037
- </td>
1038
- </tr>
1039
- <tr>
1040
- <td class="with-icons is-vcentered"
1041
- id="no-theme-typographyFormFieldSecondLabelXs"
1042
- title="theme: no-theme; category: typography; group: formField; name: secondLabel; variant: xs; ">
1043
- typographyFormFieldSecondLabelXs
1044
- <a href="#no-theme-typographyFormFieldSecondLabelXs"
1045
- title="permalink"
1046
- class="permalink">
1047
- 🔗
1048
- </a>
1049
- </td>
1050
- <td class="is-vcentered">
1051
- <pre>500 14px/150% Pridi</pre>
1052
- </td>
1053
- <td class="is-vcentered">
1054
- <div class="table__typography-preview">
1055
- n/a
1056
- </div>
1057
-
1058
- </td>
1059
- </tr>
1060
- <tr>
1061
- <td class="with-icons is-vcentered"
1062
- id="no-theme-typographyFormFieldSecondLabelS"
1063
- title="theme: no-theme; category: typography; group: formField; name: secondLabel; variant: s; ">
1064
- typographyFormFieldSecondLabelS
1065
- <a href="#no-theme-typographyFormFieldSecondLabelS"
1066
- title="permalink"
1067
- class="permalink">
1068
- 🔗
1069
- </a>
1070
- </td>
1071
- <td class="is-vcentered">
1072
- <pre>500 14px/150% Pridi</pre>
1073
- </td>
1074
- <td class="is-vcentered">
1075
- <div class="table__typography-preview">
1076
- n/a
1077
- </div>
1078
-
1079
- </td>
1080
- </tr>
1081
- <tr>
1082
- <td class="with-icons is-vcentered"
1083
- id="no-theme-typographyFormFieldSecondLabelM"
1084
- title="theme: no-theme; category: typography; group: formField; name: secondLabel; variant: m; ">
1085
- typographyFormFieldSecondLabelM
1086
- <a href="#no-theme-typographyFormFieldSecondLabelM"
1087
- title="permalink"
1088
- class="permalink">
1089
- 🔗
1090
- </a>
1091
- </td>
1092
- <td class="is-vcentered">
1093
- <pre>500 14px/150% Pridi</pre>
1094
- </td>
1095
- <td class="is-vcentered">
1096
- <div class="table__typography-preview">
1097
- n/a
1098
- </div>
1099
-
1100
- </td>
1101
- </tr>
1102
- <tr>
1103
- <td class="with-icons is-vcentered"
1104
- id="no-theme-typographyFormFieldSecondLabelL"
1105
- title="theme: no-theme; category: typography; group: formField; name: secondLabel; variant: l; ">
1106
- typographyFormFieldSecondLabelL
1107
- <a href="#no-theme-typographyFormFieldSecondLabelL"
1108
- title="permalink"
1109
- class="permalink">
1110
- 🔗
1111
- </a>
1112
- </td>
1113
- <td class="is-vcentered">
1114
- <pre>500 16px/150% Pridi</pre>
1115
- </td>
1116
- <td class="is-vcentered">
1117
- <div class="table__typography-preview">
1118
- n/a
1119
- </div>
1120
-
1121
- </td>
1122
- </tr>
1123
- <tr>
1124
- <td class="with-icons is-vcentered"
1125
- id="no-theme-typographyFormFieldCharacterCountXs"
1126
- title="theme: no-theme; category: typography; group: formField; name: characterCount; variant: xs; ">
1127
- typographyFormFieldCharacterCountXs
1128
- <a href="#no-theme-typographyFormFieldCharacterCountXs"
1129
- title="permalink"
1130
- class="permalink">
1131
- 🔗
1132
- </a>
1133
- </td>
1134
- <td class="is-vcentered">
1135
- <pre>400 14px/150% Pridi</pre>
1136
- </td>
1137
- <td class="is-vcentered">
1138
- <div class="table__typography-preview">
1139
- n/a
1140
- </div>
1141
-
1142
- </td>
1143
- </tr>
1144
- <tr>
1145
- <td class="with-icons is-vcentered"
1146
- id="no-theme-typographyFormFieldCharacterCountS"
1147
- title="theme: no-theme; category: typography; group: formField; name: characterCount; variant: s; ">
1148
- typographyFormFieldCharacterCountS
1149
- <a href="#no-theme-typographyFormFieldCharacterCountS"
1150
- title="permalink"
1151
- class="permalink">
1152
- 🔗
1153
- </a>
1154
- </td>
1155
- <td class="is-vcentered">
1156
- <pre>400 14px/150% Pridi</pre>
1157
- </td>
1158
- <td class="is-vcentered">
1159
- <div class="table__typography-preview">
1160
- n/a
1161
- </div>
1162
-
1163
- </td>
1164
- </tr>
1165
- <tr>
1166
- <td class="with-icons is-vcentered"
1167
- id="no-theme-typographyFormFieldCharacterCountM"
1168
- title="theme: no-theme; category: typography; group: formField; name: characterCount; variant: m; ">
1169
- typographyFormFieldCharacterCountM
1170
- <a href="#no-theme-typographyFormFieldCharacterCountM"
1171
- title="permalink"
1172
- class="permalink">
1173
- 🔗
1174
- </a>
1175
- </td>
1176
- <td class="is-vcentered">
1177
- <pre>400 14px/150% Pridi</pre>
1178
- </td>
1179
- <td class="is-vcentered">
1180
- <div class="table__typography-preview">
1181
- n/a
1182
- </div>
1183
-
1184
- </td>
1185
- </tr>
1186
- <tr>
1187
- <td class="with-icons is-vcentered"
1188
- id="no-theme-typographyFormFieldCharacterCountL"
1189
- title="theme: no-theme; category: typography; group: formField; name: characterCount; variant: l; ">
1190
- typographyFormFieldCharacterCountL
1191
- <a href="#no-theme-typographyFormFieldCharacterCountL"
1192
- title="permalink"
1193
- class="permalink">
1194
- 🔗
1195
- </a>
1196
- </td>
1197
- <td class="is-vcentered">
1198
- <pre>400 14px/150% Pridi</pre>
1199
- </td>
1200
- <td class="is-vcentered">
1201
- <div class="table__typography-preview">
1202
- n/a
1203
- </div>
1204
-
1205
- </td>
1206
- </tr>
1207
- <tr>
1208
- <td class="with-icons is-vcentered"
1209
- id="no-theme-typographyLinkTextM"
1210
- title="theme: no-theme; category: typography; group: link; name: text; variant: m; ">
1211
- typographyLinkTextM
1212
- <a href="#no-theme-typographyLinkTextM"
1213
- title="permalink"
1214
- class="permalink">
1215
- 🔗
1216
- </a>
1217
- </td>
1218
- <td class="is-vcentered">
1219
- <pre>400 14px/150% Pridi</pre>
1220
- </td>
1221
- <td class="is-vcentered">
1222
- <div class="table__typography-preview">
1223
- n/a
1224
- </div>
1225
-
1226
- </td>
1227
- </tr>
1228
- <tr>
1229
- <td class="with-icons is-vcentered"
1230
- id="no-theme-typographyLinkTextL"
1231
- title="theme: no-theme; category: typography; group: link; name: text; variant: l; ">
1232
- typographyLinkTextL
1233
- <a href="#no-theme-typographyLinkTextL"
1234
- title="permalink"
1235
- class="permalink">
1236
- 🔗
1237
- </a>
1238
- </td>
1239
- <td class="is-vcentered">
1240
- <pre>400 16px/150% Pridi</pre>
1241
- </td>
1242
- <td class="is-vcentered">
1243
- <div class="table__typography-preview">
1244
- n/a
1245
- </div>
1246
-
1247
- </td>
1248
- </tr>
1249
- <tr>
1250
- <td class="with-icons is-vcentered"
1251
- id="no-theme-typographyMessageHeadingM"
1252
- title="theme: no-theme; category: typography; group: message; name: heading; variant: m; ">
1253
- typographyMessageHeadingM
1254
- <a href="#no-theme-typographyMessageHeadingM"
1255
- title="permalink"
1256
- class="permalink">
1257
- 🔗
1258
- </a>
1259
- </td>
1260
- <td class="is-vcentered">
1261
- <pre>700 14px/150% Pridi</pre>
1262
- </td>
1263
- <td class="is-vcentered">
1264
- <div class="table__typography-preview">
1265
- n/a
1266
- </div>
1267
-
1268
- </td>
1269
- </tr>
1270
- <tr>
1271
- <td class="with-icons is-vcentered"
1272
- id="no-theme-typographyMessageHeadingL"
1273
- title="theme: no-theme; category: typography; group: message; name: heading; variant: l; ">
1274
- typographyMessageHeadingL
1275
- <a href="#no-theme-typographyMessageHeadingL"
1276
- title="permalink"
1277
- class="permalink">
1278
- 🔗
1279
- </a>
1280
- </td>
1281
- <td class="is-vcentered">
1282
- <pre>700 16px/150% Pridi</pre>
1283
- </td>
1284
- <td class="is-vcentered">
1285
- <div class="table__typography-preview">
1286
- n/a
1287
- </div>
1288
-
1289
- </td>
1290
- </tr>
1291
- <tr>
1292
- <td class="with-icons is-vcentered"
1293
- id="no-theme-typographyMessageTextM"
1294
- title="theme: no-theme; category: typography; group: message; name: text; variant: m; ">
1295
- typographyMessageTextM
1296
- <a href="#no-theme-typographyMessageTextM"
1297
- title="permalink"
1298
- class="permalink">
1299
- 🔗
1300
- </a>
1301
- </td>
1302
- <td class="is-vcentered">
1303
- <pre>400 14px/150% Pridi</pre>
1304
- </td>
1305
- <td class="is-vcentered">
1306
- <div class="table__typography-preview">
1307
- n/a
1308
- </div>
1309
-
1310
- </td>
1311
- </tr>
1312
- <tr>
1313
- <td class="with-icons is-vcentered"
1314
- id="no-theme-typographyMessageTextL"
1315
- title="theme: no-theme; category: typography; group: message; name: text; variant: l; ">
1316
- typographyMessageTextL
1317
- <a href="#no-theme-typographyMessageTextL"
1318
- title="permalink"
1319
- class="permalink">
1320
- 🔗
1321
- </a>
1322
- </td>
1323
- <td class="is-vcentered">
1324
- <pre>400 16px/150% Pridi</pre>
1325
- </td>
1326
- <td class="is-vcentered">
1327
- <div class="table__typography-preview">
1328
- n/a
1329
- </div>
1330
-
1331
- </td>
1332
- </tr>
1333
- <tr>
1334
- <td class="with-icons is-vcentered"
1335
- id="no-theme-typographyPillLabelS"
1336
- title="theme: no-theme; category: typography; group: pill; name: label; variant: s; ">
1337
- typographyPillLabelS
1338
- <a href="#no-theme-typographyPillLabelS"
1339
- title="permalink"
1340
- class="permalink">
1341
- 🔗
1342
- </a>
1343
- </td>
1344
- <td class="is-vcentered">
1345
- <pre>500 10px/150% Pridi</pre>
1346
- </td>
1347
- <td class="is-vcentered">
1348
- <div class="table__typography-preview">
1349
- n/a
1350
- </div>
1351
-
1352
- </td>
1353
- </tr>
1354
- <tr>
1355
- <td class="with-icons is-vcentered"
1356
- id="no-theme-typographyPillLabelM"
1357
- title="theme: no-theme; category: typography; group: pill; name: label; variant: m; ">
1358
- typographyPillLabelM
1359
- <a href="#no-theme-typographyPillLabelM"
1360
- title="permalink"
1361
- class="permalink">
1362
- 🔗
1363
- </a>
1364
- </td>
1365
- <td class="is-vcentered">
1366
- <pre>500 12px/150% Pridi</pre>
1367
- </td>
1368
- <td class="is-vcentered">
1369
- <div class="table__typography-preview">
1370
- n/a
1371
- </div>
1372
-
1373
- </td>
1374
- </tr>
1375
- <tr>
1376
- <td class="with-icons is-vcentered"
1377
- id="no-theme-typographyPillLabelL"
1378
- title="theme: no-theme; category: typography; group: pill; name: label; variant: l; ">
1379
- typographyPillLabelL
1380
- <a href="#no-theme-typographyPillLabelL"
1381
- title="permalink"
1382
- class="permalink">
1383
- 🔗
1384
- </a>
1385
- </td>
1386
- <td class="is-vcentered">
1387
- <pre>500 14px/150% Pridi</pre>
1388
- </td>
1389
- <td class="is-vcentered">
1390
- <div class="table__typography-preview">
1391
- n/a
1392
- </div>
1393
-
1394
- </td>
1395
- </tr>
1396
- <tr>
1397
- <td class="with-icons is-vcentered"
1398
- id="no-theme-typographyPillLabelXl"
1399
- title="theme: no-theme; category: typography; group: pill; name: label; variant: xl; ">
1400
- typographyPillLabelXl
1401
- <a href="#no-theme-typographyPillLabelXl"
1402
- title="permalink"
1403
- class="permalink">
1404
- 🔗
1405
- </a>
1406
- </td>
1407
- <td class="is-vcentered">
1408
- <pre>500 16px/150% Pridi</pre>
1409
- </td>
1410
- <td class="is-vcentered">
1411
- <div class="table__typography-preview">
1412
- n/a
1413
- </div>
1414
-
1415
- </td>
1416
- </tr>
1417
- <tr>
1418
- <td class="with-icons is-vcentered"
1419
- id="no-theme-typographySwitchOptionLabelM"
1420
- title="theme: no-theme; category: typography; group: switch; name: optionLabel; variant: m; ">
1421
- typographySwitchOptionLabelM
1422
- <a href="#no-theme-typographySwitchOptionLabelM"
1423
- title="permalink"
1424
- class="permalink">
1425
- 🔗
1426
- </a>
1427
- </td>
1428
- <td class="is-vcentered">
1429
- <pre>500 12px/150% Pridi</pre>
1430
- </td>
1431
- <td class="is-vcentered">
1432
- <div class="table__typography-preview">
1433
- n/a
1434
- </div>
1435
-
1436
- </td>
1437
- </tr>
1438
- <tr>
1439
- <td class="with-icons is-vcentered"
1440
- id="no-theme-typographySwitchOptionLabelL"
1441
- title="theme: no-theme; category: typography; group: switch; name: optionLabel; variant: l; ">
1442
- typographySwitchOptionLabelL
1443
- <a href="#no-theme-typographySwitchOptionLabelL"
1444
- title="permalink"
1445
- class="permalink">
1446
- 🔗
1447
- </a>
1448
- </td>
1449
- <td class="is-vcentered">
1450
- <pre>500 14px/150% Pridi</pre>
1451
- </td>
1452
- <td class="is-vcentered">
1453
- <div class="table__typography-preview">
1454
- n/a
1455
- </div>
1456
-
1457
- </td>
1458
- </tr>
1459
- <tr>
1460
- <td class="with-icons is-vcentered"
1461
- id="no-theme-typographyTableHeaderTextM"
1462
- title="theme: no-theme; category: typography; group: table; name: headerText; variant: m; ">
1463
- typographyTableHeaderTextM
1464
- <a href="#no-theme-typographyTableHeaderTextM"
1465
- title="permalink"
1466
- class="permalink">
1467
- 🔗
1468
- </a>
1469
- </td>
1470
- <td class="is-vcentered">
1471
- <pre>500 14px/150% Pridi</pre>
1472
- </td>
1473
- <td class="is-vcentered">
1474
- <div class="table__typography-preview">
1475
- n/a
1476
- </div>
1477
-
1478
- </td>
1479
- </tr>
1480
- <tr>
1481
- <td class="with-icons is-vcentered"
1482
- id="no-theme-typographyTableCellTextM"
1483
- title="theme: no-theme; category: typography; group: table; name: cellText; variant: m; ">
1484
- typographyTableCellTextM
1485
- <a href="#no-theme-typographyTableCellTextM"
1486
- title="permalink"
1487
- class="permalink">
1488
- 🔗
1489
- </a>
1490
- </td>
1491
- <td class="is-vcentered">
1492
- <pre>400 14px/150% Pridi</pre>
1493
- </td>
1494
- <td class="is-vcentered">
1495
- <div class="table__typography-preview">
1496
- n/a
1497
- </div>
1498
-
1499
- </td>
1500
- </tr>
1501
- <tr>
1502
- <td class="with-icons is-vcentered"
1503
- id="no-theme-typographyTooltipTextM"
1504
- title="theme: no-theme; category: typography; group: tooltip; name: text; variant: m; ">
1505
- typographyTooltipTextM
1506
- <a href="#no-theme-typographyTooltipTextM"
1507
- title="permalink"
1508
- class="permalink">
1509
- 🔗
1510
- </a>
1511
- </td>
1512
- <td class="is-vcentered">
1513
- <pre>400 14px/150% Pridi</pre>
1514
- </td>
1515
- <td class="is-vcentered">
1516
- <div class="table__typography-preview">
1517
- n/a
1518
- </div>
1519
-
1520
- </td>
1521
- </tr>
1522
- <tr>
1523
- <td class="with-icons is-vcentered"
1524
- id="no-theme-typographyTooltipTextL"
1525
- title="theme: no-theme; category: typography; group: tooltip; name: text; variant: l; ">
1526
- typographyTooltipTextL
1527
- <a href="#no-theme-typographyTooltipTextL"
1528
- title="permalink"
1529
- class="permalink">
1530
- 🔗
1531
- </a>
1532
- </td>
1533
- <td class="is-vcentered">
1534
- <pre>400 16px/150% Pridi</pre>
1535
- </td>
1536
- <td class="is-vcentered">
1537
- <div class="table__typography-preview">
1538
- n/a
1539
- </div>
1540
-
1541
- </td>
1542
- </tr>
1543
- </table>
1544
- </section>
1545
- </main>
1546
- </div>
1547
-
1548
-
1549
- </div>
1550
-
1551
- <script>
1552
- const searchParams = new URLSearchParams(window.location.search);
1553
- const embedded = !!searchParams.get('embedded');
1554
- if(embedded) {
1555
- document.body.classList.add('embedded')
1556
- }
1557
- </script>
1558
- </body>
1559
- </html>