@bcc-code/design-tokens 3.0.8 → 3.0.9

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.
@@ -569,6 +569,46 @@
569
569
  padding-left: var(--spacing-0);
570
570
  }
571
571
 
572
+ @utility m-0 {
573
+ margin: var(--spacing-0);
574
+ }
575
+
576
+ @utility mx-0 {
577
+ margin-inline: var(--spacing-0);
578
+ }
579
+
580
+ @utility my-0 {
581
+ margin-block: var(--spacing-0);
582
+ }
583
+
584
+ @utility mt-0 {
585
+ margin-top: var(--spacing-0);
586
+ }
587
+
588
+ @utility mr-0 {
589
+ margin-right: var(--spacing-0);
590
+ }
591
+
592
+ @utility mb-0 {
593
+ margin-bottom: var(--spacing-0);
594
+ }
595
+
596
+ @utility ml-0 {
597
+ margin-left: var(--spacing-0);
598
+ }
599
+
600
+ @utility gap-0 {
601
+ gap: var(--spacing-0);
602
+ }
603
+
604
+ @utility gap-x-0 {
605
+ column-gap: var(--spacing-0);
606
+ }
607
+
608
+ @utility gap-y-0 {
609
+ row-gap: var(--spacing-0);
610
+ }
611
+
572
612
  @utility p-25 {
573
613
  padding: var(--spacing-25);
574
614
  }
@@ -597,6 +637,46 @@
597
637
  padding-left: var(--spacing-25);
598
638
  }
599
639
 
640
+ @utility m-25 {
641
+ margin: var(--spacing-25);
642
+ }
643
+
644
+ @utility mx-25 {
645
+ margin-inline: var(--spacing-25);
646
+ }
647
+
648
+ @utility my-25 {
649
+ margin-block: var(--spacing-25);
650
+ }
651
+
652
+ @utility mt-25 {
653
+ margin-top: var(--spacing-25);
654
+ }
655
+
656
+ @utility mr-25 {
657
+ margin-right: var(--spacing-25);
658
+ }
659
+
660
+ @utility mb-25 {
661
+ margin-bottom: var(--spacing-25);
662
+ }
663
+
664
+ @utility ml-25 {
665
+ margin-left: var(--spacing-25);
666
+ }
667
+
668
+ @utility gap-25 {
669
+ gap: var(--spacing-25);
670
+ }
671
+
672
+ @utility gap-x-25 {
673
+ column-gap: var(--spacing-25);
674
+ }
675
+
676
+ @utility gap-y-25 {
677
+ row-gap: var(--spacing-25);
678
+ }
679
+
600
680
  @utility p-50 {
601
681
  padding: var(--spacing-50);
602
682
  }
@@ -625,6 +705,46 @@
625
705
  padding-left: var(--spacing-50);
626
706
  }
627
707
 
708
+ @utility m-50 {
709
+ margin: var(--spacing-50);
710
+ }
711
+
712
+ @utility mx-50 {
713
+ margin-inline: var(--spacing-50);
714
+ }
715
+
716
+ @utility my-50 {
717
+ margin-block: var(--spacing-50);
718
+ }
719
+
720
+ @utility mt-50 {
721
+ margin-top: var(--spacing-50);
722
+ }
723
+
724
+ @utility mr-50 {
725
+ margin-right: var(--spacing-50);
726
+ }
727
+
728
+ @utility mb-50 {
729
+ margin-bottom: var(--spacing-50);
730
+ }
731
+
732
+ @utility ml-50 {
733
+ margin-left: var(--spacing-50);
734
+ }
735
+
736
+ @utility gap-50 {
737
+ gap: var(--spacing-50);
738
+ }
739
+
740
+ @utility gap-x-50 {
741
+ column-gap: var(--spacing-50);
742
+ }
743
+
744
+ @utility gap-y-50 {
745
+ row-gap: var(--spacing-50);
746
+ }
747
+
628
748
  @utility p-75 {
629
749
  padding: var(--spacing-75);
630
750
  }
@@ -653,6 +773,46 @@
653
773
  padding-left: var(--spacing-75);
654
774
  }
655
775
 
