@swisper.ai/design-system 0.0.2 → 0.0.3

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 (14) hide show
  1. package/README.md +6 -0
  2. package/dist/css/components.css +79 -79
  3. package/dist/css/debug-tokens.json +99 -99
  4. package/dist/css/semantic.css +20 -20
  5. package/dist/tailwind.css +1 -1
  6. package/package.json +1 -1
  7. package/src/colors.stories.tsx +118 -25
  8. package/src/components.stories.tsx +142 -9
  9. package/src/docs/docs-section.tsx +58 -0
  10. package/src/docs/link-card.tsx +1 -1
  11. package/src/docs/token-scale.tsx +21 -0
  12. package/src/foundation.stories.tsx +201 -11
  13. package/src/icons.stories.tsx +267 -0
  14. package/src/introduction.mdx +3 -3
package/dist/css/debug-tokens.json CHANGED
@@ -464,26 +464,26 @@
464
464
  "st-border-radius-lg-xl": "15px",
465
465
  "st-border-width-small": "1px",
466
466
  "st-border-width-medium": "2px",
467
- "st-font-size-4": "10px",
468
- "st-font-size-8": "12px",
469
- "st-font-size-16": "14px",
470
- "st-font-size-24": "16px",
471
- "st-font-size-32": "18px",
472
- "st-font-size-40": "20px",
473
- "st-font-size-48": "24px",
474
- "st-font-size-56": "28px",
475
- "st-font-size-64": "32px",
476
- "st-font-size-xl": "20px",
477
- "st-font-size-lg": "18px",
478
- "st-font-size-2xl": "24px",
479
- "st-font-size-md": "16px",
480
- "st-font-size-3xl": "28px",
481
- "st-font-size-sm": "14px",
482
- "st-font-size-4xl": "32px",
483
- "st-font-size-xs": "12px",
484
- "st-font-size-2xs": "10px",
485
- "st-font-size-5xl": "56px",
486
- "st-font-size-6xl": "72px",
467
+ "st-font-size-4": "0.625rem",
468
+ "st-font-size-8": "0.75rem",
469
+ "st-font-size-16": "0.875rem",
470
+ "st-font-size-24": "1rem",
471
+ "st-font-size-32": "1.125rem",
472
+ "st-font-size-40": "1.25rem",
473
+ "st-font-size-48": "1.5rem",
474
+ "st-font-size-56": "1.75rem",
475
+ "st-font-size-64": "2rem",
476
+ "st-font-size-xl": "1.25rem",
477
+ "st-font-size-lg": "1.125rem",
478
+ "st-font-size-2xl": "1.5rem",
479
+ "st-font-size-md": "1rem",
480
+ "st-font-size-3xl": "1.75rem",
481
+ "st-font-size-sm": "0.875rem",
482
+ "st-font-size-4xl": "2rem",
483
+ "st-font-size-xs": "0.75rem",
484
+ "st-font-size-2xs": "0.625rem",
485
+ "st-font-size-5xl": "3.5rem",
486
+ "st-font-size-6xl": "4.5rem",
487
487
  "st-letter-spacing-small": "2px",
488
488
  "st-font-family-titles": "\"Hanken Grotesk\"",
489
489
  "st-font-family-text": "\"Noto Sans\"",
@@ -571,7 +571,7 @@
571
571
  "ct-button-sm-spacing-spacer-padding": "3px",
572
572
  "ct-button-sm-spacing-spacer-gap": "3px",
573
573
  "ct-button-sm-sizing-height": "32px",
574
- "ct-button-sm-icon-size": "14px",
574
+ "ct-button-sm-icon-size": "0.875rem",
575
575
  "ct-button-sm-icon-sizing": "16px",
576
576
  "ct-button-sm-icon-container-x": "14px",
577
577
  "ct-button-sm-icon-container-y": "16px",
@@ -787,7 +787,7 @@
787
787
  "ct-form-fields-info-icon-forms-radius": "999px",
788
788
  "ct-form-fields-typography-font-weight": "\"Medium\"",
789
789
  "ct-form-fields-typography-font-family": "\"Noto Sans\"",
