@telus-uds/theme-allium 3.11.3 → 3.13.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.
package/theme.json CHANGED
@@ -14,14 +14,14 @@
14
14
  "size": "large"
15
15
  },
16
16
  "tokens": {
17
- "size": "{palette.size.size40}",
17
+ "size": "{palette.size.size48}",
18
18
  "thickness": "{palette.border.border4}"
19
19
  }
20
20
  }
21
21
  ],
22
22
  "tokens": {
23
23
  "color": "{palette.color.greenAccessible}",
24
- "size": "{palette.size.size20}",
24
+ "size": "{palette.size.size24}",
25
25
  "thickness": "{palette.border.border2}"
26
26
  }
27
27
  },
@@ -30,20 +30,27 @@
30
30
  "background": {
31
31
  "description": "Background colour of box. Transparent if not specified.",
32
32
  "values": [
33
- "light",
34
33
  "lightest",
34
+ "lighter",
35
+ "light",
35
36
  "dark",
37
+ "darker",
36
38
  "darkest",
37
39
  "critical",
38
40
  "danger",
39
41
  "warning",
40
42
  "positive",
41
43
  "brand",
44
+ "white",
42
45
  "black",
43
- "brandGradient",
46
+ "purpleGradient",
44
47
  "greenGradient",
45
48
  "neutralGradient",
46
- "purpleGradient"
49
+ "brandGradient",
50
+ "featurePrimary",
51
+ "featureSecondary",
52
+ "featureNeutral",
53
+ "featureBrand"
47
54
  ]
48
55
  }
49
56
  },
@@ -58,10 +65,10 @@
58
65
  },
59
66
  {
60
67
  "if": {
61
- "background": "black"
68
+ "background": "lighter"
62
69
  },
63
70
  "tokens": {
64
- "backgroundColor": "{palette.color.black}"
71
+ "backgroundColor": "{palette.color.white}"
65
72
  }
66
73
  },
67
74
  {
@@ -82,12 +89,20 @@
82
89
  },
83
90
  {
84
91
  "if": {
85
- "background": "darkest"
92
+ "background": "darker"
86
93
  },
87
94
  "tokens": {
88
95
  "backgroundColor": "{palette.color.greyThunder}"
89
96
  }
90
97
  },
98
+ {
99
+ "if": {
100
+ "background": "darkest"
101
+ },
102
+ "tokens": {
103
+ "backgroundColor": "{palette.color.black}"
104
+ }
105
+ },
91
106
  {
92
107
  "if": {
93
108
  "background": "critical"
@@ -128,6 +143,22 @@
128
143
  "backgroundColor": "{palette.color.purpleTelus}"
129
144
  }
130
145
  },
146
+ {
147
+ "if": {
148
+ "background": "white"
149
+ },
150
+ "tokens": {
151
+ "backgroundColor": "{palette.color.white}"
152
+ }
153
+ },
154
+ {
155
+ "if": {
156
+ "background": "black"
157
+ },
158
+ "tokens": {
159
+ "backgroundColor": "{palette.color.black}"
160
+ }
161
+ },
131
162
  {
132
163
  "if": {
133
164
  "background": "brandGradient"
@@ -163,6 +194,42 @@
163
194
  "backgroundColor": "{system.color.none}",
164
195
  "gradient": "{palette.gradient.purple}"
165
196
  }
197
+ },
198
+ {
199
+ "if": {
200
+ "background": "featurePrimary"
201
+ },
202
+ "tokens": {
203
+ "backgroundColor": "{system.color.none}",
204
+ "gradient": "{palette.gradient.purple}"
205
+ }
206
+ },
207
+ {
208
+ "if": {
209
+ "background": "featureSecondary"
210
+ },
211
+ "tokens": {
212
+ "backgroundColor": "{system.color.none}",
213
+ "gradient": "{palette.gradient.green}"
214
+ }
215
+ },
216
+ {
217
+ "if": {
218
+ "background": "featureNeutral"
219
+ },
220
+ "tokens": {
221
+ "backgroundColor": "{system.color.none}",
222
+ "gradient": "{palette.gradient.neutral}"
223
+ }
224
+ },
225
+ {
226
+ "if": {
227
+ "background": "featureBrand"
228
+ },
229
+ "tokens": {
230
+ "backgroundColor": "{system.color.none}",
231
+ "gradient": "{palette.gradient.brand}"
232
+ }
166
233
  }
167
234
  ],
168
235
  "tokens": {
@@ -225,15 +292,6 @@
225
292
  "color": "{palette.color.white}"
226
293
  }
227
294
  },