776
+ @utility m-75 {
777
+ margin: var(--spacing-75);
778
+ }
779
+
780
+ @utility mx-75 {
781
+ margin-inline: var(--spacing-75);
782
+ }
783
+
784
+ @utility my-75 {
785
+ margin-block: var(--spacing-75);
786
+ }
787
+
788
+ @utility mt-75 {
789
+ margin-top: var(--spacing-75);
790
+ }
791
+
792
+ @utility mr-75 {
793
+ margin-right: var(--spacing-75);
794
+ }
795
+
796
+ @utility mb-75 {
797
+ margin-bottom: var(--spacing-75);
798
+ }
799
+
800
+ @utility ml-75 {
801
+ margin-left: var(--spacing-75);
802
+ }
803
+
804
+ @utility gap-75 {
805
+ gap: var(--spacing-75);
806
+ }
807
+
808
+ @utility gap-x-75 {
809
+ column-gap: var(--spacing-75);
810
+ }
811
+
812
+ @utility gap-y-75 {
813
+ row-gap: var(--spacing-75);
814
+ }
815
+
656
816
  @utility p-100 {
657
817
  padding: var(--spacing-100);
658
818
  }
@@ -681,6 +841,46 @@
681
841
  padding-left: var(--spacing-100);
682
842
  }
683
843
 
844
+ @utility m-100 {
845
+ margin: var(--spacing-100);
846
+ }
847
+
848
+ @utility mx-100 {
849
+ margin-inline: var(--spacing-100);
850
+ }
851
+
852
+ @utility my-100 {
853
+ margin-block: var(--spacing-100);
854
+ }
855
+
856
+ @utility mt-100 {
857
+ margin-top: var(--spacing-100);
858
+ }
859
+
860
+ @utility mr-100 {
861
+ margin-right: var(--spacing-100);
862
+ }
863
+
864
+ @utility mb-100 {
865
+ margin-bottom: var(--spacing-100);
866
+ }
867
+
868
+ @utility ml-100 {
869
+ margin-left: var(--spacing-100);
870
+ }
871
+
872
+ @utility gap-100 {
873
+ gap: var(--spacing-100);
874
+ }
875
+
876
+ @utility gap-x-100 {
877
+ column-gap: var(--spacing-100);
878
+ }
879
+
880
+ @utility gap-y-100 {
881
+ row-gap: var(--spacing-100);
882
+ }
883
+
684
884
  @utility p-150 {
685
885
  padding: var(--spacing-150);
686
886
  }
@@ -709,6 +909,46 @@
709
909
  padding-left: var(--spacing-150);
710
910
  }
711
911
 
912
+ @utility m-150 {
913
+ margin: var(--spacing-150);
914
+ }
915
+
916
+ @utility mx-150 {
917
+ margin-inline: var(--spacing-150);
918
+ }
919
+
920
+ @utility my-150 {
921
+ margin-block: var(--spacing-150);
922
+ }
923
+
924
+ @utility mt-150 {
925
+ margin-top: var(--spacing-150);
926
+ }
927
+
928
+ @utility mr-150 {
929
+ margin-right: var(--spacing-150);
930
+ }
931
+
932
+ @utility mb-150 {
933
+ margin-bottom: var(--spacing-150);
934
+ }
935
+
936
+ @utility ml-150 {
937
+ margin-left: var(--spacing-150);
938
+ }
939
+
940
+ @utility gap-150 {
941
+ gap: var(--spacing-150);
942
+ }
943
+
944
+ @utility gap-x-150 {
945
+ column-gap: var(--spacing-150);
946
+ }
947
+
948
+ @utility gap-y-150 {
949
+ row-gap: var(--spacing-150);
950
+ }
951
+
712
952
  @utility p-200 {
713
953
  padding: var(--spacing-200);
714
954
  }
@@ -737,20 +977,60 @@
737
977
  padding-left: var(--spacing-200);
738
978
  }
739
979
 