790
- "ct-form-fields-typography-font-size": "14px",
790
+ "ct-form-fields-typography-font-size": "0.875rem",
791
791
  "ct-form-fields-spacing-gap-helper-text": "4px",
792
792
  "ct-form-fields-spacing-gap-base": "4px",
793
793
  "ct-form-fields-spacing-padding-horizontal": "12px",
@@ -807,7 +807,7 @@
807
807
  "ct-form-radio-button-border-radius-base": "999px",
808
808
  "ct-form-radio-button-typography-font-weight": "\"Medium\"",
809
809
  "ct-form-radio-button-typography-font-family": "\"Noto Sans\"",
810
- "ct-form-radio-button-typography-font-size": "14px",
810
+ "ct-form-radio-button-typography-font-size": "0.875rem",
811
811
  "ct-form-toggle-switch-background-base": "#ffffff",
812
812
  "ct-form-button-group-background-base": "#ffffff",
813
813
  "ct-form-2xs-checkbox-sizing": "0px",
@@ -819,7 +819,7 @@
819
819
  "ct-form-2xs-fields-spacing-gap-icon-text": "0px",
820
820
  "ct-form-2xs-fields-spacing-gap-tools": "0px",
821
821
  "ct-form-2xs-fields-spacing-padding": "0px",
822
- "ct-form-2xs-fields-label-font-size": "0px",
822
+ "ct-form-2xs-fields-label-font-size": "0rem",
823
823
  "ct-form-2xs-radio-button-size": "0px",
824
824
  "ct-form-2xs-radio-button-icon-size": "0px",
825
825
  "ct-form-xs-checkbox-sizing": "0px",
@@ -831,7 +831,7 @@
831
831
  "ct-form-xs-fields-spacing-gap-icon-text": "0px",
832
832
  "ct-form-xs-fields-spacing-gap-tools": "0px",
833
833
  "ct-form-xs-fields-spacing-padding": "0px",
834
- "ct-form-xs-fields-label-font-size": "0px",
834
+ "ct-form-xs-fields-label-font-size": "0rem",
835
835
  "ct-form-xs-radio-button-size": "0px",
836
836
  "ct-form-xs-radio-button-icon-size": "0px",
837
837
  "ct-form-sm-checkbox-sizing": "32px",
@@ -843,7 +843,7 @@
843
843
  "ct-form-sm-fields-spacing-gap-icon-text": "8px",
844
844
  "ct-form-sm-fields-spacing-gap-tools": "0px",
845
845
  "ct-form-sm-fields-spacing-padding": "12px",
846
- "ct-form-sm-fields-label-font-size": "0px",
846
+ "ct-form-sm-fields-label-font-size": "0rem",
847
847
  "ct-form-sm-radio-button-size": "32px",
848
848
  "ct-form-sm-radio-button-icon-size": "20px",
849
849
  "ct-form-md-checkbox-sizing": "36px",
@@ -855,7 +855,7 @@
855
855
  "ct-form-md-fields-spacing-gap-icon-text": "8px",
856
856
  "ct-form-md-fields-spacing-gap-tools": "0px",
857
857
  "ct-form-md-fields-spacing-padding": "12px",
858
- "ct-form-md-fields-label-font-size": "14px",
858
+ "ct-form-md-fields-label-font-size": "0.875rem",
859
859
  "ct-form-md-radio-button-size": "36px",
860
860
  "ct-form-md-radio-button-icon-size": "24px",
861
861
  "ct-form-lg-checkbox-sizing": "40px",
@@ -867,7 +867,7 @@
867
867
  "ct-form-lg-fields-spacing-gap-icon-text": "8px",
868
868
  "ct-form-lg-fields-spacing-gap-tools": "0px",
869
869
  "ct-form-lg-fields-spacing-padding": "12px",
870
- "ct-form-lg-fields-label-font-size": "14px",
870
+ "ct-form-lg-fields-label-font-size": "0.875rem",
871
871
  "ct-form-lg-radio-button-size": "40px",
872
872
  "ct-form-lg-radio-button-icon-size": "28px",