228
- {
229
- "if": {
230
- "hover": true,
231
- "priority": "high"
232
- },
233
- "tokens": {
234
- "backgroundColor": "{palette.color.greenSanFelix}"
235
- }
236
- },
237
295
  {
238
296
  "if": {
239
297
  "pressed": true
@@ -254,21 +312,30 @@
254
312
  },
255
313
  {
256
314
  "if": {
257
- "focus": true,
258
- "pressed": true
315
+ "inverse": true
259
316
  },
260
317
  "tokens": {
261
- "outerBorderColor": "{palette.color.greenDarkFern}"
318
+ "backgroundColor": "{system.color.none}",
319
+ "borderColor": "{palette.color.white}",
320
+ "color": "{palette.color.white}"
262
321
  }
263
322
  },
264
323
  {
265
324
  "if": {
266
- "inverse": true
325
+ "hover": true,
326
+ "priority": "high"
267
327
  },
268
328
  "tokens": {
269
- "backgroundColor": "{system.color.none}",
270
- "borderColor": "{palette.color.white}",
271
- "color": "{palette.color.white}"
329
+ "backgroundColor": "{palette.color.greenSanFelix}"
330
+ }
331
+ },
332
+ {
333
+ "if": {
334
+ "focus": true,
335
+ "pressed": true
336
+ },
337
+ "tokens": {
338
+ "outerBorderColor": "{palette.color.greenDarkFern}"
272
339
  }
273
340
  },
274
341
  {
@@ -449,6 +516,7 @@
449
516
  "text": true
450
517
  },
451
518
  "tokens": {
519
+ "borderColor": "{palette.color.transparent}",
452
520
  "borderRadius": "{palette.radius.none}",
453
521
  "color": "{palette.color.greenAccessible}",
454
522
  "outerBorderColor": "{palette.color.greenAccessible}"
@@ -506,17 +574,6 @@
506
574
  "textLine": "{system.textLine.none}"
507
575
  }
508
576
  },
509
- {
510
- "if": {
511
- "focus": true,
512
- "text": true
513
- },
514
- "tokens": {
515
- "borderColor": "{palette.color.transparent}",
516
- "color": "{palette.color.greenAccessible}",
517
- "outerBorderColor": "{palette.color.greenAccessible}"
518
- }
519
- },
520
577
  {
521
578
  "if": {
522
579
  "focus": true,
@@ -740,6 +797,7 @@
740
797
  "borderRadius": "{palette.radius.pill32}",
741
798
  "borderWidth": "{palette.border.border1}",
742
799
  "color": "{palette.color.greyShuttle}",
800
+ "dividerColor": "{palette.color.greyMystic}",
743
801
  "fontName": "{palette.fontName.HelveticaNow}",
744
802
  "fontSize": "{palette.fontSize.size14}",
745
803
  "fontWeight": "{palette.fontWeight.weight700}",
@@ -766,6 +824,7 @@
766
824
  "paddingRight": "{palette.size.size8}",
767
825
  "paddingTop": "{palette.size.size8}",
768
826
  "shadow": "{system.shadow.none}",
827
+ "subtitleColor": "{palette.color.greyShuttle}",
769
828
  "textAlign": "{system.flexJustifyContent.center}",
770
829
  "width": "{system.size.none}"
771
830
  }
@@ -798,6 +857,7 @@
798
857
  "appearances": {
799
858
  "focus": "{appearances.ButtonGroupItem.focus}",
800
859
  "hover": "{appearances.ButtonGroupItem.hover}",
860
+ "iconPosition": "{appearances.Link.iconPosition}",
801
861
  "inactive": "{appearances.ButtonGroupItem.inactive}",
802
862
  "pressed": "{appearances.ButtonGroupItem.pressed}",
803
863
  "selected": "{appearances.ButtonGroupItem.selected}"
@@ -889,6 +949,14 @@
889
949
  "borderWidth": "{system.border.zero}",
890
950
  "color": "{palette.color.white}"
891
951
  }
952
+ },
953
+ {
954
+ "if": {
955
+ "iconPosition": "right"
956
+ },
957
+ "tokens": {
958
+ "iconSpace": "{system.integer.1}"
959
+ }
892
960
  }
893
961
  ],
894
962
  "tokens": {
@@ -901,9 +969,10 @@
901
969
  "fontName": "{palette.fontName.HelveticaNow}",
902
970
  "fontSize": "{palette.fontSize.size14}",
903
971
  "fontWeight": "{palette.fontWeight.weight700}",
972
+ "height": "{palette.size.size36}",
904
973
  "iconSize": "{palette.size.size20}",
905
974
  "iconSpace": "{system.integer.2}",
906
- "lineHeight": "{palette.lineHeight.ratio3to2}",
975
+ "lineHeight": "{palette.lineHeight.ratio10to7}",
907
976
  "minWidth": "{system.size.zero}",
908
977
  "opacity": "{system.opacity.opaque}",
909
978
  "outerBackgroundColor": "{palette.color.transparent}",
@@ -1155,7 +1224,7 @@
1155
1224
  },