740
- @utility p-250 {
741
- padding: var(--spacing-250);
980
+ @utility m-200 {
981
+ margin: var(--spacing-200);
742
982
  }
743
983
 
744
- @utility px-250 {
745
- padding-inline: var(--spacing-250);
984
+ @utility mx-200 {
985
+ margin-inline: var(--spacing-200);
746
986
  }
747
987
 
748
- @utility py-250 {
749
- padding-block: var(--spacing-250);
988
+ @utility my-200 {
989
+ margin-block: var(--spacing-200);
750
990
  }
751
991
 
752
- @utility pt-250 {
753
- padding-top: var(--spacing-250);
992
+ @utility mt-200 {
993
+ margin-top: var(--spacing-200);
994
+ }
995
+
996
+ @utility mr-200 {
997
+ margin-right: var(--spacing-200);
998
+ }
999
+
1000
+ @utility mb-200 {
1001
+ margin-bottom: var(--spacing-200);
1002
+ }
1003
+
1004
+ @utility ml-200 {
1005
+ margin-left: var(--spacing-200);
1006
+ }
1007
+
1008
+ @utility gap-200 {
1009
+ gap: var(--spacing-200);
1010
+ }
1011
+
1012
+ @utility gap-x-200 {
1013
+ column-gap: var(--spacing-200);
1014
+ }
1015
+
1016
+ @utility gap-y-200 {
1017
+ row-gap: var(--spacing-200);
1018
+ }
1019
+
1020
+ @utility p-250 {
1021
+ padding: var(--spacing-250);
1022
+ }
1023
+
1024
+ @utility px-250 {
1025
+ padding-inline: var(--spacing-250);
1026
+ }
1027
+
1028
+ @utility py-250 {
1029
+ padding-block: var(--spacing-250);
1030
+ }
1031
+
1032
+ @utility pt-250 {
1033
+ padding-top: var(--spacing-250);
754
1034
  }
755
1035
 
756
1036
  @utility pr-250 {
@@ -765,6 +1045,46 @@
765
1045
  padding-left: var(--spacing-250);
766
1046
  }
767
1047
 
1048
+ @utility m-250 {
1049
+ margin: var(--spacing-250);
1050
+ }
1051
+
1052
+ @utility mx-250 {
1053
+ margin-inline: var(--spacing-250);
1054
+ }
1055
+
1056
+ @utility my-250 {
1057
+ margin-block: var(--spacing-250);
1058
+ }
1059
+
1060
+ @utility mt-250 {
1061
+ margin-top: var(--spacing-250);
1062
+ }
1063
+
1064
+ @utility mr-250 {
1065
+ margin-right: var(--spacing-250);
1066
+ }
1067
+
1068
+ @utility mb-250 {
1069
+ margin-bottom: var(--spacing-250);
1070
+ }
1071
+
1072
+ @utility ml-250 {
1073
+ margin-left: var(--spacing-250);
1074
+ }
1075
+
1076
+ @utility gap-250 {
1077
+ gap: var(--spacing-250);
1078
+ }
1079
+
1080
+ @utility gap-x-250 {
1081
+ column-gap: var(--spacing-250);
1082
+ }
1083
+
1084
+ @utility gap-y-250 {
1085
+ row-gap: var(--spacing-250);
1086
+ }
1087
+
768
1088
  @utility p-300 {
769
1089
  padding: var(--spacing-300);
770
1090
  }
@@ -793,6 +1113,46 @@
793
1113
  padding-left: var(--spacing-300);
794
1114
  }
795
1115
 
1116
+ @utility m-300 {
1117
+ margin: var(--spacing-300);
1118
+ }
1119
+
1120
+ @utility mx-300 {
1121
+ margin-inline: var(--spacing-300);
1122
+ }
1123
+
1124
+ @utility my-300 {
1125
+ margin-block: var(--spacing-300);
1126
+ }
1127
+
1128
+ @utility mt-300 {
1129
+ margin-top: var(--spacing-300);
1130
+ }
1131
+
1132
+ @utility mr-300 {
1133
+ margin-right: var(--spacing-300);
1134
+ }
1135
+
1136
+ @utility mb-300 {
1137
+ margin-bottom: var(--spacing-300);
1138
+ }
1139
+
1140
+ @utility ml-300 {
1141
+ margin-left: var(--spacing-300);
1142
+ }
1143
+
1144
+ @utility gap-300 {
1145
+ gap: var(--spacing-300);
1146
+ }
1147
+
1148
+ @utility gap-x-300 {
1149
+ column-gap: var(--spacing-300);
1150
+ }
1151
+
1152
+ @utility gap-y-300 {
1153
+ row-gap: var(--spacing-300);
1154
+ }
1155
+
796
1156
  @utility p-400 {
797
1157
  padding: var(--spacing-400);
798
1158
  }
@@ -821,6 +1181,46 @@
821
1181
  padding-left: var(--spacing-400);
822
1182
  }
823
1183
 
1184
+ @utility m-400 {
1185
+ margin: var(--spacing-400);
1186
+ }
1187
+
1188
+ @utility mx-400 {
1189
+ margin-inline: var(--spacing-400);
1190
+ }
1191
+
1192
+ @utility my-400 {
1193
+ margin-block: var(--spacing-400);
1194
+ }
1195
+
1196
+ @utility mt-400 {
1197
+ margin-top: var(--spacing-400);
1198
+ }
1199
+
1200
+ @utility mr-400 {
1201
+ margin-right: var(--spacing-400);
1202
+ }
1203
+
1204
+ @utility mb-400 {
1205
+ margin-bottom: var(--spacing-400);
1206
+ }
1207
+
1208
+ @utility ml-400 {
1209
+ margin-left: var(--spacing-400);
1210
+ }
1211
+
1212
+ @utility gap-400 {
1213
+ gap: var(--spacing-400);
1214
+ }
1215
+
1216
+ @utility gap-x-400 {
1217
+ column-gap: var(--spacing-400);
1218
+ }
1219
+
1220
+ @utility gap-y-400 {
1221
+ row-gap: var(--spacing-400);
1222
+ }
1223
+
824
1224
  @utility p-500 {
825
1225
  padding: var(--spacing-500);
826
1226
  }
@@ -849,6 +1249,46 @@
849
1249
  padding-left: var(--spacing-500);
850
1250
  }
851
1251
 
1252
+ @utility m-500 {
1253
+ margin: var(--spacing-500);
1254
+ }
1255
+
1256
+ @utility mx-500 {
1257
+ margin-inline: var(--spacing-500);
1258
+ }
1259
+
1260
+ @utility my-500 {
1261
+ margin-block: var(--spacing-500);
1262
+ }
1263
+
1264
+ @utility mt-500 {
1265
+ margin-top: var(--spacing-500);
1266
+ }
1267
+
1268
+ @utility mr-500 {
1269
+ margin-right: var(--spacing-500);
1270
+ }
1271
+
1272
+ @utility mb-500 {
1273
+ margin-bottom: var(--spacing-500);
1274
+ }
1275
+
1276
+ @utility ml-500 {
1277
+ margin-left: var(--spacing-500);
1278
+ }
1279
+
1280
+ @utility gap-500 {
1281
+ gap: var(--spacing-500);
1282
+ }
1283
+
1284
+ @utility gap-x-500 {
1285
+ column-gap: var(--spacing-500);
1286
+ }
1287
+
1288
+ @utility gap-y-500 {
1289
+ row-gap: var(--spacing-500);
1290
+ }
1291
+
852
1292
  @utility p-600 {
853
1293
  padding: var(--spacing-600);
854
1294
  }
@@ -877,6 +1317,46 @@
877
1317
  padding-left: var(--spacing-600);
878
1318
  }