873
873
  "ct-form-2xl-checkbox-sizing": "0px",
@@ -879,7 +879,7 @@
879
879
  "ct-form-2xl-fields-spacing-gap-icon-text": "10px",
880
880
  "ct-form-2xl-fields-spacing-gap-tools": "0px",
881
881
  "ct-form-2xl-fields-spacing-padding": "12px",
882
- "ct-form-2xl-fields-label-font-size": "16px",
882
+ "ct-form-2xl-fields-label-font-size": "1rem",
883
883
  "ct-form-2xl-radio-button-size": "0px",
884
884
  "ct-form-2xl-radio-button-icon-size": "0px",
885
885
  "ct-form-xl-checkbox-sizing": "44px",
@@ -891,7 +891,7 @@
891
891
  "ct-form-xl-fields-spacing-gap-icon-text": "0px",
892
892
  "ct-form-xl-fields-spacing-gap-tools": "0px",
893
893
  "ct-form-xl-fields-spacing-padding": "0px",
894
- "ct-form-xl-fields-label-font-size": "0px",
894
+ "ct-form-xl-fields-label-font-size": "0rem",
895
895
  "ct-form-xl-radio-button-size": "0px",
896
896
  "ct-form-xl-radio-button-icon-size": "0px",
897
897
  "ct-form-3xs-checkbox-sizing": "0px",
@@ -903,7 +903,7 @@
903
903
  "ct-form-3xs-fields-spacing-gap-icon-text": "0px",
904
904
  "ct-form-3xs-fields-spacing-gap-tools": "0px",
905
905
  "ct-form-3xs-fields-spacing-padding": "0px",
906
- "ct-form-3xs-fields-label-font-size": "0px",
906
+ "ct-form-3xs-fields-label-font-size": "0rem",
907
907
  "ct-form-3xs-radio-button-size": "0px",
908
908
  "ct-form-3xs-radio-button-icon-size": "0px",
909
909
  "ct-form-3xl-checkbox-sizing": "0px",
@@ -915,7 +915,7 @@
915
915
  "ct-form-3xl-fields-spacing-gap-icon-text": "0px",
916
916
  "ct-form-3xl-fields-spacing-gap-tools": "0px",
917
917
  "ct-form-3xl-fields-spacing-padding": "0px",
918
- "ct-form-3xl-fields-label-font-size": "0px",
918
+ "ct-form-3xl-fields-label-font-size": "0rem",
919
919
  "ct-form-3xl-radio-button-size": "0px",
920
920
  "ct-form-3xl-radio-button-icon-size": "0px",
921
921
  "ct-form-4xl-checkbox-sizing": "0px",
@@ -927,7 +927,7 @@
927
927
  "ct-form-4xl-fields-spacing-gap-icon-text": "0px",
928
928
  "ct-form-4xl-fields-spacing-gap-tools": "0px",
929
929
  "ct-form-4xl-fields-spacing-padding": "0px",
930
- "ct-form-4xl-fields-label-font-size": "0px",
930
+ "ct-form-4xl-fields-label-font-size": "0rem",
931
931
  "ct-form-4xl-radio-button-size": "0px",
932
932
  "ct-form-4xl-radio-button-icon-size": "0px",
933
933
  "ct-form-mode-checkbox-sizing": "0px",
@@ -938,7 +938,7 @@
938
938
  "ct-form-mode-fields-spacing-gap-helper": "0px",
939
939
  "ct-form-mode-fields-spacing-gap-icon-text": "0px",
940
940
  "ct-form-mode-fields-spacing-padding": "0px",
941
- "ct-form-mode-fields-label-font-size": "0px",
941
+ "ct-form-mode-fields-label-font-size": "0rem",
942
942
  "ct-icon-colour-fill-base": "#bbc3cc",
943
943
  "ct-icon-colour-fill-inverse": "#030304",
944
944
  "ct-icon-2xs-sizing": "14px",
@@ -1146,77 +1146,77 @@
1146
1146
  "ct-chip-2xs-spacing-padding-label": "3px",
