@sage/design-tokens 4.18.0 → 4.19.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 (31) hide show
  1. package/android/base.xml +7 -6
  2. package/android/dashboard/darkMode.xml +1 -1
  3. package/android/dashboard/lightMode.xml +1 -1
  4. package/android/origin.xml +1 -1
  5. package/css/base.css +7 -6
  6. package/css/dashboard/darkMode.css +1 -1
  7. package/css/dashboard/lightMode.css +1 -1
  8. package/css/origin.css +1 -1
  9. package/data/tokens.json +74 -70
  10. package/docs/tokens/base/index.html +126 -105
  11. package/docs/tokens/base/sizing/index.html +21 -0
  12. package/docs/tokens/base/typography/index.html +105 -105
  13. package/docs/tokens/index.html +126 -105
  14. package/ios/base.h +7 -6
  15. package/ios/dashboard/darkMode.h +1 -1
  16. package/ios/dashboard/lightMode.h +1 -1
  17. package/ios/origin.h +1 -1
  18. package/js/base/common.d.ts +6 -5
  19. package/js/base/common.js +7 -6
  20. package/js/base/es6.d.ts +6 -5
  21. package/js/base/es6.js +6 -5
  22. package/js/dashboard/darkMode/common.js +1 -1
  23. package/js/dashboard/lightMode/common.js +1 -1
  24. package/js/origin/common.js +1 -1
  25. package/package.json +1 -1
  26. package/sage-design-tokens-4.19.0.tgz +0 -0
  27. package/scss/base.scss +7 -6
  28. package/scss/dashboard/darkMode.scss +1 -1
  29. package/scss/dashboard/lightMode.scss +1 -1
  30. package/scss/origin.scss +1 -1
  31. package/sage-design-tokens-4.18.0.tgz +0 -0
package/android/base.xml CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  <!--
4
4
  Do not edit directly
5
- Generated on Mon, 03 Apr 2023 08:10:44 GMT
5
+ Generated on Tue, 06 Jun 2023 08:28:15 GMT
6
6
  -->
7
7
  <resources>
8
8
  <string name="metaName">Base Theme</string>
@@ -242,6 +242,7 @@
242
242
  <string name="sizing450">36px</string>
243
243
  <string name="sizing500">40px</string>
244
244
  <string name="sizing525">42px</string>
245
+ <string name="sizing550">44px</string>
245
246
  <string name="sizing600">48px</string>
246
247
  <string name="sizing700">56px</string>
247
248
  <string name="sizing800">64px</string>
@@ -415,6 +416,11 @@
415
416
  <string name="typographyMessageHeadingL">Bold 16px/150% Sage UI</string>
416
417
  <string name="typographyMessageTextM">Regular 14px/150% Sage UI</string>
417
418
  <string name="typographyMessageTextL">Regular 16px/150% Sage UI</string>
419
+ <string name="typographyNoteEditorNameM">Medium 14px/150% Sage UI</string>
420
+ <string name="typographyNoteDateM">Regular 14px/150% Sage UI</string>
421
+ <string name="typographyNoteParagraphM">Regular 14px/150% Sage UI</string>
422
+ <string name="typographyNoteParagraphListM">Regular 14px/150% Sage UI</string>
423
+ <string name="typographyNoteTitleM">Bold 18px/125% Sage UI</string>
418
424
  <string name="typographyPageStateTitleM">Bold 24px/125% Sage UI</string>
419
425
  <string name="typographyPageStateSubtitleM">Medium 18px/150% Sage UI</string>
420
426
  <string name="typographyPageStateParagraphM">Regular 16px/150% Sage UI</string>
@@ -486,11 +492,6 @@
486
492
  <string name="typographyTileSubscriptionPriceM">Medium 16px/150% Sage UI</string>
487
493
  <string name="typographyTooltipTextM">Regular 14px/150% Sage UI</string>
488
494
  <string name="typographyTooltipTextL">Regular 16px/150% Sage UI</string>
489
- <string name="typographyNoteEditorNameM">Medium 14px/150% Sage UI</string>
490
- <string name="typographyNoteDateM">Regular 14px/150% Sage UI</string>
491
- <string name="typographyNoteParagraphM">Regular 14px/150% Sage UI</string>
492
- <string name="typographyNoteParagraphListM">Regular 14px/150% Sage UI</string>
493
- <string name="typographyNoteTitleM">Bold 18px/125% Sage UI</string>
494
495
  <string name="opacity300">0.3</string>