879
1319
 
1320
+ @utility m-600 {
1321
+ margin: var(--spacing-600);
1322
+ }
1323
+
1324
+ @utility mx-600 {
1325
+ margin-inline: var(--spacing-600);
1326
+ }
1327
+
1328
+ @utility my-600 {
1329
+ margin-block: var(--spacing-600);
1330
+ }
1331
+
1332
+ @utility mt-600 {
1333
+ margin-top: var(--spacing-600);
1334
+ }
1335
+
1336
+ @utility mr-600 {
1337
+ margin-right: var(--spacing-600);
1338
+ }
1339
+
1340
+ @utility mb-600 {
1341
+ margin-bottom: var(--spacing-600);
1342
+ }
1343
+
1344
+ @utility ml-600 {
1345
+ margin-left: var(--spacing-600);
1346
+ }
1347
+
1348
+ @utility gap-600 {
1349
+ gap: var(--spacing-600);
1350
+ }
1351
+
1352
+ @utility gap-x-600 {
1353
+ column-gap: var(--spacing-600);
1354
+ }
1355
+
1356
+ @utility gap-y-600 {
1357
+ row-gap: var(--spacing-600);
1358
+ }
1359
+
880
1360
  @utility p-800 {
881
1361
  padding: var(--spacing-800);
882
1362
  }
@@ -905,396 +1385,72 @@
905
1385
  padding-left: var(--spacing-800);
