@trafilea/afrodita-components 7.1.1 → 7.1.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.
@@ -67,6 +67,12 @@ var DEFAULT_BREAKPOINTS = {
67
67
  mobile: 640,
68
68
  tablet: 1024,
69
69
  desktop: 1280,
70
+ xs: '480px',
71
+ sm: '640px',
72
+ md: '768px',
73
+ lg: '1024px',
74
+ xl: '1280px',
75
+ '2xl': '1536px',
70
76
  };
71
77
 
72
78
  var shapermint = {
@@ -860,10 +866,38 @@ var shapermint = {
860
866
  heavy: 900,
861
867
  bold: 700,
862
868
  demi: 600,
869
+ medium: 500,
863
870
  regular: 400,
864
871
  },
865
872
  },
873
+ size: {
874
+ xxs: '10px',
875
+ xs: '12px',
876
+ sm: '14px',
877
+ md: '16px',
878
+ lg: '18px',
879
+ xl: '20px',
880
+ '2xl': '24px',
881
+ '3xl': '30px',
882
+ '4xl': '36px',
883
+ '5xl': '42px',
884
+ '6xl': '52px',
885
+ '7xl': '60px',
886
+ },
887
+ lineHeight: {
888
+ xs: '16px',
889
+ sm: '20px',
890
+ md: '22px',
891
+ lg: '24px',
892
+ xl: '28px',
893
+ '2xl': '32px',
894
+ '3xl': '40px',
895
+ '4xl': '48px',
896
+ '5xl': '68px',
897
+ '6xl': '76px',
898
+ },
866
899
  variants: {
900
+ // to be removed after new foundation is implemented starting here
867
901
  hero1: {
868
902
  fontSize: 76,
869
903
  lineHeight: '92px',
@@ -991,6 +1025,230 @@ var shapermint = {
991
1025
  fontSize: 8,
992
1026
  lineHeight: '12px',
993
1027
  },
1028
+ // to be removed after new foundation is implemented ending here
1029
+ // new foundation
1030
+ // display1new: {
1031
+ // desktop: {
1032
+ // fontSize: '--typography-size-7xl-desktop',
1033
+ // lineHeight: '--typography-line-height-6xl-desktop',
1034
+ // },
1035
+ // mobile: {
1036
+ // fontSize: '--typography-size-7xl-mobile',
1037
+ // lineHeight: '--typography-line-height-6xl-mobile',
1038
+ // },
1039
+ // tablet: {
1040
+ // fontSize: '--typography-size-7xl-tablet',
1041
+ // lineHeight: '--typography-line-height-6xl-tablet',
1042
+ // },
1043
+ // },
1044
+ // display2new: {
1045
+ // desktop: {
1046
+ // fontSize: '--typography-size-6xl-desktop',
1047
+ // lineHeight: '--typography-line-height-5xl-desktop',
1048
+ // },
1049
+ // mobile: {
1050
+ // fontSize: '--typography-size-6xl-mobile',
1051
+ // lineHeight: '--typography-line-height-5xl-mobile',
1052
+ // },
1053
+ // tablet: {
1054
+ // fontSize: '--typography-size-6xl-tablet',
1055
+ // lineHeight: '--typography-line-height-5xl-tablet',
1056
+ // },
1057
+ // },
1058
+ // h1: {
1059
+ // desktop: {
1060
+ // fontSize: '--typography-size-5xl-desktop',
1061
+ // lineHeight: '--typography-line-height-4xl-desktop',
1062
+ // },
1063
+ // mobile: {
1064
+ // fontSize: '--typography-size-5xl-mobile',
1065
+ // lineHeight: '--typography-line-height-4xl-mobile',
1066
+ // },
1067
+ // tablet: {
1068
+ // fontSize: '--typography-size-5xl-tablet',
1069
+ // lineHeight: '--typography-line-height-4xl-tablet',
1070
+ // },
1071
+ // },
1072
+ // h2: {
1073
+ // desktop: {
1074
+ // fontSize: '--typography-size-4xl-desktop',
1075
+ // lineHeight: '--typography-line-height-3xl-desktop',
1076
+ // },
1077
+ // mobile: {
1078
+ // fontSize: '--typography-size-4xl-mobile',
1079
+ // lineHeight: '--typography-line-height-3xl-mobile',
1080
+ // },
1081
+ // tablet: {
1082
+ // fontSize: '--typography-size-4xl-tablet',
1083
+ // lineHeight: '--typography-line-height-3xl-tablet',
1084
+ // },
1085
+ // },
1086
+ // h3: {
1087
+ // desktop: {
1088
+ // fontSize: '--typography-size-3xl-desktop',
1089
+ // lineHeight: '--typography-line-height-3xl-desktop',
1090
+ // },
1091
+ // mobile: {
1092
+ // fontSize: '--typography-size-3xl-mobile',
1093
+ // lineHeight: '--typography-line-height-3xl-mobile',
1094
+ // },
1095
+ // tablet: {
1096
+ // fontSize: '--typography-size-3xl-tablet',
1097
+ // lineHeight: '--typography-line-height-3xl-tablet',
1098
+ // },
1099
+ // },
1100
+ // h4: {
1101
+ // desktop: {
1102
+ // fontSize: '--typography-size-2xl-desktop',
1103
+ // lineHeight: '--typography-line-height-2xl-desktop',
1104
+ // },
1105
+ // mobile: {
1106
+ // fontSize: '--typography-size-2xl-mobile',
1107
+ // lineHeight: '--typography-line-height-2xl-mobile',
1108
+ // },
1109
+ // tablet: {
1110
+ // fontSize: '--typography-size-2xl-tablet',
1111
+ // lineHeight: '--typography-line-height-2xl-tablet',
1112
+ // },
1113
+ // },
1114
+ // h5: {
1115
+ // desktop: {
1116
+ // fontSize: '--typography-size-xl-desktop',
1117
+ // lineHeight: '--typography-line-height-xl-desktop',
1118
+ // },
1119
+ // mobile: {
1120
+ // fontSize: '--typography-size-xl-mobile',
1121
+ // lineHeight: '--typography-line-height-xl-mobile',
1122
+ // },
1123
+ // tablet: {
1124
+ // fontSize: '--typography-size-xl-tablet',
1125
+ // lineHeight: '--typography-line-height-xl-tablet',
1126
+ // },
1127
+ // },
1128
+ // h6: {
1129
+ // desktop: {
1130
+ // fontSize: '--typography-size-lg-desktop',
1131
+ // lineHeight: '--typography-line-height-lg-desktop',
1132
+ // },
1133
+ // mobile: {
1134
+ // fontSize: '--typography-size-lg-mobile',
1135
+ // lineHeight: '--typography-line-height-lg-mobile',
1136
+ // },
1137
+ // tablet: {
1138
+ // fontSize: '--typography-size-lg-tablet',
1139
+ // lineHeight: '--typography-line-height-lg-tablet',
1140
+ // },
1141
+ // },
1142
+ // 'body-lg': {
1143
+ // desktop: {
1144
+ // fontSize: '--typography-size-lg-desktop',
1145
+ // lineHeight: '--typography-line-height-xl-desktop',
1146
+ // },
1147
+ // mobile: {
1148
+ // fontSize: '--typography-size-lg-mobile',
1149
+ // lineHeight: '--typography-line-height-xl-mobile',
1150
+ // },
1151
+ // tablet: {
1152
+ // fontSize: '--typography-size-lg-tablet',
1153
+ // lineHeight: '--typography-line-height-xl-tablet',
1154
+ // },
1155
+ // },
1156
+ // 'body-md': {
1157
+ // desktop: {
1158
+ // fontSize: '--typography-size-md-desktop',
1159
+ // lineHeight: '--typography-line-height-lg-desktop',
1160
+ // },
1161
+ // mobile: {
1162
+ // fontSize: '--typography-size-md-mobile',
1163
+ // lineHeight: '--typography-line-height-lg-mobile',
1164
+ // },
1165
+ // tablet: {
1166
+ // fontSize: '--typography-size-md-tablet',
1167
+ // lineHeight: '--typography-line-height-lg-tablet',
1168
+ // },
1169
+ // },
1170
+ // 'body-sm': {
1171
+ // desktop: {
1172
+ // fontSize: '--typography-size-sm-desktop',
1173
+ // lineHeight: '--typography-line-height-md-desktop',
1174
+ // },
1175
+ // mobile: {
1176
+ // fontSize: '--typography-size-sm-mobile',
1177
+ // lineHeight: '--typography-line-height-md-mobile',
1178
+ // },
1179
+ // tablet: {
1180
+ // fontSize: '--typography-size-sm-tablet',
1181
+ // lineHeight: '--typography-line-height-md-tablet',
1182
+ // },
1183
+ // },
1184
+ // 'button-md': {
1185
+ // desktop: {
1186
+ // fontSize: '--typography-size-md-desktop',
1187
+ // lineHeight: '--typography-line-height-md-desktop',
1188
+ // },
1189
+ // mobile: {
1190
+ // fontSize: '--typography-size-md-mobile',
1191
+ // lineHeight: '--typography-line-height-md-mobile',
1192
+ // },
1193
+ // tablet: {
1194
+ // fontSize: '--typography-size-md-tablet',
1195
+ // lineHeight: '--typography-line-height-md-tablet',
1196
+ // },
1197
+ // },
1198
+ // 'button-sm': {
1199
+ // desktop: {
1200
+ // fontSize: '--typography-size-sm-desktop',
1201
+ // lineHeight: '--typography-line-height-sm-desktop',
1202
+ // },
1203
+ // mobile: {
1204
+ // fontSize: '--typography-size-sm-mobile',
1205
+ // lineHeight: '--typography-line-height-sm-mobile',
1206
+ // },
1207
+ // tablet: {
1208
+ // fontSize: '--typography-size-sm-tablet',
1209
+ // lineHeight: '--typography-line-height-sm-tablet',
1210
+ // },
1211
+ // },
1212
+ // 'caption-xxs': {
1213
+ // // to be replaced with caption after new foundation is implemented
1214
+ // desktop: {
1215
+ // fontSize: '--typography-size-xs-desktop',
1216
+ // },
1217
+ // mobile: {
1218
+ // fontSize: '--typography-size-xs-mobile',
1219
+ // },
1220
+ // tablet: {
1221
+ // fontSize: '--typography-size-xs-tablet',
1222
+ // },
1223
+ // },
1224
+ // 'label-md': {
1225
+ // desktop: {
1226
+ // fontSize: '--typography-size-sm-desktop',
1227
+ // lineHeight: '--typography-line-height-sm-desktop',
1228
+ // },
1229
+ // mobile: {
1230
+ // fontSize: '--typography-size-sm-mobile',
1231
+ // lineHeight: '--typography-line-height-sm-mobile',
1232
+ // },
1233
+ // tablet: {
1234
+ // fontSize: '--typography-size-sm-tablet',
1235
+ // lineHeight: '--typography-line-height-sm-tablet',
1236
+ // },
1237
+ // },
1238
+ // 'label-sm': {
1239
+ // desktop: {
1240
+ // fontSize: '--typography-size-xs-desktop',
1241
+ // lineHeight: '--typography-line-height-xs-desktop',
1242
+ // },
1243
+ // mobile: {
1244
+ // fontSize: '--typography-size-xs-mobile',
1245
+ // lineHeight: '--typography-line-height-xs-mobile',
1246
+ // },
1247
+ // tablet: {
1248
+ // fontSize: '--typography-size-xs-tablet',
1249
+ // lineHeight: '--typography-line-height-xs-tablet',
1250
+ // },
1251
+ // },
994
1252
  },
995
1253
  },