1147
1147
  "ct-chip-2xs-spacing-gap": "4px",
1148
1148
  "ct-chip-2xs-sizing-size": "20px",
1149
- "ct-chip-2xs-typography-label-font-size": "10px",
1149
+ "ct-chip-2xs-typography-label-font-size": "0.625rem",
1150
1150
  "ct-chip-2xs-icon-sizing": "12px",
1151
1151
  "ct-chip-2xs-avatar-sizing": "16px",
1152
1152
  "ct-chip-xs-spacing-padding-default": "0px",
1153
1153
  "ct-chip-xs-spacing-padding-label": "0px",
1154
1154
  "ct-chip-xs-spacing-gap": "0px",
1155
1155
  "ct-chip-xs-sizing-size": "0px",
1156
- "ct-chip-xs-typography-label-font-size": "0px",
1156
+ "ct-chip-xs-typography-label-font-size": "0rem",
1157
1157
  "ct-chip-xs-icon-sizing": "0px",
1158
1158
  "ct-chip-xs-avatar-sizing": "0px",
1159
1159
  "ct-chip-sm-spacing-padding-default": "0px",
1160
1160
  "ct-chip-sm-spacing-padding-label": "0px",
1161
1161
  "ct-chip-sm-spacing-gap": "0px",
1162
1162
  "ct-chip-sm-sizing-size": "0px",
1163
- "ct-chip-sm-typography-label-font-size": "0px",
1163
+ "ct-chip-sm-typography-label-font-size": "0rem",
1164
1164
  "ct-chip-sm-icon-sizing": "0px",
1165
1165
  "ct-chip-sm-avatar-sizing": "0px",
1166
1166
  "ct-chip-md-spacing-padding-default": "4px",
1167
1167
  "ct-chip-md-spacing-padding-label": "3px",
1168
1168
  "ct-chip-md-spacing-gap": "4px",
1169
1169
  "ct-chip-md-sizing-size": "26px",
1170
- "ct-chip-md-typography-label-font-size": "10px",
1170
+ "ct-chip-md-typography-label-font-size": "0.625rem",
1171
1171
  "ct-chip-md-icon-sizing": "14px",
1172
1172
  "ct-chip-md-avatar-sizing": "20px",
1173
1173
  "ct-chip-lg-spacing-padding-default": "4px",
1174
1174
  "ct-chip-lg-spacing-padding-label": "4px",
1175
1175
  "ct-chip-lg-spacing-gap": "6px",
1176
1176
  "ct-chip-lg-sizing-size": "32px",
1177
- "ct-chip-lg-typography-label-font-size": "12px",
1177
+ "ct-chip-lg-typography-label-font-size": "0.75rem",
1178
1178
  "ct-chip-lg-icon-sizing": "20px",
1179
1179
  "ct-chip-lg-avatar-sizing": "24px",
1180
1180
  "ct-chip-2xl-spacing-padding-default": "6px",
1181
1181
  "ct-chip-2xl-spacing-padding-label": "4px",
1182
1182
  "ct-chip-2xl-spacing-gap": "8px",
1183
1183
  "ct-chip-2xl-sizing-size": "36px",
1184
- "ct-chip-2xl-typography-label-font-size": "14px",
1184
+ "ct-chip-2xl-typography-label-font-size": "0.875rem",
1185
1185
  "ct-chip-2xl-icon-sizing": "22px",
1186
1186
  "ct-chip-2xl-avatar-sizing": "26px",
1187
1187
  "ct-chip-xl-spacing-padding-default": "0px",
1188
1188
  "ct-chip-xl-spacing-padding-label": "0px",
1189
1189
  "ct-chip-xl-spacing-gap": "0px",
1190
1190
  "ct-chip-xl-sizing-size": "0px",
1191
- "ct-chip-xl-typography-label-font-size": "0px",
1191
+ "ct-chip-xl-typography-label-font-size": "0rem",
1192
1192
  "ct-chip-xl-icon-sizing": "0px",
1193
1193
  "ct-chip-xl-avatar-sizing": "0px",