906
1386
  }
907
1387
 
908
- @utility p-1000 {
909
- padding: var(--spacing-1000);
1388
+ @utility m-800 {
1389
+ margin: var(--spacing-800);
910
1390
  }
911
1391
 
912
- @utility px-1000 {
913
- padding-inline: var(--spacing-1000);
1392
+ @utility mx-800 {
1393
+ margin-inline: var(--spacing-800);
914
1394
  }
915
1395
 
916
- @utility py-1000 {
917
- padding-block: var(--spacing-1000);
1396
+ @utility my-800 {
1397
+ margin-block: var(--spacing-800);
918
1398
  }
919
1399
 
920
- @utility pt-1000 {
921
- padding-top: var(--spacing-1000);
1400
+ @utility mt-800 {
1401
+ margin-top: var(--spacing-800);
922
1402
  }
923
1403
 
924
- @utility pr-1000 {
925
- padding-right: var(--spacing-1000);
926
- }
927
-
928
- @utility pb-1000 {
929
- padding-bottom: var(--spacing-1000);
930
- }
931
-
932
- @utility pl-1000 {
933
- padding-left: var(--spacing-1000);
934
- }
935
-
936
- @utility m-0 {
937
- margin: var(--spacing-0);
938
- }
939
-
940
- @utility mx-0 {
941
- margin-inline: var(--spacing-0);
942
- }
943
-
944
- @utility my-0 {
945
- margin-block: var(--spacing-0);
946
- }
947
-
948
- @utility mt-0 {
949
- margin-top: var(--spacing-0);
950
- }
951
-
952
- @utility mr-0 {
953
- margin-right: var(--spacing-0);
954
- }
955
-
956
- @utility mb-0 {
957
- margin-bottom: var(--spacing-0);
958
- }
959
-
960
- @utility ml-0 {
961
- margin-left: var(--spacing-0);
962
- }
963
-
964
- @utility m-25 {
965
- margin: var(--spacing-25);
966
- }
967
-
968
- @utility mx-25 {
969
- margin-inline: var(--spacing-25);
970
- }
971
-
972
- @utility my-25 {
973
- margin-block: var(--spacing-25);
974
- }
975
-
976
- @utility mt-25 {
977
- margin-top: var(--spacing-25);
978
- }
979
-
980
- @utility mr-25 {
981
- margin-right: var(--spacing-25);
982
- }
983
-
984
- @utility mb-25 {
985
- margin-bottom: var(--spacing-25);
986
- }
987
-
988
- @utility ml-25 {
989
- margin-left: var(--spacing-25);
990
- }
991
-
992
- @utility m-50 {
993
- margin: var(--spacing-50);
994
- }
995
-
996
- @utility mx-50 {
997
- margin-inline: var(--spacing-50);
998
- }
999
-
1000
- @utility my-50 {
1001
- margin-block: var(--spacing-50);
1002
- }
1003
-
1004
- @utility mt-50 {
1005
- margin-top: var(--spacing-50);
1006
- }
1007
-
1008
- @utility mr-50 {
1009
- margin-right: var(--spacing-50);
1010
- }
1011
-
1012
- @utility mb-50 {
1013
- margin-bottom: var(--spacing-50);
1014
- }
1015
-
1016
- @utility ml-50 {
1017
- margin-left: var(--spacing-50);
1018
- }
1019
-
1020
- @utility m-75 {
1021
- margin: var(--spacing-75);
1022
- }
1023
-
1024
- @utility mx-75 {
1025
- margin-inline: var(--spacing-75);
1026
- }
1027
-
1028
- @utility my-75 {
1029
- margin-block: var(--spacing-75);
1030
- }
1031
-
1032
- @utility mt-75 {
1033
- margin-top: var(--spacing-75);
1034
- }
1035
-
1036
- @utility mr-75 {
1037
- margin-right: var(--spacing-75);
1038
- }
1039
-
1040
- @utility mb-75 {
1041
- margin-bottom: var(--spacing-75);
1042
- }
1043
-
1044
- @utility ml-75 {
1045
- margin-left: var(--spacing-75);
1046
- }
1047
-
1048
- @utility m-100 {
1049
- margin: var(--spacing-100);
1050
- }
1051
-
1052
- @utility mx-100 {
1053
- margin-inline: var(--spacing-100);
1054
- }
1055
-
1056
- @utility my-100 {
1057
- margin-block: var(--spacing-100);
1058
- }
1059
-
1060
- @utility mt-100 {
1061
- margin-top: var(--spacing-100);
1062
- }
1063
-
1064
- @utility mr-100 {
1065
- margin-right: var(--spacing-100);
1066
- }
1067
-
1068
- @utility mb-100 {
1069
- margin-bottom: var(--spacing-100);
1070
- }
1071
-
1072
- @utility ml-100 {
1073
- margin-left: var(--spacing-100);
1074
- }
1075
-
1076
- @utility m-150 {
1077
- margin: var(--spacing-150);
1078
- }
1079
-
1080
- @utility mx-150 {
1081
- margin-inline: var(--spacing-150);
1082
- }
1083
-
1084
- @utility my-150 {
1085
- margin-block: var(--spacing-150);
1086
- }
1087
-
1088
- @utility mt-150 {
1089
- margin-top: var(--spacing-150);
1090
- }
1091
-
1092
- @utility mr-150 {
1093
- margin-right: var(--spacing-150);
1094
- }
1095
-
1096
- @utility mb-150 {
1097
- margin-bottom: var(--spacing-150);
1098
- }
1099
-
1100
- @utility ml-150 {
1101
- margin-left: var(--spacing-150);
1102
- }
1103
-
1104
- @utility m-200 {
1105
- margin: var(--spacing-200);
1106
- }
1107
-
1108
- @utility mx-200 {
1109
- margin-inline: var(--spacing-200);
1110
- }
1111
-
1112
- @utility my-200 {
1113
- margin-block: var(--spacing-200);
1114
- }
1115
-
1116
- @utility mt-200 {
1117
- margin-top: var(--spacing-200);
1118
- }
1119
-
1120
- @utility mr-200 {
1121
- margin-right: var(--spacing-200);
1122
- }
1123
-
1124
- @utility mb-200 {
1125
- margin-bottom: var(--spacing-200);
1126
- }
1127
-
1128
- @utility ml-200 {
1129
- margin-left: var(--spacing-200);
1130
- }
1131
-
1132
- @utility m-250 {
1133
- margin: var(--spacing-250);
1134
- }
1135
-
1136
- @utility mx-250 {
1137
- margin-inline: var(--spacing-250);
1138
- }
1139
-
1140
- @utility my-250 {
1141
- margin-block: var(--spacing-250);
1142
- }
1143
-
1144
- @utility mt-250 {
1145
- margin-top: var(--spacing-250);
1146
- }
1147
-
1148
- @utility mr-250 {
1149
- margin-right: var(--spacing-250);
1150
- }
1151
-
1152
- @utility mb-250 {
1153
- margin-bottom: var(--spacing-250);
1154
- }
1155
-
1156
- @utility ml-250 {
1157
- margin-left: var(--spacing-250);
1158
- }
1159
-
1160
- @utility m-300 {
1161
- margin: var(--spacing-300);
1162
- }
1163
-
1164
- @utility mx-300 {
1165
- margin-inline: var(--spacing-300);
1166
- }
1167
-
1168
- @utility my-300 {
1169
- margin-block: var(--spacing-300);
1170
- }
1171
-
1172
- @utility mt-300 {
1173
- margin-top: var(--spacing-300);
1174
- }
1175
-
1176
- @utility mr-300 {
1177
- margin-right: var(--spacing-300);
1178
- }
1179
-
1180
- @utility mb-300 {
1181
- margin-bottom: var(--spacing-300);
1182
- }
1183
-
1184
- @utility ml-300 {
1185
- margin-left: var(--spacing-300);
1186
- }
1187
-
1188
- @utility m-400 {
1189
- margin: var(--spacing-400);
1190
- }
1191
-
1192
- @utility mx-400 {
1193
- margin-inline: var(--spacing-400);
1194
- }
1195
-
1196
- @utility my-400 {
1197
- margin-block: var(--spacing-400);
1198
- }
1199
-
1200
- @utility mt-400 {
1201
- margin-top: var(--spacing-400);
1202
- }
1203
-
1204
- @utility mr-400 {
1205
- margin-right: var(--spacing-400);
1206
- }
1207
-
1208
- @utility mb-400 {
1209
- margin-bottom: var(--spacing-400);
1210
- }
1211
-
1212
- @utility ml-400 {
1213
- margin-left: var(--spacing-400);
1214
- }
1215
-
1216
- @utility m-500 {
1217
- margin: var(--spacing-500);
1218
- }
1219
-
1220
- @utility mx-500 {
1221
- margin-inline: var(--spacing-500);
1222
- }
1223
-
1224
- @utility my-500 {
1225
- margin-block: var(--spacing-500);
1226
- }
1227
-
1228
- @utility mt-500 {
1229
- margin-top: var(--spacing-500);
1230
- }
1231
-
1232
- @utility mr-500 {
1233
- margin-right: var(--spacing-500);
1234
- }
1235
-
1236
- @utility mb-500 {
1237
- margin-bottom: var(--spacing-500);
1238
- }
1239
-
1240
- @utility ml-500 {
1241
- margin-left: var(--spacing-500);
1242
- }
1243
-
1244
- @utility m-600 {
1245
- margin: var(--spacing-600);
1246
- }
1247
-
1248
- @utility mx-600 {
1249
- margin-inline: var(--spacing-600);
1404
+ @utility mr-800 {
1405
+ margin-right: var(--spacing-800);
1250
1406
  }
1251
1407
 
1252
- @utility my-600 {
1253
- margin-block: var(--spacing-600);
1408
+ @utility mb-800 {
1409
+ margin-bottom: var(--spacing-800);
1254
1410
  }
1255
1411
 
1256
- @utility mt-600 {
1257
- margin-top: var(--spacing-600);
1412
+ @utility ml-800 {
1413
+ margin-left: var(--spacing-800);
1258
1414
  }
1259
1415
 
1260
- @utility mr-600 {
1261
- margin-right: var(--spacing-600);
1416
+ @utility gap-800 {
1417
+ gap: var(--spacing-800);
1262
1418
  }
1263
1419
 
1264
- @utility mb-600 {
1265
- margin-bottom: var(--spacing-600);
1420
+ @utility gap-x-800 {
1421
+ column-gap: var(--spacing-800);
1266
1422
  }
1267
1423
 
1268
- @utility ml-600 {
1269
- margin-left: var(--spacing-600);
1424
+ @utility gap-y-800 {
1425
+ row-gap: var(--spacing-800);
1270
1426
  }
1271
1427
 
1272
- @utility m-800 {
1273
- margin: var(--spacing-800);
1428
+ @utility p-1000 {
1429
+ padding: var(--spacing-1000);
1274
1430
  }
1275
1431
 
1276
- @utility mx-800 {
1277
- margin-inline: var(--spacing-800);
1432
+ @utility px-1000 {
1433
+ padding-inline: var(--spacing-1000);
1278
1434
  }
1279
1435
 
1280
- @utility my-800 {
1281
- margin-block: var(--spacing-800);
1436
+ @utility py-1000 {
1437
+ padding-block: var(--spacing-1000);
1282
1438
  }
1283
1439
 
1284
- @utility mt-800 {
1285
- margin-top: var(--spacing-800);
1440
+ @utility pt-1000 {
1441
+ padding-top: var(--spacing-1000);
1286
1442
  }
1287
1443
 
1288
- @utility mr-800 {
1289
- margin-right: var(--spacing-800);
1444
+ @utility pr-1000 {
1445
+ padding-right: var(--spacing-1000);
1290
1446
  }
1291
1447
 
1292
- @utility mb-800 {
1293
- margin-bottom: var(--spacing-800);
1448
+ @utility pb-1000 {
1449
+ padding-bottom: var(--spacing-1000);
1294
1450
  }
1295
1451
 
1296
- @utility ml-800 {
1297
- margin-left: var(--spacing-800);
1452
+ @utility pl-1000 {
1453
+ padding-left: var(--spacing-1000);
1298
1454
  }
1299
1455
 
1300
1456
  @utility m-1000 {
@@ -1325,162 +1481,6 @@
1325
1481
  margin-left: var(--spacing-1000);
1326
1482
  }
1327
1483
 
1328
- @utility gap-0 {
1329
- gap: var(--spacing-0);
1330
- }
1331
-
1332
- @utility gap-x-0 {
1333
- column-gap: var(--spacing-0);
1334
- }
1335
-
1336
- @utility gap-y-0 {
1337
- row-gap: var(--spacing-0);
1338
- }
1339
-
1340
- @utility gap-25 {
1341
- gap: var(--spacing-25);
1342
- }
1343
-
1344
- @utility gap-x-25 {
1345
- column-gap: var(--spacing-25);
1346
- }
1347
-
1348
- @utility gap-y-25 {
1349
- row-gap: var(--spacing-25);
1350
- }
1351
-
1352
- @utility gap-50 {
1353
- gap: var(--spacing-50);
1354
- }
1355
-
1356
- @utility gap-x-50 {
1357
- column-gap: var(--spacing-50);
1358
- }
1359
-
1360
- @utility gap-y-50 {
1361
- row-gap: var(--spacing-50);
1362
- }
1363
-
1364
- @utility gap-75 {
1365
- gap: var(--spacing-75);
1366
- }
1367
-
1368
- @utility gap-x-75 {
1369
- column-gap: var(--spacing-75);
1370
- }
1371
-
1372
- @utility gap-y-75 {
1373
- row-gap: var(--spacing-75);
1374
- }
1375
-
1376
- @utility gap-100 {
1377
- gap: var(--spacing-100);
1378
- }
1379
-
1380
- @utility gap-x-100 {
1381
- column-gap: var(--spacing-100);
1382
- }
1383
-
1384
- @utility gap-y-100 {
1385
- row-gap: var(--spacing-100);
1386
- }
1387
-
1388
- @utility gap-150 {
1389
- gap: var(--spacing-150);
1390
- }
1391
-
1392
- @utility gap-x-150 {
1393
- column-gap: var(--spacing-150);
1394
- }
1395
-
1396
- @utility gap-y-150 {
1397
- row-gap: var(--spacing-150);
1398
- }
1399
-
1400
- @utility gap-200 {
1401
- gap: var(--spacing-200);
1402
- }
1403
-
1404
- @utility gap-x-200 {
1405
- column-gap: var(--spacing-200);
1406
- }
1407
-
1408
- @utility gap-y-200 {
1409
- row-gap: var(--spacing-200);
1410
- }
1411
-
1412
- @utility gap-250 {
1413
- gap: var(--spacing-250);
1414
- }
1415
-
1416
- @utility gap-x-250 {
1417
- column-gap: var(--spacing-250);
1418
- }
1419
-
1420
- @utility gap-y-250 {
1421
- row-gap: var(--spacing-250);
1422
- }
1423
-
1424
- @utility gap-300 {
1425
- gap: var(--spacing-300);
1426
- }
1427
-
1428
- @utility gap-x-300 {
1429
- column-gap: var(--spacing-300);
1430
- }
1431
-
1432
- @utility gap-y-300 {
1433
- row-gap: var(--spacing-300);
1434
- }
1435
-
1436
- @utility gap-400 {
1437
- gap: var(--spacing-400);
1438
- }
1439
-
1440
- @utility gap-x-400 {
1441
- column-gap: var(--spacing-400);
1442
- }
1443
-
1444
- @utility gap-y-400 {
1445
- row-gap: var(--spacing-400);
1446
- }
1447
-
1448
- @utility gap-500 {
1449
- gap: var(--spacing-500);
1450
- }
1451
-
1452
- @utility gap-x-500 {
1453
- column-gap: var(--spacing-500);
1454
- }
1455
-
1456
- @utility gap-y-500 {
1457
- row-gap: var(--spacing-500);
1458
- }
1459
-
1460
- @utility gap-600 {
1461
- gap: var(--spacing-600);
1462
- }
1463
-
1464
- @utility gap-x-600 {
1465
- column-gap: var(--spacing-600);
1466
- }
1467
-
1468
- @utility gap-y-600 {
1469
- row-gap: var(--spacing-600);
1470
- }
1471
-
1472
- @utility gap-800 {
1473
- gap: var(--spacing-800);
1474
- }
1475
-
1476
- @utility gap-x-800 {
1477
- column-gap: var(--spacing-800);
1478
- }
1479
-
1480
- @utility gap-y-800 {
1481
- row-gap: var(--spacing-800);
1482
- }
1483
-
1484
1484
  @utility gap-1000 {
1485
1485
  gap: var(--spacing-1000);
1486
1486
  }