@telus-uds/theme-koodo 3.8.0 → 3.10.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/build/android/schema.json +385 -370
- package/build/android/theme.json +379 -37
- package/build/ios/schema.json +385 -370
- package/build/ios/theme.json +379 -37
- package/build/rn/schema.json +385 -370
- package/build/rn/theme.js +128 -26
- package/package.json +4 -4
- package/theme.json +259 -22
package/theme.json
CHANGED
|
@@ -1,10 +1,26 @@
|
|
|
1
1
|
{
|
|
2
2
|
"components": {
|
|
3
3
|
"ActivityIndicator": {
|
|
4
|
-
"appearances": {
|
|
5
|
-
|
|
4
|
+
"appearances": {
|
|
5
|
+
"size": {
|
|
6
|
+
"description": "used for full-screen spinners",
|
|
7
|
+
"type": "variant",
|
|
8
|
+
"values": ["large"]
|
|
9
|
+
}
|
|
10
|
+
},
|
|
11
|
+
"rules": [
|
|
12
|
+
{
|
|
13
|
+
"if": {
|
|
14
|
+
"size": "large"
|
|
15
|
+
},
|
|
16
|
+
"tokens": {
|
|
17
|
+
"size": "{palette.size.size48}",
|
|
18
|
+
"thickness": "{palette.border.border4}"
|
|
19
|
+
}
|
|
20
|
+
}
|
|
21
|
+
],
|
|
6
22
|
"tokens": {
|
|
7
|
-
"color": "{palette.color.
|
|
23
|
+
"color": "{palette.color.mosque}",
|
|
8
24
|
"size": "{palette.size.size40}",
|
|
9
25
|
"thickness": "{palette.border.border4}"
|
|
10
26
|
}
|
|
@@ -12,8 +28,26 @@
|
|
|
12
28
|
"Box": {
|
|
13
29
|
"appearances": {
|
|
14
30
|
"background": {
|
|
15
|
-
"description": "Background colour of box.
|
|
16
|
-
"values": [
|
|
31
|
+
"description": "Background colour of box. White if not specified.",
|
|
32
|
+
"values": [
|
|
33
|
+
"lightest",
|
|
34
|
+
"lighter",
|
|
35
|
+
"light",
|
|
36
|
+
"dark",
|
|
37
|
+
"darker",
|
|
38
|
+
"darkest",
|
|
39
|
+
"critical",
|
|
40
|
+
"danger",
|
|
41
|
+
"warning",
|
|
42
|
+
"positive",
|
|
43
|
+
"brand",
|
|
44
|
+
"white",
|
|
45
|
+
"black",
|
|
46
|
+
"featurePrimary",
|
|
47
|
+
"featureSecondary",
|
|
48
|
+
"featureNeutral",
|
|
49
|
+
"featureBrand"
|
|
50
|
+
]
|
|
17
51
|
}
|
|
18
52
|
},
|
|
19
53
|
"rules": [
|
|
@@ -25,6 +59,14 @@
|
|
|
25
59
|
"backgroundColor": "{palette.color.white}"
|
|
26
60
|
}
|
|
27
61
|
},
|
|
62
|
+
{
|
|
63
|
+
"if": {
|
|
64
|
+
"background": "lighter"
|
|
65
|
+
},
|
|
66
|
+
"tokens": {
|
|
67
|
+
"backgroundColor": "{palette.color.greyLight}"
|
|
68
|
+
}
|
|
69
|
+
},
|
|
28
70
|
{
|
|
29
71
|
"if": {
|
|
30
72
|
"background": "light"
|
|
@@ -33,6 +75,78 @@
|
|
|
33
75
|
"backgroundColor": "{palette.color.gallery}"
|
|
34
76
|
}
|
|
35
77
|
},
|
|
78
|
+
{
|
|
79
|
+
"if": {
|
|
80
|
+
"background": "dark"
|
|
81
|
+
},
|
|
82
|
+
"tokens": {
|
|
83
|
+
"backgroundColor": "{palette.color.dove}"
|
|
84
|
+
}
|
|
85
|
+
},
|
|
86
|
+
{
|
|
87
|
+
"if": {
|
|
88
|
+
"background": "darker"
|
|
89
|
+
},
|
|
90
|
+
"tokens": {
|
|
91
|
+
"backgroundColor": "{palette.color.mortar}"
|
|
92
|
+
}
|
|
93
|
+
},
|
|
94
|
+
{
|
|
95
|
+
"if": {
|
|
96
|
+
"background": "darkest"
|
|
97
|
+
},
|
|
98
|
+
"tokens": {
|
|
99
|
+
"backgroundColor": "{palette.color.black}"
|
|
100
|
+
}
|
|
101
|
+
},
|
|
102
|
+
{
|
|
103
|
+
"if": {
|
|
104
|
+
"background": "critical"
|
|
105
|
+
},
|
|
106
|
+
"tokens": {
|
|
107
|
+
"backgroundColor": "{palette.color.wellRead}"
|
|
108
|
+
}
|
|
109
|
+
},
|
|
110
|
+
{
|
|
111
|
+
"if": {
|
|
112
|
+
"background": "danger"
|
|
113
|
+
},
|
|
114
|
+
"tokens": {
|
|
115
|
+
"backgroundColor": "{palette.color.piggyPink}"
|
|
116
|
+
}
|
|
117
|
+
},
|
|
118
|
+
{
|
|
119
|
+
"if": {
|
|
120
|
+
"background": "warning"
|
|
121
|
+
},
|
|
122
|
+
"tokens": {
|
|
123
|
+
"backgroundColor": "{palette.color.beeswax}"
|
|
124
|
+
}
|
|
125
|
+
},
|
|
126
|
+
{
|
|
127
|
+
"if": {
|
|
128
|
+
"background": "positive"
|
|
129
|
+
},
|
|
130
|
+
"tokens": {
|
|
131
|
+
"backgroundColor": "{palette.color.icicle}"
|
|
132
|
+
}
|
|
133
|
+
},
|
|
134
|
+
{
|
|
135
|
+
"if": {
|
|
136
|
+
"background": "brand"
|
|
137
|
+
},
|
|
138
|
+
"tokens": {
|
|
139
|
+
"backgroundColor": "{palette.color.mosque}"
|
|
140
|
+
}
|
|
141
|
+
},
|
|
142
|
+
{
|
|
143
|
+
"if": {
|
|
144
|
+
"background": "white"
|
|
145
|
+
},
|
|
146
|
+
"tokens": {
|
|
147
|
+
"backgroundColor": "{palette.color.white}"
|
|
148
|
+
}
|
|
149
|
+
},
|
|
36
150
|
{
|
|
37
151
|
"if": {
|
|
38
152
|
"background": "black"
|
|
@@ -40,10 +154,42 @@
|
|
|
40
154
|
"tokens": {
|
|
41
155
|
"backgroundColor": "{palette.color.black}"
|
|
42
156
|
}
|
|
157
|
+
},
|
|
158
|
+
{
|
|
159
|
+
"if": {
|
|
160
|
+
"background": "featurePrimary"
|
|
161
|
+
},
|
|
162
|
+
"tokens": {
|
|
163
|
+
"backgroundColor": "{palette.color.flirt}"
|
|
164
|
+
}
|
|
165
|
+
},
|
|
166
|
+
{
|
|
167
|
+
"if": {
|
|
168
|
+
"background": "featureSecondary"
|
|
169
|
+
},
|
|
170
|
+
"tokens": {
|
|
171
|
+
"backgroundColor": "{palette.color.chathamsBlue}"
|
|
172
|
+
}
|
|
173
|
+
},
|
|
174
|
+
{
|
|
175
|
+
"if": {
|
|
176
|
+
"background": "featureNeutral"
|
|
177
|
+
},
|
|
178
|
+
"tokens": {
|
|
179
|
+
"backgroundColor": "{palette.color.mortar}"
|
|
180
|
+
}
|
|
181
|
+
},
|
|
182
|
+
{
|
|
183
|
+
"if": {
|
|
184
|
+
"background": "featureBrand"
|
|
185
|
+
},
|
|
186
|
+
"tokens": {
|
|
187
|
+
"backgroundColor": "{palette.color.mosque}"
|
|
188
|
+
}
|
|
43
189
|
}
|
|
44
190
|
],
|
|
45
191
|
"tokens": {
|
|
46
|
-
"backgroundColor": "{
|
|
192
|
+
"backgroundColor": "{palette.color.white}",
|
|
47
193
|
"gradient": "{system.gradient.none}"
|
|
48
194
|
}
|
|
49
195
|
},
|
|
@@ -733,8 +879,47 @@
|
|
|
733
879
|
}
|
|
734
880
|
},
|
|
735
881
|
"Divider": {
|
|
736
|
-
"appearances": {
|
|
737
|
-
|
|
882
|
+
"appearances": {
|
|
883
|
+
"decorative": {
|
|
884
|
+
"description": "Use a decorative divider to highlight an element. Non-decorative dividers are for clearly identifying separation of content.",
|
|
885
|
+
"type": "variant",
|
|
886
|
+
"values": [true]
|
|
887
|
+
},
|
|
888
|
+
"inverse": {
|
|
889
|
+
"type": "variant",
|
|
890
|
+
"values": [true]
|
|
891
|
+
},
|
|
892
|
+
"weight": {
|
|
893
|
+
"type": "variant",
|
|
894
|
+
"values": ["thick"]
|
|
895
|
+
}
|
|
896
|
+
},
|
|
897
|
+
"rules": [
|
|
898
|
+
{
|
|
899
|
+
"if": {
|
|
900
|
+
"weight": "thick"
|
|
901
|
+
},
|
|
902
|
+
"tokens": {
|
|
903
|
+
"width": "{palette.size.size2}"
|
|
904
|
+
}
|
|
905
|
+
},
|
|
906
|
+
{
|
|
907
|
+
"if": {
|
|
908
|
+
"decorative": true
|
|
909
|
+
},
|
|
910
|
+
"tokens": {
|
|
911
|
+
"color": "{palette.color.gallery}"
|
|
912
|
+
}
|
|
913
|
+
},
|
|
914
|
+
{
|
|
915
|
+
"if": {
|
|
916
|
+
"inverse": true
|
|
917
|
+
},
|
|
918
|
+
"tokens": {
|
|
919
|
+
"color": "{palette.color.white}"
|
|
920
|
+
}
|
|
921
|
+
}
|
|
922
|
+
],
|
|
738
923
|
"tokens": {
|
|
739
924
|
"color": "{palette.color.silver}",
|
|
740
925
|
"width": "{palette.size.size1}"
|
|
@@ -1038,11 +1223,11 @@
|
|
|
1038
1223
|
"color": "{palette.color.black}",
|
|
1039
1224
|
"fontName": "{palette.fontName.StagSans}",
|
|
1040
1225
|
"fontSize": "{palette.fontSize.size16}",
|
|
1041
|
-
"fontWeight": "{palette.fontWeight.
|
|
1226
|
+
"fontWeight": "{palette.fontWeight.weight600}",
|
|
1042
1227
|
"gap": "{palette.size.size8}",
|
|
1043
1228
|
"hintColor": "{palette.color.black}",
|
|
1044
1229
|
"hintFontName": "{palette.fontName.StagSans}",
|
|
1045
|
-
"hintFontSize": "{palette.fontSize.
|
|
1230
|
+
"hintFontSize": "{palette.fontSize.size16}",
|
|
1046
1231
|
"hintFontWeight": "{palette.fontWeight.weight400}",
|
|
1047
1232
|
"hintLineHeight": "{palette.lineHeight.multiply140}",
|
|
1048
1233
|
"lineHeight": "{palette.lineHeight.multiply140}"
|
|
@@ -1285,9 +1470,10 @@
|
|
|
1285
1470
|
"style": "success"
|
|
1286
1471
|
},
|
|
1287
1472
|
"tokens": {
|
|
1288
|
-
"backgroundColor": "{palette.color.
|
|
1473
|
+
"backgroundColor": "{palette.color.icicle}",
|
|
1474
|
+
"color": "{palette.color.black}",
|
|
1289
1475
|
"icon": "{palette.icon.CheckCircledFilled}",
|
|
1290
|
-
"iconColor": "{palette.color.
|
|
1476
|
+
"iconColor": "{palette.color.mosque}"
|
|
1291
1477
|
}
|
|
1292
1478
|
},
|
|
1293
1479
|
{
|
|
@@ -1296,8 +1482,9 @@
|
|
|
1296
1482
|
},
|
|
1297
1483
|
"tokens": {
|
|
1298
1484
|
"backgroundColor": "{palette.color.beeswax}",
|
|
1485
|
+
"color": "{palette.color.black}",
|
|
1299
1486
|
"icon": "{palette.icon.ExclamationTriangle}",
|
|
1300
|
-
"iconColor": "{palette.color.
|
|
1487
|
+
"iconColor": "{palette.color.amaranth}"
|
|
1301
1488
|
}
|
|
1302
1489
|
},
|
|
1303
1490
|
{
|
|
@@ -1305,21 +1492,22 @@
|
|
|
1305
1492
|
"style": "error"
|
|
1306
1493
|
},
|
|
1307
1494
|
"tokens": {
|
|
1308
|
-
"backgroundColor": "{palette.color.
|
|
1495
|
+
"backgroundColor": "{palette.color.piggyPink}",
|
|
1496
|
+
"color": "{palette.color.black}",
|
|
1309
1497
|
"icon": "{palette.icon.ExclamationOctagon}",
|
|
1310
1498
|
"iconColor": "{palette.color.trinidad}"
|
|
1311
1499
|
}
|
|
1312
1500
|
}
|
|
1313
1501
|
],
|
|
1314
1502
|
"tokens": {
|
|
1315
|
-
"backgroundColor": "{palette.color.
|
|
1503
|
+
"backgroundColor": "{palette.color.carouselPink}",
|
|
1316
1504
|
"borderBottomWidth": "{system.border.zero}",
|
|
1317
1505
|
"borderColor": "{system.color.transparent}",
|
|
1318
1506
|
"borderLeftWidth": "{system.border.zero}",
|
|
1319
1507
|
"borderRadius": "{system.radius.zero}",
|
|
1320
1508
|
"borderRightWidth": "{system.border.zero}",
|
|
1321
1509
|
"borderTopWidth": "{system.border.zero}",
|
|
1322
|
-
"color": "{palette.color.
|
|
1510
|
+
"color": "{palette.color.flirt}",
|
|
1323
1511
|
"dismissButtonGap": "{palette.size.size16}",
|
|
1324
1512
|
"dismissIcon": "{palette.icon.Times}",
|
|
1325
1513
|
"dismissIconColor": "{palette.color.black}",
|
|
@@ -2985,8 +3173,23 @@
|
|
|
2985
3173
|
}
|
|
2986
3174
|
},
|
|
2987
3175
|
"Tooltip": {
|
|
2988
|
-
"appearances": {
|
|
2989
|
-
|
|
3176
|
+
"appearances": {
|
|
3177
|
+
"inverse": {
|
|
3178
|
+
"type": "variant",
|
|
3179
|
+
"values": [true]
|
|
3180
|
+
}
|
|
3181
|
+
},
|
|
3182
|
+
"rules": [
|
|
3183
|
+
{
|
|
3184
|
+
"if": {
|
|
3185
|
+
"inverse": true
|
|
3186
|
+
},
|
|
3187
|
+
"tokens": {
|
|
3188
|
+
"backgroundColor": "{palette.color.white}",
|
|
3189
|
+
"color": "{palette.color.darkMosque}"
|
|
3190
|
+
}
|
|
3191
|
+
}
|
|
3192
|
+
],
|
|
2990
3193
|
"tokens": {
|
|
2991
3194
|
"arrowBorderRadius": "{palette.radius.none}",
|
|
2992
3195
|
"arrowOffset": "{palette.size.size4}",
|
|
@@ -3245,6 +3448,22 @@
|
|
|
3245
3448
|
"size": "{palette.size.size120}"
|
|
3246
3449
|
}
|
|
3247
3450
|
},
|
|
3451
|
+
{
|
|
3452
|
+
"if": {
|
|
3453
|
+
"space": 12
|
|
3454
|
+
},
|
|
3455
|
+
"tokens": {
|
|
3456
|
+
"size": "{palette.size.size120}"
|
|
3457
|
+
}
|
|
3458
|
+
},
|
|
3459
|
+
{
|
|
3460
|
+
"if": {
|
|
3461
|
+
"space": 11
|
|
3462
|
+
},
|
|
3463
|
+
"tokens": {
|
|
3464
|
+
"size": "{palette.size.size120}"
|
|
3465
|
+
}
|
|
3466
|
+
},
|
|
3248
3467
|
{
|
|
3249
3468
|
"if": {
|
|
3250
3469
|
"space": 10
|
|
@@ -3327,7 +3546,7 @@
|
|
|
3327
3546
|
},
|
|
3328
3547
|
{
|
|
3329
3548
|
"if": {
|
|
3330
|
-
"space":
|
|
3549
|
+
"space": 11,
|
|
3331
3550
|
"viewport": ["lg", "xl"]
|
|
3332
3551
|
},
|
|
3333
3552
|
"tokens": {
|
|
@@ -3336,7 +3555,7 @@
|
|
|
3336
3555
|
},
|
|
3337
3556
|
{
|
|
3338
3557
|
"if": {
|
|
3339
|
-
"space":
|
|
3558
|
+
"space": 10,
|
|
3340
3559
|
"viewport": ["lg", "xl"]
|
|
3341
3560
|
},
|
|
3342
3561
|
"tokens": {
|
|
@@ -3345,7 +3564,7 @@
|
|
|
3345
3564
|
},
|
|
3346
3565
|
{
|
|
3347
3566
|
"if": {
|
|
3348
|
-
"space":
|
|
3567
|
+
"space": 9,
|
|
3349
3568
|
"viewport": ["lg", "xl"]
|
|
3350
3569
|
},
|
|
3351
3570
|
"tokens": {
|
|
@@ -3354,13 +3573,31 @@
|
|
|
3354
3573
|
},
|
|
3355
3574
|
{
|
|
3356
3575
|
"if": {
|
|
3357
|
-
"space":
|
|
3576
|
+
"space": 8,
|
|
3358
3577
|
"viewport": ["lg", "xl"]
|
|
3359
3578
|
},
|
|
3360
3579
|
"tokens": {
|
|
3361
3580
|
"size": "{palette.size.size64}"
|
|
3362
3581
|
}
|
|
3363
3582
|
},
|
|
3583
|
+
{
|
|
3584
|
+
"if": {
|
|
3585
|
+
"space": 7,
|
|
3586
|
+
"viewport": ["lg", "xl"]
|
|
3587
|
+
},
|
|
3588
|
+
"tokens": {
|
|
3589
|
+
"size": "{palette.size.size48}"
|
|
3590
|
+
}
|
|
3591
|
+
},
|
|
3592
|
+
{
|
|
3593
|
+
"if": {
|
|
3594
|
+
"space": 6,
|
|
3595
|
+
"viewport": ["lg", "xl"]
|
|
3596
|
+
},
|
|
3597
|
+
"tokens": {
|
|
3598
|
+
"size": "{palette.size.size40}"
|
|
3599
|
+
}
|
|
3600
|
+
},
|
|
3364
3601
|
{
|
|
3365
3602
|
"if": {
|
|
3366
3603
|
"space": 0
|