1194
1194
  "ct-chip-3xs-spacing-padding-default": "2px",
1195
1195
  "ct-chip-3xs-spacing-padding-label": "3px",
1196
1196
  "ct-chip-3xs-spacing-gap": "4px",
1197
1197
  "ct-chip-3xs-sizing-size": "16px",
1198
- "ct-chip-3xs-typography-label-font-size": "10px",
1198
+ "ct-chip-3xs-typography-label-font-size": "0.625rem",
1199
1199
  "ct-chip-3xs-icon-sizing": "12px",
1200
1200
  "ct-chip-3xs-avatar-sizing": "12px",
1201
1201
  "ct-chip-3xl-spacing-padding-default": "0px",
1202
1202
  "ct-chip-3xl-spacing-padding-label": "0px",
1203
1203
  "ct-chip-3xl-spacing-gap": "0px",
1204
1204
  "ct-chip-3xl-sizing-size": "0px",
1205
- "ct-chip-3xl-typography-label-font-size": "0px",
1205
+ "ct-chip-3xl-typography-label-font-size": "0rem",
1206
1206
  "ct-chip-3xl-icon-sizing": "0px",
1207
1207
  "ct-chip-3xl-avatar-sizing": "0px",
1208
1208
  "ct-chip-4xl-spacing-padding-default": "0px",
1209
1209
  "ct-chip-4xl-spacing-padding-label": "0px",
1210
1210
  "ct-chip-4xl-spacing-gap": "0px",
1211
1211
  "ct-chip-4xl-sizing-size": "0px",
1212
- "ct-chip-4xl-typography-label-font-size": "0px",
1212
+ "ct-chip-4xl-typography-label-font-size": "0rem",
1213
1213
  "ct-chip-4xl-icon-sizing": "0px",
1214
1214
  "ct-chip-4xl-avatar-sizing": "0px",
1215
1215
  "ct-chip-mode-spacing-padding-default": "0px",
1216
1216
  "ct-chip-mode-spacing-padding-label": "0px",
1217
1217
  "ct-chip-mode-spacing-gap": "0px",
1218
1218
  "ct-chip-mode-sizing-size": "0px",
1219
- "ct-chip-mode-typography-label-font-size": "0px",
1219
+ "ct-chip-mode-typography-label-font-size": "0rem",
1220
1220
  "ct-chip-mode-icon-sizing": "0px",
1221
1221
  "ct-chip-mode-avatar-sizing": "0px",
1222
1222
  "ct-tabs-colour-text-default": "#e4e8eb",
@@ -1234,34 +1234,34 @@
1234
1234
  "ct-tabs-sizing-height-medium": "36px",
1235
1235
  "ct-tabs-2xs-sizing-height": "0px",
1236
1236
  "ct-tabs-2xs-sizing-close": "0px",
1237
- "ct-tabs-2xs-typography-font-size": "0px",
1237
+ "ct-tabs-2xs-typography-font-size": "0rem",
1238
1238
  "ct-tabs-xs-sizing-height": "0px",
1239
1239
  "ct-tabs-xs-sizing-close": "0px",
1240
- "ct-tabs-xs-typography-font-size": "0px",
1240
+ "ct-tabs-xs-typography-font-size": "0rem",
1241
1241
  "ct-tabs-sm-sizing-height": "0px",
1242
1242
  "ct-tabs-sm-sizing-close": "0px",
1243
- "ct-tabs-sm-typography-font-size": "0px",
1243
+ "ct-tabs-sm-typography-font-size": "0rem",
1244
1244
  "ct-tabs-md-sizing-height": "36px",
1245
1245
  "ct-tabs-md-sizing-close": "18px",
1246
- "ct-tabs-md-typography-font-size": "14px",
1246
+ "ct-tabs-md-typography-font-size": "0.875rem",
1247
1247
  "ct-tabs-lg-sizing-height": "40px",
1248
1248
  "ct-tabs-lg-sizing-close": "20px",
1249
- "ct-tabs-lg-typography-font-size": "14px",
1249
+ "ct-tabs-lg-typography-font-size": "0.875rem",
1250
1250
  "ct-tabs-2xl-sizing-height": "48px",