996
1254
  fonts: {
@@ -20,9 +20,7 @@ declare type Theme = {
20
20
  fontWeights: number[];
21
21
  lineHeights: number[];
22
22
  mediaQueries: ThemeBreakpoints;
23
- radius: {
24
- regular: string;
25
- };
23
+ radius: ThemeRadius;
26
24
  zIndex: {
27
25
  modal: number;
28
26
  overlay: number;
@@ -35,11 +33,19 @@ declare type Theme = {
35
33
  label: {
36
34
  member: string;
37
35
  };
36
+ space?: ThemeSpacing;
37
+ shadow?: ThemeElevation;
38
38
  };
39
39
  declare type ThemeBreakpoints = {
40
40
  mobile: number;
41
41
  tablet: number;
42
42
  desktop: number;
43
+ xs: string;
44
+ sm: string;
45
+ md: string;
46
+ lg: string;
47
+ xl: string;
48
+ '2xl': string;
43
49
  };
44
50
  declare type ThemeBasicPallete = {
45
51
  color: string;
@@ -869,15 +875,32 @@ declare type ThemeComponent = {
869
875
  };
870
876
  };
871
877
  };
878
+ declare type SizeConfig = {
879
+ xxs?: string;
880
+ xs: string;
881
+ sm: string;
882
+ md: string;
883
+ lg: string;
884
+ xl: string;
885
+ '2xl': string;
886
+ '3xl': string;
887
+ '4xl': string;
888
+ '5xl': string;
889
+ '6xl': string;
890
+ '7xl'?: string;
891
+ };
872
892
  declare type ThemeTypography = {
873
893
  config: {
874
894
  weight: {
875
895
  heavy: number;
876
896
  bold: number;
877
897
  demi: number;
898
+ medium?: number;
878
899
  regular: number;
879
900
  };
880
901
  };
902
+ size?: SizeConfig;
903
+ lineHeight?: Omit<SizeConfig, 'xxs' | '7xl'>;
881
904
  variants: Record<string, CSSProperties>;
882
905
  };
883
906
  declare type ThemeFonts = {
@@ -954,6 +977,41 @@ declare type ThemeAssets = {
954
977
  };
955
978
  };
956
979
  [key: string]: any;
980
+ };
981
+ declare type ThemeSpacing = {
982
+ 0?: string;
983
+ 25?: string;
984
+ 50: string;
985
+ 75: string;
986
+ 100: string;
987
+ 150: string;
988
+ 200: string;
989
+ 250: string;
990
+ 300: string;
991
+ 400: string;
992
+ 500: string;
993
+ 600: string;
994
+ 800?: string;
995
+ 1000?: string;
996
+ 1200?: string;
997
+ 1600?: string;
998
+ 2000?: string;
999
+ };
1000
+ declare type ThemeRadius = {
1001
+ regular: string;
1002
+ none?: string;
1003
+ md?: string;
1004
+ lg?: string;
1005
+ xl?: string;
1006
+ full?: string;
1007
+ };
1008
+ declare type ThemeElevation = {
1009
+ 100: string;
1010
+ 200: string;
1011
+ 300: string;
1012
+ 400: string;
1013
+ 500: string;
1014
+ 600: string;
957
1015
  };
958
1016
 
959
1017
  declare const thebodcon: Theme;
@@ -67,6 +67,12 @@ var DEFAULT_BREAKPOINTS = {
67
67
  mobile: 640,
68
68
  tablet: 1024,
69
69
  desktop: 1280,
70
+ xs: '480px',
71
+ sm: '640px',
72
+ md: '768px',
73
+ lg: '1024px',
74
+ xl: '1280px',
75
+ '2xl': '1536px',
70
76
  };
71
77
 
72
78
  var thebodcon = {
@@ -20,9 +20,7 @@ declare type Theme = {
20
20
  fontWeights: number[];
21
21
  lineHeights: number[];
22
22
  mediaQueries: ThemeBreakpoints;
23
- radius: {
24
- regular: string;
25
- };
23
+ radius: ThemeRadius;
26
24
  zIndex: {
27
25
  modal: number;
28
26
  overlay: number;
@@ -35,11 +33,19 @@ declare type Theme = {
35
33
  label: {
36
34
  member: string;
37
35
  };
36
+ space?: ThemeSpacing;
37
+ shadow?: ThemeElevation;
38
38
  };
39
39
  declare type ThemeBreakpoints = {
40
40
  mobile: number;
41
41
  tablet: number;
42
42
  desktop: number;
43
+ xs: string;
44
+ sm: string;
45
+ md: string;
46
+ lg: string;
47
+ xl: string;
48
+ '2xl': string;
43
49
  };
44
50
  declare type ThemeBasicPallete = {
45
51
  color: string;
@@ -869,15 +875,32 @@ declare type ThemeComponent = {
869
875
  };
870
876
  };
871
877
  };
878
+ declare type SizeConfig = {
879
+ xxs?: string;
880
+ xs: string;
881
+ sm: string;
882
+ md: string;
883
+ lg: string;
884
+ xl: string;
885
+ '2xl': string;
886
+ '3xl': string;
887
+ '4xl': string;
888
+ '5xl': string;
889
+ '6xl': string;
890
+ '7xl'?: string;
891
+ };
872
892
  declare type ThemeTypography = {
873
893
  config: {
874
894
  weight: {
875
895
  heavy: number;
876
896
  bold: number;
877
897
  demi: number;
898
+ medium?: number;
878
899
  regular: number;
879
900
  };
880
901
  };
902
+ size?: SizeConfig;
903
+ lineHeight?: Omit<SizeConfig, 'xxs' | '7xl'>;
881
904
  variants: Record<string, CSSProperties>;
882
905
  };
883
906
  declare type ThemeFonts = {
@@ -954,6 +977,41 @@ declare type ThemeAssets = {
954
977
  };
955
978
  };
956
979
  [key: string]: any;
980
+ };
981
+ declare type ThemeSpacing = {
982
+ 0?: string;
983
+ 25?: string;
984
+ 50: string;
985
+ 75: string;
986
+ 100: string;
987
+ 150: string;
988
+ 200: string;
989
+ 250: string;
990
+ 300: string;
991
+ 400: string;
992
+ 500: string;
993
+ 600: string;
994
+ 800?: string;
995
+ 1000?: string;
996
+ 1200?: string;
997
+ 1600?: string;
998
+ 2000?: string;
999
+ };
1000
+ declare type ThemeRadius = {
1001
+ regular: string;
1002
+ none?: string;
1003
+ md?: string;
1004
+ lg?: string;
1005
+ xl?: string;
1006
+ full?: string;
1007
+ };
1008
+ declare type ThemeElevation = {
1009
+ 100: string;
1010
+ 200: string;
1011
+ 300: string;
1012
+ 400: string;
1013
+ 500: string;
1014
+ 600: string;
957
1015
  };
958
1016
 
959
1017
  declare const thespadr: Theme;
@@ -36,6 +36,12 @@ var DEFAULT_BREAKPOINTS = {
36
36
  mobile: 640,
37
37
  tablet: 1024,
38
38
  desktop: 1280,
39
+ xs: '480px',
40
+ sm: '640px',
41
+ md: '768px',
42
+ lg: '1024px',
43
+ xl: '1280px',
44
+ '2xl': '1536px',
39
45
  };
40
46
 
41
47
  var thespadr = {
@@ -46,6 +52,11 @@ var thespadr = {
46
52
  mediaQueries: DEFAULT_BREAKPOINTS,
47
53
  radius: {
48
54
  regular: '8px',
55
+ none: '0px',
56
+ md: '4px',
57
+ lg: '8px',
58
+ xl: '16px',
59
+ full: '9999px',
49
60
  },
50
61
  zIndex: {
51
62
  modal: 50,
@@ -1033,10 +1044,38 @@ var thespadr = {
1033
1044
  heavy: 800,
1034
1045
  bold: 700,
1035
1046
  demi: 500,
1047
+ medium: 500,
1036
1048
  regular: 400,
1037
1049
  },
1038
1050
  },
1051
+ size: {
1052
+ xxs: '10px',
1053
+ xs: '12px',
1054
+ sm: '14px',
1055
+ md: '16px',
1056
+ lg: '18px',
1057
+ xl: '20px',
1058
+ '2xl': '24px',
1059
+ '3xl': '30px',
1060
+ '4xl': '36px',
1061
+ '5xl': '42px',
1062
+ '6xl': '52px',
1063
+ '7xl': '60px',
1064
+ },
1065
+ lineHeight: {
1066
+ xs: '16px',
1067
+ sm: '20px',
1068
+ md: '22px',
1069
+ lg: '24px',
1070
+ xl: '28px',
1071
+ '2xl': '32px',
1072
+ '3xl': '40px',
1073
+ '4xl': '48px',
1074
+ '5xl': '68px',
1075
+ '6xl': '76px',
1076
+ },
1039
1077
  variants: {
1078
+ // to be removed after new foundation is implemented starting from here
1040
1079
  hero1: {
1041
1080
  fontSize: 76,
1042
1081
  lineHeight: '92px',
@@ -1156,6 +1195,83 @@ var thespadr = {
1156
1195
  fontSize: 12,
1157
1196
  lineHeight: '14px',
1158
1197
  },
1198
+ // to be removed after new foundation is implemented ending here
1199
+ display: {
1200
+ fontSize: '--typography-size-6xl',
1201
+ lineHeight: '--typography-line-height-5xl',
1202
+ },
1203
+ 'heading-xl': {
1204
+ fontSize: '--typography-size-3xl',
1205
+ lineHeight: '--typography-line-height-3xl',
1206
+ },
1207
+ 'heading-lg': {
1208
+ fontSize: '--typography-size-2xl',
1209
+ lineHeight: '--typography-line-height-2xl',
1210
+ },
1211
+ 'subtitle-md': {
1212
+ fontSize: '--typography-size-xl',
1213
+ lineHeight: '--typography-line-height-xl',
1214
+ },
1215
+ 'subtitle-sm': {
1216
+ fontSize: '--typography-size-lg',
1217
+ lineHeight: '--typography-line-height-lg',
1218
+ },
1219
+ 'body-md': {
1220
+ fontSize: '--typography-size-md',
1221
+ lineHeight: '--typography-line-height-lg',
1222
+ },
1223
+ 'body-sm': {
1224
+ fontSize: '--typography-size-sm',
1225
+ lineHeight: '--typography-line-height-md',
1226
+ },
1227
+ 'price-lg': {
1228
+ fontSize: '--typography-size-lg',
1229
+ lineHeight: '--typography-line-height-xl',
1230
+ },
1231
+ 'price-md': {
1232
+ fontSize: '--typography-size-md',
1233
+ lineHeight: '--typography-line-height-lg',
1234
+ },
1235
+ 'button-lg': {
1236
+ fontSize: '--typography-size-lg',
1237
+ lineHeight: '--typography-line-height-lg',
1238
+ },
1239
+ 'button-md': {
1240
+ fontSize: '--typography-size-md',
1241
+ lineHeight: '--typography-line-height-md',
1242
+ },
1243
+ 'button-sm': {
1244
+ fontSize: '--typography-size-sm',
1245
+ lineHeight: '--typography-line-height-sm',
1246
+ },
1247
+ 'caption-xxs': {
1248
+ // to be replaced with caption after new foundation is implemented
1249
+ fontSize: '--typography-size-xxs',
1250
+ },
1251
+ 'label-md': {
1252
+ fontSize: '--typography-size-md',
1253
+ lineHeight: '--typography-line-height-lg',
1254
+ },
1255
+ 'label-sm': {
1256
+ fontSize: '--typography-size-sm',
1257
+ lineHeight: '--typography-line-height-sm',
1258
+ },
1259
+ 'label-xs': {
1260
+ fontSize: '--typography-size-xs',
1261
+ lineHeight: '--typography-line-height-xs',
1262
+ },
1263
+ 'link-md': {
1264
+ fontSize: '--typography-size-md',
1265
+ lineHeight: '--typography-line-height-lg',
1266
+ },
1267
+ 'link-sm': {
1268
+ fontSize: '--typography-size-sm',
1269
+ lineHeight: '--typography-line-height-md',
1270
+ },
1271
+ 'link-xs': {
1272
+ fontSize: '--typography-size-xs',
1273
+ lineHeight: '--typography-line-height-sm',
1274
+ },
1159
1275
  },
1160
1276
  },
1161
1277
  fonts: {
@@ -1335,6 +1451,33 @@ var thespadr = {
1335
1451
  label: {
1336
1452
  member: '',
1337
1453
  },
1454
+ space: {
1455
+ 0: '0px',
1456
+ 25: '2px',
1457
+ 50: '4px',
1458
+ 75: '6px',
1459
+ 100: '8px',
1460
+ 150: '12px',
1461
+ 200: '16px',
1462
+ 250: '20px',
1463
+ 300: '24px',
1464
+ 400: '32px',
1465
+ 500: '40px',
1466
+ 600: '48px',
1467
+ 800: '64px',
1468
+ 1000: '80px',
1469
+ 1200: '96px',
1470
+ 1600: '128px',
1471
+ 2000: '160px',
1472
+ },
1473
+ shadow: {
1474
+ 100: '0px 1px 4px 0px rgba(12, 12, 13, 0.05);',
1475
+ 200: '0px 4px 6px -2px rgba(12, 12, 13, 0.10), 0px 2px 4px -2px rgba(12, 12, 13, 0.05)',
1476
+ 300: '0px 12px 16px -4px rgba(12, 12, 13, 0.08), 0px 4px 4px -2px rgba(12, 12, 13, 0.05)',
1477
+ 400: '0px 16px 32px -4px rgba(12, 12, 13, 0.10), 0px 4px 4px -4px rgba(12, 12, 13, 0.05)',
1478
+ 500: '0px 16px 32px -8px rgba(12, 12, 13, 0.40)',
1479
+ 600: '0px 0px 0px 4px rgba(69, 122, 65, 0.30)',
1480
+ },
1338
1481
  };
1339
1482
 
1340
1483
  exports["default"] = thespadr;