495
496
  <string name="opacity600">0.6</string>
496
497
  <string name="opacity800">0.8</string>
package/android/dashboard/darkMode.xml CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  <!--
4
4
  Do not edit directly
5
- Generated on Mon, 03 Apr 2023 08:10:44 GMT
5
+ Generated on Tue, 06 Jun 2023 08:28:15 GMT
6
6
  -->
7
7
  <resources>
8
8
  <string name="metaName">Dashboard Dark-Mode Token Set</string>
package/android/dashboard/lightMode.xml CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  <!--
4
4
  Do not edit directly
5
- Generated on Mon, 03 Apr 2023 08:10:44 GMT
5
+ Generated on Tue, 06 Jun 2023 08:28:15 GMT
6
6
  -->
7
7
  <resources>
8
8
  <string name="metaName">Dashboard Light-Mode Token Set</string>
package/android/origin.xml CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  <!--
4
4
  Do not edit directly
5
- Generated on Mon, 03 Apr 2023 08:10:44 GMT
5
+ Generated on Tue, 06 Jun 2023 08:28:15 GMT
6
6
  -->
7
7
  <resources>
8
8
  <string name="metaName">Origin Token Set</string>
package/css/base.css CHANGED
@@ -4,7 +4,7 @@ Copyright © 2021 The Sage Group plc or its licensors. All Rights reserved
4
4
 
5
5
  /**
6
6
  * Do not edit directly
7
- * Generated on Mon, 03 Apr 2023 08:10:44 GMT
7
+ * Generated on Tue, 06 Jun 2023 08:28:15 GMT
8
8
  */
9
9
 