1251
1251
  "ct-tabs-2xl-sizing-close": "24px",
1252
- "ct-tabs-2xl-typography-font-size": "14px",
1252
+ "ct-tabs-2xl-typography-font-size": "0.875rem",
1253
1253
  "ct-tabs-xl-sizing-height": "0px",
1254
1254
  "ct-tabs-xl-sizing-close": "0px",
1255
- "ct-tabs-xl-typography-font-size": "0px",
1255
+ "ct-tabs-xl-typography-font-size": "0rem",
1256
1256
  "ct-tabs-3xs-sizing-height": "0px",
1257
1257
  "ct-tabs-3xs-sizing-close": "0px",
1258
- "ct-tabs-3xs-typography-font-size": "0px",
1258
+ "ct-tabs-3xs-typography-font-size": "0rem",
1259
1259
  "ct-tabs-3xl-sizing-height": "0px",
1260
1260
  "ct-tabs-3xl-sizing-close": "0px",
1261
- "ct-tabs-3xl-typography-font-size": "0px",
1261
+ "ct-tabs-3xl-typography-font-size": "0rem",
1262
1262
  "ct-tabs-4xl-sizing-height": "0px",
1263
1263
  "ct-tabs-4xl-sizing-close": "0px",
1264
- "ct-tabs-4xl-typography-font-size": "0px",
1264
+ "ct-tabs-4xl-typography-font-size": "0rem",
1265
1265
  "ct-toggle-switch-colour-background-on-default": "rgba(0, 169, 221, 0.5)",
1266
1266
  "ct-toggle-switch-colour-background-on-hovered": "rgba(0, 169, 221, 0.5)",
1267
1267
  "ct-toggle-switch-colour-background-on-pressed": "rgba(0, 169, 221, 0.5)",
@@ -1358,7 +1358,7 @@
1358
1358
  "ct-stepper-border-radius-set": "4px",
1359
1359
  "ct-stepper-spacing-step-wrapper-gap": "8px",
1360
1360
  "ct-stepper-spacing-indicator-padding": "2px",
1361
- "ct-stepper-font-size-label": "14px",
1361
+ "ct-stepper-font-size-label": "0.875rem",
1362
1362
  "ct-sheet-colour-background-default": "#121418",
1363
1363
  "ct-sheet-colour-background-base": "#121418",
1364
1364
  "ct-sheet-colour-text-base": "#e4e8eb",
@@ -1451,48 +1451,48 @@
1451
1451
  "ct-typography-colour-icon-base": "#030304",
1452
1452
  "ct-typography-number": "0px",
1453
1453
  "ct-typography-number": "0px",