1156
1225
  "tokens": {
1157
1226
  "borderBottomColor": "{palette.color.greyShuttle}",
1158
- "borderBottomWidth": "{palette.border.border2}",
1227
+ "borderBottomWidth": "{palette.border.border4}",
1159
1228
  "color": "{palette.color.greyShuttle}",
1160
1229
  "fontName": "{palette.fontName.HelveticaNow}",
1161
1230
  "fontWeight": "{palette.fontWeight.weight400}"
@@ -1175,8 +1244,9 @@
1175
1244
  "inverse": true
1176
1245
  },
1177
1246
  "tokens": {
1178
- "borderBottomColor": "{palette.color.greenTelus}",
1179
- "color": "{palette.color.greenTelus}"
1247
+ "borderBottomColor": "{palette.color.white}",
1248
+ "borderBottomWidth": "{palette.border.border2}",
1249
+ "color": "{palette.color.white}"
1180
1250
  }
1181
1251
  },
1182
1252
  {
@@ -1186,6 +1256,7 @@
1186
1256
  },
1187
1257
  "tokens": {
1188
1258
  "borderBottomColor": "{palette.color.greyShuttle}",
1259
+ "borderBottomWidth": "{palette.border.border2}",
1189
1260
  "color": "{palette.color.greyShuttle}"
1190
1261
  }
1191
1262
  },
@@ -1195,8 +1266,9 @@
1195
1266
  "inverse": true
1196
1267
  },
1197
1268
  "tokens": {
1198
- "borderBottomColor": "{palette.color.greenTelus}",
1199
- "color": "{palette.color.greenTelus}"
1269
+ "borderBottomColor": "{palette.color.white}",
1270
+ "borderBottomWidth": "{palette.border.border4}",
1271
+ "color": "{palette.color.white}"
1200
1272
  }
1201
1273
  },
1202
1274
  {
@@ -1207,6 +1279,7 @@
1207
1279
  },
1208
1280
  "tokens": {
1209
1281
  "borderBottomColor": "{palette.color.greyShuttle}",
1282
+ "borderBottomWidth": "{palette.border.border4}",
1210
1283
  "color": "{palette.color.greyShuttle}"
1211
1284
  }
1212
1285
  },
@@ -1216,8 +1289,9 @@
1216
1289
  "selected": true
1217
1290
  },
1218
1291
  "tokens": {
1219
- "borderBottomColor": "{palette.color.greenYellow}",
1220
- "color": "{palette.color.greenTelus}"
1292
+ "borderBottomColor": "{palette.color.white}",
1293
+ "borderBottomWidth": "{palette.border.border4}",
1294
+ "color": "{palette.color.white}"
1221
1295
  }
1222
1296
  }
1223
1297
  ],
@@ -1287,6 +1361,18 @@
1287
1361
  "inputOutlineColor": "{palette.color.greyMystic}",
1288
1362
  "inputOutlineWidth": "{palette.border.border2}"
1289
1363
  }
1364
+ },
1365
+ {
1366
+ "if": {
1367
+ "checked": true,
1368
+ "focus": true
1369
+ },
1370
+ "tokens": {
1371
+ "inputBorderColor": "{palette.color.white}",
1372
+ "inputBorderWidth": "{palette.border.border2}",
1373
+ "inputOutlineColor": "{palette.color.purpleDeluge}",
1374
+ "inputOutlineWidth": "{palette.border.border3}"
1375
+ }
1290
1376
  }
1291
1377
  ],
1292
1378
  "tokens": {
@@ -1643,7 +1729,7 @@
1643
1729
  "color": "success"
1644
1730
  },
1645
1731
  "tokens": {
1646
- "color": "{palette.color.greenTelus}"
1732
+ "color": "{palette.color.greenAccessible}"
1647
1733
  }
1648
1734
  },
1649
1735
  {
@@ -2194,6 +2280,7 @@
2194
2280
  "tokens": {
2195
2281
  "iconMarginTop": "{palette.size.size8}",
2196
2282
  "itemFontSize": "{palette.fontSize.size20}",
2283
+ "itemIconSize": "{palette.size.size20}",
2197
2284
  "itemLineHeight": "{palette.lineHeight.ratio8to5}",
2198
2285
  "listGutter": "{palette.size.size12}"
2199
2286
  }
@@ -2205,6 +2292,7 @@
2205
2292
  "tokens": {
2206
2293
  "iconMarginTop": "{palette.size.size2}",
2207
2294
  "itemFontSize": "{palette.fontSize.size14}",
2295
+ "itemIconSize": "{palette.size.size14}",
2208
2296
  "itemLineHeight": "{palette.lineHeight.ratio10to7}",
2209
2297
  "listGutter": "{palette.size.size12}"
2210
2298
  }
@@ -4937,6 +5025,14 @@
4937
5025
  "size": "{palette.size.size96}"
4938
5026
  }
4939
5027
  },
5028
+ {
5029
+ "if": {
5030
+ "space": 12
5031
+ },
5032
+ "tokens": {
5033
+ "size": "{palette.size.size120}"
5034
+ }
5035
+ },
4940
5036
  {
4941
5037
  "if": {
4942
5038
  "space": 10