10
10
  :root {
@@ -245,6 +245,7 @@ Copyright © 2021 The Sage Group plc or its licensors. All Rights reserved
245
245
  --sizing450: 36px;
246
246
  --sizing500: 40px;
247
247
  --sizing525: 42px;
248
+ --sizing550: 44px;
248
249
  --sizing600: 48px;
249
250
  --sizing700: 56px;
250
251
  --sizing800: 64px;
@@ -418,6 +419,11 @@ Copyright © 2021 The Sage Group plc or its licensors. All Rights reserved
418
419
  --typographyMessageHeadingL: 700 16px/150% Sage UI;
419
420
  --typographyMessageTextM: 400 14px/150% Sage UI;
420
421
  --typographyMessageTextL: 400 16px/150% Sage UI;
422
+ --typographyNoteEditorNameM: 500 14px/150% Sage UI;
423
+ --typographyNoteDateM: 400 14px/150% Sage UI;
424
+ --typographyNoteParagraphM: 400 14px/150% Sage UI;
425
+ --typographyNoteParagraphListM: 400 14px/150% Sage UI;
426
+ --typographyNoteTitleM: 700 18px/125% Sage UI;
421
427
  --typographyPageStateTitleM: 700 24px/125% Sage UI;
422
428
  --typographyPageStateSubtitleM: 500 18px/150% Sage UI;
423
429
  --typographyPageStateParagraphM: 400 16px/150% Sage UI;
@@ -489,11 +495,6 @@ Copyright © 2021 The Sage Group plc or its licensors. All Rights reserved
489
495
  --typographyTileSubscriptionPriceM: 500 16px/150% Sage UI;
490
496
  --typographyTooltipTextM: 400 14px/150% Sage UI;
491
497
  --typographyTooltipTextL: 400 16px/150% Sage UI;
492
- --typographyNoteEditorNameM: 500 14px/150% Sage UI;
493
- --typographyNoteDateM: 400 14px/150% Sage UI;
494
- --typographyNoteParagraphM: 400 14px/150% Sage UI;
495
- --typographyNoteParagraphListM: 400 14px/150% Sage UI;
496
- --typographyNoteTitleM: 700 18px/125% Sage UI;
497
498
  --opacity300: 0.3;
498
499
  --opacity600: 0.6;
499
500
  --opacity800: 0.8;
package/css/dashboard/darkMode.css CHANGED
@@ -4,7 +4,7 @@ Copyright © 2021 The Sage Group plc or its licensors. All Rights reserved
4
4
 
5
5
  /**
6
6
  * Do not edit directly
7
- * Generated on Mon, 03 Apr 2023 08:10:44 GMT
7
+ * Generated on Tue, 06 Jun 2023 08:28:15 GMT
8
8
  */
9
9
 
10
10
  :root {
package/css/dashboard/lightMode.css CHANGED
@@ -4,7 +4,7 @@ Copyright © 2021 The Sage Group plc or its licensors. All Rights reserved
4
4
 
5
5
  /**
6
6
  * Do not edit directly
7
- * Generated on Mon, 03 Apr 2023 08:10:44 GMT
7
+ * Generated on Tue, 06 Jun 2023 08:28:15 GMT
8
8
  */
9
9
 
10
10
  :root {
package/css/origin.css CHANGED
@@ -4,7 +4,7 @@ Copyright © 2021 The Sage Group plc or its licensors. All Rights reserved
4
4
 
5
5
  /**
6
6
  * Do not edit directly
7
- * Generated on Mon, 03 Apr 2023 08:10:43 GMT
7
+ * Generated on Tue, 06 Jun 2023 08:28:15 GMT
8
8
  */
9
9
 
10
10
  :root {
package/data/tokens.json CHANGED
@@ -1824,6 +1824,10 @@
1824
1824
  "value": "42px",
1825
1825
  "type": "sizing"
1826
1826
  },
1827
+ "550": {
1828
+ "value": "44px",
1829
+ "type": "sizing"
1830
+ },
1827
1831
  "600": {
1828
1832
  "value": "48px",
1829
1833
  "type": "sizing"
@@ -2277,7 +2281,7 @@
2277
2281
  "100": {
2278
2282
  "value": "8px",
2279
2283
  "type": "borderRadius",
2280
- "description": "Action popover (menu), Anchor navigation, Button: minor (including button bar), Card (less rounded), Card select (single), Card select group (outer corners), Carousel (slides), Color picker standard (container), Menu (bottom corners), Message, Navigation: top (menu bottom corners), Navigation: left (selected menu), Pagination, Tab, Table, Tile (less rounded), Toast."
2284
+ "description": "Action popover (menu), Anchor navigation, Card (less rounded), Card select (single), Card select group (outer corners), Carousel (slides), Color picker standard (container), Menu (bottom corners), Message, Navigation: top (menu bottom corners), Navigation: left (selected menu), Pagination, Tab, Table, Tile (less rounded), Toast."
2281
2285
  },
2282
2286
  "200": {
2283
2287
  "value": "16px",
@@ -2292,7 +2296,7 @@
2292
2296
  "circle": {
2293
2297
  "value": "50%",
2294
2298
  "type": "borderRadius",
2295
- "description": "Badge, Portrait, Radio button."
2299
+ "description": "Badge, Loader dots, Portrait, Radio button."
2296
2300
  },
2297
2301
  "000": {
2298
2302
  "value": "0px",
@@ -2307,7 +2311,7 @@
2307
2311
  "025": {
2308
2312
  "value": "2px",
2309
2313
  "type": "borderRadius",
2310
- "description": "Checkbox (small), Link (focus background),Pill"
2314
+ "description": "Checkbox (S, M), Link (focus background),Pill"
2311
2315
  },
2312
2316
  "050": {
2313
2317
  "value": "4px",
@@ -3470,6 +3474,73 @@
3470
3474
  }
3471
3475
  }
3472
3476
  },
3477
+ "note": {
3478
+ "editorName": {
3479
+ "m": {
3480
+ "value": {
3481
+ "fontFamily": "Sage UI",
3482
+ "fontWeight": "Medium",
3483
+ "lineHeight": "150%",
3484
+ "fontSize": "14px",
3485
+ "letterSpacing": "0%",
3486
+ "paragraphSpacing": "0%"
3487
+ },
3488
+ "type": "typography"
3489
+ }
3490
+ },
3491
+ "date": {
3492
+ "m": {
3493
+ "value": {
3494
+ "fontFamily": "Sage UI",
3495
+ "fontWeight": "Regular",
3496
+ "lineHeight": "150%",
3497
+ "fontSize": "14px",
3498
+ "letterSpacing": "0%",
3499
+ "paragraphSpacing": "0px"
3500
+ },
3501
+ "type": "typography"
3502
+ }
3503
+ },
3504
+ "paragraph": {
3505
+ "m": {
3506
+ "value": {
3507
+ "fontFamily": "Sage UI",
3508
+ "fontWeight": "Regular",
3509
+ "lineHeight": "150%",
3510
+ "fontSize": "14px",
3511
+ "letterSpacing": "0%",
3512
+ "paragraphSpacing": "0px"
3513
+ },
3514
+ "type": "typography"
3515
+ }
3516
+ },
3517
+ "paragraphList": {
3518
+ "m": {
3519
+ "value": {
3520
+ "fontFamily": "Sage UI",
3521
+ "fontWeight": "Regular",
3522
+ "lineHeight": "150%",
3523
+ "fontSize": "14px",
3524
+ "letterSpacing": "0%",
3525
+ "paragraphSpacing": "0px"
3526
+ },
3527
+ "type": "typography"
3528
+ }
3529
+ },
3530
+ "title": {
3531
+ "m": {
3532
+ "value": {
3533
+ "fontFamily": "Sage UI",
3534
+ "fontWeight": "Bold",
3535
+ "lineHeight": "125%",
3536
+ "fontSize": "18px",
3537
+ "letterSpacing": "0%",
3538
+ "paragraphSpacing": "0px"
3539
+ },
3540
+ "type": "typography"
3541
+ }
3542
+ }
3543
+ },
3473
3544
  "pageState": {
3474
3545
  "title": {
3475
3546
  "m": {
@@ -4439,73 +4510,6 @@
4439
4510
  "type": "typography"
4440
4511
  }
4441
4512
  }
4442
- },
4443
- "note": {
4444
- "editorName": {
4445
- "m": {
4446
- "value": {
4447
- "fontFamily": "Sage UI",
4448
- "fontWeight": "Medium",
4449
- "lineHeight": "150%",
4450
- "fontSize": "14px",
4451
- "letterSpacing": "0%",
4452
- "paragraphSpacing": "0%"
4453
- },
4454
- "type": "typography"
4455
- }
4456
- },
4457
- "date": {
4458
- "m": {
4459
- "value": {
4460
- "fontFamily": "Sage UI",
4461
- "fontWeight": "Regular",
4462
- "lineHeight": "150%",
4463
- "fontSize": "14px",
4464
- "letterSpacing": "0%",
4465
- "paragraphSpacing": "0px"
4466
- },
4467
- "type": "typography"
4468
- }
4469
- },
4470
- "paragraph": {
4471
- "m": {
4472
- "value": {
4473
- "fontFamily": "Sage UI",
4474
- "fontWeight": "Regular",
4475
- "lineHeight": "150%",
4476
- "fontSize": "14px",
4477
- "letterSpacing": "0%",
4478
- "paragraphSpacing": "0px"
4479
- },
4480
- "type": "typography"
4481
- }
4482
- },
4483
- "paragraphList": {
4484
- "m": {
4485
- "value": {
4486
- "fontFamily": "Sage UI",
4487
- "fontWeight": "Regular",
4488
- "lineHeight": "150%",
4489
- "fontSize": "14px",
4490
- "letterSpacing": "0%",
4491
- "paragraphSpacing": "0px"
4492
- },
4493
- "type": "typography"
4494
- }
4495
- },
4496
- "title": {
4497
- "m": {
4498
- "value": {
4499
- "fontFamily": "Sage UI",
4500
- "fontWeight": "Bold",
4501
- "lineHeight": "125%",
4502
- "fontSize": "18px",
4503
- "letterSpacing": "0%",
4504
- "paragraphSpacing": "0px"
4505
- },
4506
- "type": "typography"
4507
- }
4508
- }
4509
4513
  }
4510
4514
  },
4511
4515
  "opacity": {
package/docs/tokens/base/index.html CHANGED
@@ -5245,6 +5245,27 @@
5245
5245
 
5246
5246
  </td>
5247
5247
  </tr>
5248
+ <tr>
5249
+ <td class="with-icons is-vcentered"
5250
+ id="base-sizing550"
5251
+ title="theme: base; category: sizing; variant: 550; ">
5252
+ sizing550
5253
+ <a href="#base-sizing550"
5254
+ title="permalink"
5255
+ class="permalink">
5256
+ 🔗
5257
+ </a>
5258
+ </td>
5259
+ <td class="is-vcentered">
5260
+ <pre>44px</pre>
5261
+ </td>
5262
+ <td class="is-vcentered">
5263
+ <div class="table__sizing-preview"
5264
+ style="width: 44px; height: 44px">
5265
+ </div>
5266
+
5267
+ </td>
5268
+ </tr>
5248
5269
  <tr>
5249
5270
  <td class="with-icons is-vcentered"
5250
5271
  id="base-sizing600"
@@ -9044,6 +9065,111 @@
9044
9065
 
9045
9066
  </td>
9046
9067
  </tr>
9068
+ <tr>
9069
+ <td class="with-icons is-vcentered"
9070
+ id="base-typographyNoteEditorNameM"
9071
+ title="theme: base; category: typography; group: note; name: editorName; variant: m; ">
9072
+ typographyNoteEditorNameM
9073
+ <a href="#base-typographyNoteEditorNameM"
9074
+ title="permalink"
9075
+ class="permalink">
9076
+ 🔗
9077
+ </a>
9078
+ </td>
9079
+ <td class="is-vcentered">
9080
+ <pre>500 14px/150% Sage UI</pre>
9081
+ </td>
9082
+ <td class="is-vcentered">
9083
+ <div class="table__typography-preview">
9084
+ n/a
9085
+ </div>
9086
+
9087
+ </td>
9088
+ </tr>
9089
+ <tr>
9090
+ <td class="with-icons is-vcentered"
9091
+ id="base-typographyNoteDateM"
9092
+ title="theme: base; category: typography; group: note; name: date; variant: m; ">
9093
+ typographyNoteDateM
9094
+ <a href="#base-typographyNoteDateM"
9095
+ title="permalink"
9096
+ class="permalink">
9097
+ 🔗
9098
+ </a>
9099
+ </td>
9100
+ <td class="is-vcentered">
9101
+ <pre>400 14px/150% Sage UI</pre>
9102
+ </td>
9103
+ <td class="is-vcentered">
9104
+ <div class="table__typography-preview">
9105
+ n/a
9106
+ </div>
9107
+
9108
+ </td>
9109
+ </tr>
9110
+ <tr>
9111
+ <td class="with-icons is-vcentered"
9112
+ id="base-typographyNoteParagraphM"
9113
+ title="theme: base; category: typography; group: note; name: paragraph; variant: m; ">
9114
+ typographyNoteParagraphM
9115
+ <a href="#base-typographyNoteParagraphM"
9116
+ title="permalink"
9117
+ class="permalink">
9118
+ 🔗
9119
+ </a>
9120
+ </td>
9121
+ <td class="is-vcentered">
9122
+ <pre>400 14px/150% Sage UI</pre>
9123
+ </td>
9124
+ <td class="is-vcentered">
9125
+ <div class="table__typography-preview">
9126
+ n/a
9127
+ </div>
9128
+
9129
+ </td>
9130
+ </tr>
9131
+ <tr>
9132
+ <td class="with-icons is-vcentered"
9133
+ id="base-typographyNoteParagraphListM"
9134
+ title="theme: base; category: typography; group: note; name: paragraphList; variant: m; ">
9135
+ typographyNoteParagraphListM
9136
+ <a href="#base-typographyNoteParagraphListM"
9137
+ title="permalink"
9138
+ class="permalink">
9139
+ 🔗
9140
+ </a>
9141
+ </td>
9142
+ <td class="is-vcentered">
9143
+ <pre>400 14px/150% Sage UI</pre>
9144
+ </td>
9145
+ <td class="is-vcentered">
9146
+ <div class="table__typography-preview">
9147
+ n/a
9148
+ </div>
9149
+
9150
+ </td>
9151
+ </tr>
9152
+ <tr>
9153
+ <td class="with-icons is-vcentered"
9154
+ id="base-typographyNoteTitleM"
9155
+ title="theme: base; category: typography; group: note; name: title; variant: m; ">
9156
+ typographyNoteTitleM
9157
+ <a href="#base-typographyNoteTitleM"
9158
+ title="permalink"
9159
+ class="permalink">
9160
+ 🔗
9161
+ </a>
9162
+ </td>
9163
+ <td class="is-vcentered">
9164
+ <pre>700 18px/125% Sage UI</pre>
9165
+ </td>
9166
+ <td class="is-vcentered">
9167
+ <div class="table__typography-preview">
9168
+ n/a
9169
+ </div>
9170
+
9171
+ </td>
9172
+ </tr>
9047
9173
  <tr>
9048
9174
  <td class="with-icons is-vcentered"
9049
9175
  id="base-typographyPageStateTitleM"
@@ -10533,111 +10659,6 @@
10533
10659
  n/a
10534
10660
  </div>
10535
10661
 
10536
- </td>
10537
- </tr>
10538
- <tr>
10539
- <td class="with-icons is-vcentered"
10540
- id="base-typographyNoteEditorNameM"
10541
- title="theme: base; category: typography; group: note; name: editorName; variant: m; ">
10542
- typographyNoteEditorNameM
10543
- <a href="#base-typographyNoteEditorNameM"
10544
- title="permalink"
10545
- class="permalink">
10546
- 🔗
10547
- </a>
10548
- </td>
10549
- <td class="is-vcentered">
10550
- <pre>500 14px/150% Sage UI</pre>
10551
- </td>
10552
- <td class="is-vcentered">
10553
- <div class="table__typography-preview">
10554
- n/a
10555
- </div>
10556
-
10557
- </td>
10558
- </tr>
10559
- <tr>
10560
- <td class="with-icons is-vcentered"
10561
- id="base-typographyNoteDateM"
10562
- title="theme: base; category: typography; group: note; name: date; variant: m; ">
10563
- typographyNoteDateM
10564
- <a href="#base-typographyNoteDateM"
10565
- title="permalink"
10566
- class="permalink">
10567
- 🔗
10568
- </a>
10569
- </td>
10570
- <td class="is-vcentered">
10571
- <pre>400 14px/150% Sage UI</pre>
10572
- </td>
10573
- <td class="is-vcentered">
10574
- <div class="table__typography-preview">
10575
- n/a
10576
- </div>
10577
-
10578
- </td>
10579
- </tr>
10580
- <tr>
10581
- <td class="with-icons is-vcentered"
10582
- id="base-typographyNoteParagraphM"
10583
- title="theme: base; category: typography; group: note; name: paragraph; variant: m; ">
10584
- typographyNoteParagraphM
10585
- <a href="#base-typographyNoteParagraphM"
10586
- title="permalink"
10587
- class="permalink">
10588
- 🔗
10589
- </a>
10590
- </td>
10591
- <td class="is-vcentered">
10592
- <pre>400 14px/150% Sage UI</pre>
10593
- </td>
10594
- <td class="is-vcentered">
10595
- <div class="table__typography-preview">
10596
- n/a
10597
- </div>
10598
-
10599
- </td>
10600
- </tr>
10601
- <tr>
10602
- <td class="with-icons is-vcentered"
10603
- id="base-typographyNoteParagraphListM"
10604
- title="theme: base; category: typography; group: note; name: paragraphList; variant: m; ">
10605
- typographyNoteParagraphListM
10606
- <a href="#base-typographyNoteParagraphListM"
10607
- title="permalink"
10608
- class="permalink">
10609
- 🔗
10610
- </a>
10611
- </td>
10612
- <td class="is-vcentered">
10613
- <pre>400 14px/150% Sage UI</pre>
10614
- </td>
10615
- <td class="is-vcentered">
10616
- <div class="table__typography-preview">
10617
- n/a
10618
- </div>
10619
-
10620
- </td>
10621
- </tr>
10622
- <tr>
10623
- <td class="with-icons is-vcentered"
10624
- id="base-typographyNoteTitleM"
10625
- title="theme: base; category: typography; group: note; name: title; variant: m; ">
10626
- typographyNoteTitleM
10627
- <a href="#base-typographyNoteTitleM"
10628
- title="permalink"
10629
- class="permalink">
10630
- 🔗
10631
- </a>
10632
- </td>
10633
- <td class="is-vcentered">
10634
- <pre>700 18px/125% Sage UI</pre>
10635
- </td>
10636
- <td class="is-vcentered">
10637
- <div class="table__typography-preview">
10638
- n/a
10639
- </div>
10640
-
10641
10662
  </td>
10642
10663
  </tr>
10643
10664
  </table>
package/docs/tokens/base/sizing/index.html CHANGED
@@ -612,6 +612,27 @@
612
612
 
613
613
  </td>
614
614
  </tr>
615
+ <tr>
616
+ <td class="with-icons is-vcentered"
617
+ id="base-sizing550"
618
+ title="theme: base; category: sizing; variant: 550; ">
619
+ sizing550
620
+ <a href="#base-sizing550"
621
+ title="permalink"
622
+ class="permalink">
623
+ 🔗
624
+ </a>
625
+ </td>
626
+ <td class="is-vcentered">
627
+ <pre>44px</pre>
628
+ </td>
629
+ <td class="is-vcentered">
630
+ <div class="table__sizing-preview"
631
+ style="width: 44px; height: 44px">
632
+ </div>
633
+
634
+ </td>
635
+ </tr>
615
636
  <tr>
616
637
  <td class="with-icons is-vcentered"
617
638
  id="base-sizing600"