1454
- "ct-typography-2xs-label-font-size": "10px",
1455
- "ct-typography-2xs-caption-font-size": "0px",
1456
- "ct-typography-2xs-font-size-label-font-size": "10px",
1457
- "ct-typography-2xs-font-size-caption-font-size": "0px",
1458
- "ct-typography-xs-label-font-size": "10px",
1459
- "ct-typography-xs-caption-font-size": "10px",
1460
- "ct-typography-xs-font-size-label-font-size": "10px",
1461
- "ct-typography-xs-font-size-caption-font-size": "10px",
1462
- "ct-typography-sm-label-font-size": "12px",
1463
- "ct-typography-sm-caption-font-size": "10px",
1464
- "ct-typography-sm-font-size-label-font-size": "12px",
1465
- "ct-typography-sm-font-size-caption-font-size": "10px",
1466
- "ct-typography-md-label-font-size": "14px",
1467
- "ct-typography-md-caption-font-size": "12px",
1468
- "ct-typography-md-font-size-label-font-size": "14px",
1469
- "ct-typography-md-font-size-caption-font-size": "12px",
1470
- "ct-typography-lg-label-font-size": "16px",
1471
- "ct-typography-lg-caption-font-size": "12px",
1472
- "ct-typography-lg-font-size-label-font-size": "16px",
1473
- "ct-typography-lg-font-size-caption-font-size": "12px",
1474
- "ct-typography-2xl-label-font-size": "20px",
1475
- "ct-typography-2xl-caption-font-size": "12px",
1476
- "ct-typography-2xl-font-size-label-font-size": "20px",
1477
- "ct-typography-2xl-font-size-caption-font-size": "18px",
1478
- "ct-typography-xl-label-font-size": "18px",
1479
- "ct-typography-xl-caption-font-size": "0px",
1480
- "ct-typography-xl-font-size-label-font-size": "18px",
1481
- "ct-typography-xl-font-size-caption-font-size": "0px",
1482
- "ct-typography-3xs-label-font-size": "0px",
1483
- "ct-typography-3xs-caption-font-size": "0px",
1484
- "ct-typography-3xs-font-size-label-font-size": "0px",
1485
- "ct-typography-3xs-font-size-caption-font-size": "0px",
1486
- "ct-typography-3xl-label-font-size": "24px",
1487
- "ct-typography-3xl-caption-font-size": "0px",
1488
- "ct-typography-3xl-font-size-label-font-size": "24px",
1489
- "ct-typography-3xl-font-size-caption-font-size": "0px",
1490
- "ct-typography-4xl-label-font-size": "24px",
1491
- "ct-typography-4xl-caption-font-size": "0px",
1492
- "ct-typography-4xl-font-size-label-font-size": "24px",
1493
- "ct-typography-4xl-font-size-caption-font-size": "0px",
1494
- "ct-typography-mode-label-font-size": "24px",
1495
- "ct-typography-mode-caption-font-size": "0px",
1454
+ "ct-typography-2xs-label-font-size": "0.625rem",
1455
+ "ct-typography-2xs-caption-font-size": "0rem",
1456
+ "ct-typography-2xs-font-size-label-font-size": "0.625rem",
1457
+ "ct-typography-2xs-font-size-caption-font-size": "0rem",
1458
+ "ct-typography-xs-label-font-size": "0.625rem",
1459
+ "ct-typography-xs-caption-font-size": "0.625rem",
1460
+ "ct-typography-xs-font-size-label-font-size": "0.625rem",
1461
+ "ct-typography-xs-font-size-caption-font-size": "0.625rem",
1462
+ "ct-typography-sm-label-font-size": "0.75rem",
1463
+ "ct-typography-sm-caption-font-size": "0.625rem",
1464
+ "ct-typography-sm-font-size-label-font-size": "0.75rem",
1465
+ "ct-typography-sm-font-size-caption-font-size": "0.625rem",
1466
+ "ct-typography-md-label-font-size": "0.875rem",
1467
+ "ct-typography-md-caption-font-size": "0.75rem",
1468
+ "ct-typography-md-font-size-label-font-size": "0.875rem",
1469
+ "ct-typography-md-font-size-caption-font-size": "0.75rem",
1470
+ "ct-typography-lg-label-font-size": "1rem",
1471
+ "ct-typography-lg-caption-font-size": "0.75rem",
1472
+ "ct-typography-lg-font-size-label-font-size": "1rem",
1473
+ "ct-typography-lg-font-size-caption-font-size": "0.75rem",
1474
+ "ct-typography-2xl-label-font-size": "1.25rem",
1475
+ "ct-typography-2xl-caption-font-size": "0.75rem",
1476
+ "ct-typography-2xl-font-size-label-font-size": "1.25rem",
1477
+ "ct-typography-2xl-font-size-caption-font-size": "1.125rem",
1478
+ "ct-typography-xl-label-font-size": "1.125rem",
1479
+ "ct-typography-xl-caption-font-size": "0rem",
1480
+ "ct-typography-xl-font-size-label-font-size": "1.125rem",
1481
+ "ct-typography-xl-font-size-caption-font-size": "0rem",
1482
+ "ct-typography-3xs-label-font-size": "0rem",
1483
+ "ct-typography-3xs-caption-font-size": "0rem",
1484
+ "ct-typography-3xs-font-size-label-font-size": "0rem",
1485
+ "ct-typography-3xs-font-size-caption-font-size": "0rem",
1486
+ "ct-typography-3xl-label-font-size": "1.5rem",
1487
+ "ct-typography-3xl-caption-font-size": "0rem",
1488
+ "ct-typography-3xl-font-size-label-font-size": "1.5rem",
1489
+ "ct-typography-3xl-font-size-caption-font-size": "0rem",
1490
+ "ct-typography-4xl-label-font-size": "1.5rem",
1491
+ "ct-typography-4xl-caption-font-size": "0rem",
1492
+ "ct-typography-4xl-font-size-label-font-size": "1.5rem",
1493
+ "ct-typography-4xl-font-size-caption-font-size": "0rem",
1494
+ "ct-typography-mode-label-font-size": "1.5rem",
1495
+ "ct-typography-mode-caption-font-size": "0rem",
1496
1496
  "ct-table-row-colour-background-default": "#ffffff",
1497
1497
  "ct-table-row-colour-background-base": "#ffffff",
1498
1498
  "ct-table-color": "#ffffff",
@@ -1888,7 +1888,7 @@
1888
1888
  "ct-progress-bar-colour-text-default": "#8f99ad",
1889
1889
  "ct-progress-bar-typography-font-weight": "\"Medium\"",
1890
1890
  "ct-progress-bar-typography-font-family": "\"Noto Sans\"",
1891
- "ct-progress-bar-typography-font-size": "14px",
1891
+ "ct-progress-bar-typography-font-size": "0.875rem",
1892
1892
  "ct-progress-bar-border-radius-base": "999px",
1893
1893
  "ct-progress-bar-sizing-height-base": "6px",
1894
1894
  "ct-progress-bar-spacing-padding-vertical": "4px",
package/dist/css/semantic.css CHANGED
@@ -260,26 +260,26 @@
260
260
  --st-border-radius-lg-xl: 15px;
261
261
  --st-border-width-small: 1px;
262
262
  --st-border-width-medium: 2px;
263
- --st-font-size-4: 10px;
264
- --st-font-size-8: 12px;
265
- --st-font-size-16: 14px;
266
- --st-font-size-24: 16px;
267
- --st-font-size-32: 18px;
268
- --st-font-size-40: 20px;
269
- --st-font-size-48: 24px;
270
- --st-font-size-56: 28px;
271
- --st-font-size-64: 32px;
272
- --st-font-size-xl: 20px;
273
- --st-font-size-lg: 18px;
274
- --st-font-size-2xl: 24px;
275
- --st-font-size-md: 16px;
276
- --st-font-size-3xl: 28px;
277
- --st-font-size-sm: 14px;
278
- --st-font-size-4xl: 32px;
279
- --st-font-size-xs: 12px;
280
- --st-font-size-2xs: 10px;
281
- --st-font-size-5xl: 56px;
282
- --st-font-size-6xl: 72px;
263
+ --st-font-size-4: 0.625rem;
264
+ --st-font-size-8: 0.75rem;
265
+ --st-font-size-16: 0.875rem;
266
+ --st-font-size-24: 1rem;
267
+ --st-font-size-32: 1.125rem;
268
+ --st-font-size-40: 1.25rem;
269
+ --st-font-size-48: 1.5rem;
270
+ --st-font-size-56: 1.75rem;
271
+ --st-font-size-64: 2rem;
272
+ --st-font-size-xl: 1.25rem;
273
+ --st-font-size-lg: 1.125rem;
274
+ --st-font-size-2xl: 1.5rem;
275
+ --st-font-size-md: 1rem;
276
+ --st-font-size-3xl: 1.75rem;
277
+ --st-font-size-sm: 0.875rem;
278
+ --st-font-size-4xl: 2rem;
279
+ --st-font-size-xs: 0.75rem;
280
+ --st-font-size-2xs: 0.625rem;
281
+ --st-font-size-5xl: 3.5rem;
282
+ --st-font-size-6xl: 4.5rem;
283
283
  --st-letter-spacing-small: 2px;
284
284
  --st-font-family-titles: "Hanken Grotesk";
285
285
  --st-font-family-text: "Noto Sans";