@abgov/design-tokens 2.9.0 → 2.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.
|
@@ -0,0 +1,171 @@
|
|
|
1
|
+
{
|
|
2
|
+
"dropdown-multiselect-border": {
|
|
3
|
+
"value": "inset 0 0 0 {input.borderWidth.default} {input.color.border.default}",
|
|
4
|
+
"type": "other"
|
|
5
|
+
},
|
|
6
|
+
"dropdown-multiselect-border-disabled": {
|
|
7
|
+
"value": "inset 0 0 0 {input.borderWidth.default} {input.color.border.disabled}",
|
|
8
|
+
"type": "other"
|
|
9
|
+
},
|
|
10
|
+
"dropdown-multiselect-border-error": {
|
|
11
|
+
"value": "inset 0 0 0 {input.borderWidth.focus} {input.color.border.error}",
|
|
12
|
+
"type": "other"
|
|
13
|
+
},
|
|
14
|
+
"dropdown-multiselect-border-focus": {
|
|
15
|
+
"value": "inset 0 0 0 {input.borderWidth.focus} {input.color.border.focus}",
|
|
16
|
+
"type": "other"
|
|
17
|
+
},
|
|
18
|
+
"dropdown-multiselect-border-hover": {
|
|
19
|
+
"value": "inset 0 0 0 {input.borderWidth.focus} {input.color.border.hover}",
|
|
20
|
+
"type": "other"
|
|
21
|
+
},
|
|
22
|
+
"dropdown-multiselect-border-error-hover": {
|
|
23
|
+
"value": "inset 0 0 0 {input.borderWidth.focus} {input.color.border.error-hover}",
|
|
24
|
+
"type": "other"
|
|
25
|
+
},
|
|
26
|
+
"dropdown-multiselect-border-radius": {
|
|
27
|
+
"value": "{input.borderRadius.input}",
|
|
28
|
+
"type": "borderRadius"
|
|
29
|
+
},
|
|
30
|
+
"dropdown-multiselect-color-bg": {
|
|
31
|
+
"value": "{input.color.background.default}",
|
|
32
|
+
"dark": "var(--goa-color-surface-input)",
|
|
33
|
+
"type": "color"
|
|
34
|
+
},
|
|
35
|
+
"dropdown-multiselect-color-bg-disabled": {
|
|
36
|
+
"value": "{input.color.background.disabled}",
|
|
37
|
+
"type": "color"
|
|
38
|
+
},
|
|
39
|
+
"dropdown-multiselect-color-text": {
|
|
40
|
+
"value": "{input.color.text.default}",
|
|
41
|
+
"type": "color"
|
|
42
|
+
},
|
|
43
|
+
"dropdown-multiselect-color-text-disabled": {
|
|
44
|
+
"value": "{input.color.text.disabled}",
|
|
45
|
+
"type": "color"
|
|
46
|
+
},
|
|
47
|
+
"dropdown-multiselect-color-text-placeholder": {
|
|
48
|
+
"value": "{input.color.text.default}",
|
|
49
|
+
"type": "color"
|
|
50
|
+
},
|
|
51
|
+
"dropdown-multiselect-color-text-error": {
|
|
52
|
+
"value": "{input.color.text.error}",
|
|
53
|
+
"type": "color"
|
|
54
|
+
},
|
|
55
|
+
"dropdown-multiselect-item-color-bg": {
|
|
56
|
+
"value": "{input.color.background.default}",
|
|
57
|
+
"type": "color"
|
|
58
|
+
},
|
|
59
|
+
"dropdown-multiselect-item-color-bg-disabled": {
|
|
60
|
+
"value": "{input.color.background.disabled}",
|
|
61
|
+
"type": "color"
|
|
62
|
+
},
|
|
63
|
+
"dropdown-multiselect-item-color-bg-hover": {
|
|
64
|
+
"value": "{color.greyscale.100}",
|
|
65
|
+
"type": "color"
|
|
66
|
+
},
|
|
67
|
+
"dropdown-multiselect-item-color-bg-selected": {
|
|
68
|
+
"value": "{color.interactive.default}",
|
|
69
|
+
"type": "color"
|
|
70
|
+
},
|
|
71
|
+
"dropdown-multiselect-item-color-bg-selected-hover": {
|
|
72
|
+
"value": "{color.interactive.hover}",
|
|
73
|
+
"type": "color"
|
|
74
|
+
},
|
|
75
|
+
"dropdown-multiselect-item-color-text": {
|
|
76
|
+
"value": "{color.text.secondary}",
|
|
77
|
+
"type": "color"
|
|
78
|
+
},
|
|
79
|
+
"dropdown-multiselect-item-color-text-disabled": {
|
|
80
|
+
"value": "{color.text.disabled}",
|
|
81
|
+
"type": "color"
|
|
82
|
+
},
|
|
83
|
+
"dropdown-multiselect-item-color-text-hover": {
|
|
84
|
+
"value": "{color.text.default}",
|
|
85
|
+
"type": "color"
|
|
86
|
+
},
|
|
87
|
+
"dropdown-multiselect-item-color-text-selected": {
|
|
88
|
+
"value": "{color.greyscale.white}",
|
|
89
|
+
"type": "color"
|
|
90
|
+
},
|
|
91
|
+
"dropdown-multiselect-item-color-text-selected-hover": {
|
|
92
|
+
"value": "{color.text.light}",
|
|
93
|
+
"type": "color"
|
|
94
|
+
},
|
|
95
|
+
"dropdown-multiselect-item-padding": {
|
|
96
|
+
"value": "{space.s} {space.xs}",
|
|
97
|
+
"type": "spacing"
|
|
98
|
+
},
|
|
99
|
+
"dropdown-multiselect-item-border-radius": {
|
|
100
|
+
"value": "{borderRadius.s}",
|
|
101
|
+
"type": "borderRadius"
|
|
102
|
+
},
|
|
103
|
+
"dropdown-multiselect-height": {
|
|
104
|
+
"value": "56px",
|
|
105
|
+
"type": "sizing"
|
|
106
|
+
},
|
|
107
|
+
"dropdown-multiselect-padding": {
|
|
108
|
+
"value": "{space.m} {space.s}",
|
|
109
|
+
"type": "spacing"
|
|
110
|
+
},
|
|
111
|
+
"dropdown-multiselect-padding-vertical": {
|
|
112
|
+
"value": "{space.m}",
|
|
113
|
+
"type": "spacing"
|
|
114
|
+
},
|
|
115
|
+
"dropdown-multiselect-padding-lr": {
|
|
116
|
+
"value": "{space.s}",
|
|
117
|
+
"type": "spacing"
|
|
118
|
+
},
|
|
119
|
+
"dropdown-multiselect-space-icon-text": {
|
|
120
|
+
"value": "{space.s}",
|
|
121
|
+
"type": "spacing"
|
|
122
|
+
},
|
|
123
|
+
"dropdown-multiselect-transition": {
|
|
124
|
+
"value": "box-shadow 0.05s ease-in",
|
|
125
|
+
"type": "other"
|
|
126
|
+
},
|
|
127
|
+
"dropdown-multiselect-typography": {
|
|
128
|
+
"value": "{typography.body.m}",
|
|
129
|
+
"type": "other"
|
|
130
|
+
},
|
|
131
|
+
"dropdown-multiselect-label-typography": {
|
|
132
|
+
"value": "{typography.body.m}",
|
|
133
|
+
"type": "other"
|
|
134
|
+
},
|
|
135
|
+
"dropdown-multiselect-helper-typography": {
|
|
136
|
+
"value": "{typography.body.xs}",
|
|
137
|
+
"type": "other"
|
|
138
|
+
},
|
|
139
|
+
"dropdown-multiselect-menu-border-radius": {
|
|
140
|
+
"value": "{input.borderRadius.input}",
|
|
141
|
+
"type": "borderRadius"
|
|
142
|
+
},
|
|
143
|
+
"dropdown-multiselect-menu-margin": {
|
|
144
|
+
"value": "{space.xs}",
|
|
145
|
+
"type": "spacing"
|
|
146
|
+
},
|
|
147
|
+
"dropdown-multiselect-compact-height": {
|
|
148
|
+
"value": "40px",
|
|
149
|
+
"type": "sizing"
|
|
150
|
+
},
|
|
151
|
+
"dropdown-multiselect-compact-typography": {
|
|
152
|
+
"value": "{typography.body.s}",
|
|
153
|
+
"type": "other"
|
|
154
|
+
},
|
|
155
|
+
"dropdown-multiselect-compact-padding": {
|
|
156
|
+
"value": "0 {space.s}",
|
|
157
|
+
"type": "spacing"
|
|
158
|
+
},
|
|
159
|
+
"dropdown-multiselect-compact-item-padding": {
|
|
160
|
+
"value": "0 {space.xs}",
|
|
161
|
+
"type": "spacing"
|
|
162
|
+
},
|
|
163
|
+
"dropdown-multiselect-compact-item-typography": {
|
|
164
|
+
"value": "{typography.body.s}",
|
|
165
|
+
"type": "other"
|
|
166
|
+
},
|
|
167
|
+
"dropdown-multiselect-divider": {
|
|
168
|
+
"value": "{borderWidth.s} solid {color.greyscale.200}",
|
|
169
|
+
"type": "other"
|
|
170
|
+
}
|
|
171
|
+
}
|
package/dist/dark-theme.css
CHANGED
|
@@ -49,6 +49,7 @@
|
|
|
49
49
|
--goa-drawer-overlay-color: rgba(0, 0, 0, 0.6);
|
|
50
50
|
--goa-drawer-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.3), 0 8px 40px 0 rgba(0, 0, 0, 0.4);
|
|
51
51
|
--goa-dropdown-color-bg: var(--goa-color-surface-input);
|
|
52
|
+
--goa-dropdown-multiselect-color-bg: var(--goa-color-surface-input);
|
|
52
53
|
--goa-file-upload-color-bg-focus: #252d35;
|
|
53
54
|
--goa-file-upload-color-bg-hover: #252d35;
|
|
54
55
|
--goa-footer-color-text: #909090;
|
package/dist/tokens.css
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on Wed,
|
|
3
|
+
* Generated on Wed, 08 Jul 2026 15:43:58 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
:root {
|
|
@@ -319,6 +319,9 @@
|
|
|
319
319
|
--goa-filter-chip-min-width: 56px;
|
|
320
320
|
--goa-filter-chip-label-gap: 0.375rem;
|
|
321
321
|
--goa-filter-chip-padding-vertical: 0.3125rem;
|
|
322
|
+
--goa-dropdown-multiselect-compact-height: 40px;
|
|
323
|
+
--goa-dropdown-multiselect-transition: box-shadow 0.05s ease-in;
|
|
324
|
+
--goa-dropdown-multiselect-height: 56px;
|
|
322
325
|
--goa-dropdown-compact-height: 40px;
|
|
323
326
|
--goa-dropdown-transition: box-shadow 0.05s ease-in;
|
|
324
327
|
--goa-dropdown-height: 56px;
|
|
@@ -878,6 +881,20 @@
|
|
|
878
881
|
--goa-file-upload-border-drag: var(--goa-border-width-m) solid var(--goa-color-interactive-hover);
|
|
879
882
|
--goa-file-upload-border-active: var(--goa-border-width-m) solid var(--goa-color-interactive-hover);
|
|
880
883
|
--goa-file-upload-border: var(--goa-border-width-m) dashed var(--goa-color-interactive-default);
|
|
884
|
+
--goa-dropdown-multiselect-divider: var(--goa-border-width-s) solid var(--goa-color-greyscale-200);
|
|
885
|
+
--goa-dropdown-multiselect-compact-item-padding: 0 var(--goa-space-xs);
|
|
886
|
+
--goa-dropdown-multiselect-compact-padding: 0 var(--goa-space-s);
|
|
887
|
+
--goa-dropdown-multiselect-menu-margin: var(--goa-space-xs);
|
|
888
|
+
--goa-dropdown-multiselect-space-icon-text: var(--goa-space-s);
|
|
889
|
+
--goa-dropdown-multiselect-padding-lr: var(--goa-space-s);
|
|
890
|
+
--goa-dropdown-multiselect-padding-vertical: var(--goa-space-m);
|
|
891
|
+
--goa-dropdown-multiselect-padding: var(--goa-space-m) var(--goa-space-s);
|
|
892
|
+
--goa-dropdown-multiselect-item-border-radius: var(--goa-border-radius-s);
|
|
893
|
+
--goa-dropdown-multiselect-item-padding: var(--goa-space-s) var(--goa-space-xs);
|
|
894
|
+
--goa-dropdown-multiselect-item-color-text-selected: var(--goa-color-greyscale-white);
|
|
895
|
+
--goa-dropdown-multiselect-item-color-bg-selected-hover: var(--goa-color-interactive-hover);
|
|
896
|
+
--goa-dropdown-multiselect-item-color-bg-selected: var(--goa-color-interactive-default);
|
|
897
|
+
--goa-dropdown-multiselect-item-color-bg-hover: var(--goa-color-greyscale-100);
|
|
881
898
|
--goa-dropdown-compact-item-padding: 0 var(--goa-space-xs);
|
|
882
899
|
--goa-dropdown-compact-padding: 0 var(--goa-space-s);
|
|
883
900
|
--goa-dropdown-menu-margin: var(--goa-space-xs);
|
|
@@ -1258,6 +1275,29 @@
|
|
|
1258
1275
|
--goa-filter-chip-text-color: var(--goa-color-text-default);
|
|
1259
1276
|
--goa-file-upload-instruction-text: var(--goa-typography-body-m);
|
|
1260
1277
|
--goa-file-upload-help-text: var(--goa-typography-body-s);
|
|
1278
|
+
--goa-dropdown-multiselect-compact-item-typography: var(--goa-typography-body-s);
|
|
1279
|
+
--goa-dropdown-multiselect-compact-typography: var(--goa-typography-body-s);
|
|
1280
|
+
--goa-dropdown-multiselect-menu-border-radius: var(--goa-input-border-radius-input);
|
|
1281
|
+
--goa-dropdown-multiselect-helper-typography: var(--goa-typography-body-xs);
|
|
1282
|
+
--goa-dropdown-multiselect-label-typography: var(--goa-typography-body-m);
|
|
1283
|
+
--goa-dropdown-multiselect-typography: var(--goa-typography-body-m);
|
|
1284
|
+
--goa-dropdown-multiselect-item-color-text-selected-hover: var(--goa-color-text-light);
|
|
1285
|
+
--goa-dropdown-multiselect-item-color-text-hover: var(--goa-color-text-default);
|
|
1286
|
+
--goa-dropdown-multiselect-item-color-text-disabled: var(--goa-color-text-disabled);
|
|
1287
|
+
--goa-dropdown-multiselect-item-color-text: var(--goa-color-text-secondary);
|
|
1288
|
+
--goa-dropdown-multiselect-item-color-bg-disabled: var(--goa-input-color-background-disabled);
|
|
1289
|
+
--goa-dropdown-multiselect-item-color-bg: var(--goa-input-color-background-default);
|
|
1290
|
+
--goa-dropdown-multiselect-color-text-error: var(--goa-input-color-text-error);
|
|
1291
|
+
--goa-dropdown-multiselect-color-text-disabled: var(--goa-input-color-text-disabled);
|
|
1292
|
+
--goa-dropdown-multiselect-color-bg-disabled: var(--goa-input-color-background-disabled);
|
|
1293
|
+
--goa-dropdown-multiselect-color-bg: var(--goa-input-color-background-default);
|
|
1294
|
+
--goa-dropdown-multiselect-border-radius: var(--goa-input-border-radius-input);
|
|
1295
|
+
--goa-dropdown-multiselect-border-error-hover: inset 0 0 0 var(--goa-input-border-width-focus) var(--goa-input-color-border-error-hover);
|
|
1296
|
+
--goa-dropdown-multiselect-border-hover: inset 0 0 0 var(--goa-input-border-width-focus) var(--goa-input-color-border-hover);
|
|
1297
|
+
--goa-dropdown-multiselect-border-focus: inset 0 0 0 var(--goa-input-border-width-focus) var(--goa-input-color-border-focus);
|
|
1298
|
+
--goa-dropdown-multiselect-border-error: inset 0 0 0 var(--goa-input-border-width-focus) var(--goa-input-color-border-error);
|
|
1299
|
+
--goa-dropdown-multiselect-border-disabled: inset 0 0 0 var(--goa-input-border-width-default) var(--goa-input-color-border-disabled);
|
|
1300
|
+
--goa-dropdown-multiselect-border: inset 0 0 0 var(--goa-input-border-width-default) var(--goa-input-color-border-default);
|
|
1261
1301
|
--goa-dropdown-compact-item-typography: var(--goa-typography-body-s);
|
|
1262
1302
|
--goa-dropdown-compact-typography: var(--goa-typography-body-s);
|
|
1263
1303
|
--goa-dropdown-menu-border-radius: var(--goa-input-border-radius-input);
|
|
@@ -1345,6 +1385,8 @@
|
|
|
1345
1385
|
--goa-accordion-color-heading-hover: var(--goa-color-text-default);
|
|
1346
1386
|
--goa-accordion-color-heading: var(--goa-color-text-default);
|
|
1347
1387
|
--goa-text-input-color-text: var(--goa-input-color-text-default);
|
|
1388
|
+
--goa-dropdown-multiselect-color-text-placeholder: var(--goa-input-color-text-default);
|
|
1389
|
+
--goa-dropdown-multiselect-color-text: var(--goa-input-color-text-default);
|
|
1348
1390
|
--goa-dropdown-color-text-placeholder: var(--goa-input-color-text-default);
|
|
1349
1391
|
--goa-dropdown-color-text: var(--goa-input-color-text-default);
|
|
1350
1392
|
--goa-date-input-day-color-text-hover: var(--goa-input-color-text-default);
|
package/dist/tokens.scss
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
|
|
2
2
|
// Do not edit directly
|
|
3
|
-
// Generated on Wed,
|
|
3
|
+
// Generated on Wed, 08 Jul 2026 15:43:58 GMT
|
|
4
4
|
|
|
5
5
|
$goa-accordion-color-bg-heading: #ffffff;
|
|
6
6
|
$goa-accordion-color-filled-bg-heading: #f2f0f0;
|
|
@@ -401,6 +401,48 @@ $goa-dropdown-compact-typography: 400 1rem/1.375rem acumin-variable, helvetica-n
|
|
|
401
401
|
$goa-dropdown-compact-padding: 0 0.75rem;
|
|
402
402
|
$goa-dropdown-compact-item-padding: 0 0.5rem;
|
|
403
403
|
$goa-dropdown-compact-item-typography: 400 1rem/1.375rem acumin-variable, helvetica-neue, arial, sans-serif;
|
|
404
|
+
$goa-dropdown-multiselect-border: inset 0 0 0 1px #808080;
|
|
405
|
+
$goa-dropdown-multiselect-border-disabled: inset 0 0 0 1px #b1b1b1;
|
|
406
|
+
$goa-dropdown-multiselect-border-error: inset 0 0 0 2px #ec040b;
|
|
407
|
+
$goa-dropdown-multiselect-border-focus: inset 0 0 0 2px #006dcc;
|
|
408
|
+
$goa-dropdown-multiselect-border-hover: inset 0 0 0 2px #000000;
|
|
409
|
+
$goa-dropdown-multiselect-border-error-hover: inset 0 0 0 2px #ba0000;
|
|
410
|
+
$goa-dropdown-multiselect-border-radius: 0.5rem;
|
|
411
|
+
$goa-dropdown-multiselect-color-bg: #ffffff;
|
|
412
|
+
$goa-dropdown-multiselect-color-bg-disabled: #e9e9e9;
|
|
413
|
+
$goa-dropdown-multiselect-color-text: #000000;
|
|
414
|
+
$goa-dropdown-multiselect-color-text-disabled: #808080;
|
|
415
|
+
$goa-dropdown-multiselect-color-text-placeholder: #000000;
|
|
416
|
+
$goa-dropdown-multiselect-color-text-error: #a91a10;
|
|
417
|
+
$goa-dropdown-multiselect-item-color-bg: #ffffff;
|
|
418
|
+
$goa-dropdown-multiselect-item-color-bg-disabled: #e9e9e9;
|
|
419
|
+
$goa-dropdown-multiselect-item-color-bg-hover: #f2f0f0;
|
|
420
|
+
$goa-dropdown-multiselect-item-color-bg-selected: #006dcc;
|
|
421
|
+
$goa-dropdown-multiselect-item-color-bg-selected-hover: #045092;
|
|
422
|
+
$goa-dropdown-multiselect-item-color-text: #6f6f6f;
|
|
423
|
+
$goa-dropdown-multiselect-item-color-text-disabled: #4d4d4d;
|
|
424
|
+
$goa-dropdown-multiselect-item-color-text-hover: #000000;
|
|
425
|
+
$goa-dropdown-multiselect-item-color-text-selected: #ffffff;
|
|
426
|
+
$goa-dropdown-multiselect-item-color-text-selected-hover: #ffffff;
|
|
427
|
+
$goa-dropdown-multiselect-item-padding: 0.75rem 0.5rem;
|
|
428
|
+
$goa-dropdown-multiselect-item-border-radius: 0.375rem;
|
|
429
|
+
$goa-dropdown-multiselect-height: 56px;
|
|
430
|
+
$goa-dropdown-multiselect-padding: 1rem 0.75rem;
|
|
431
|
+
$goa-dropdown-multiselect-padding-vertical: 1rem;
|
|
432
|
+
$goa-dropdown-multiselect-padding-lr: 0.75rem;
|
|
433
|
+
$goa-dropdown-multiselect-space-icon-text: 0.75rem;
|
|
434
|
+
$goa-dropdown-multiselect-transition: box-shadow 0.05s ease-in;
|
|
435
|
+
$goa-dropdown-multiselect-typography: 400 1.125rem/1.5rem acumin-variable, helvetica-neue, arial, sans-serif;
|
|
436
|
+
$goa-dropdown-multiselect-label-typography: 400 1.125rem/1.5rem acumin-variable, helvetica-neue, arial, sans-serif;
|
|
437
|
+
$goa-dropdown-multiselect-helper-typography: 400 0.875rem/1.25rem acumin-variable, helvetica-neue, arial, sans-serif;
|
|
438
|
+
$goa-dropdown-multiselect-menu-border-radius: 0.5rem;
|
|
439
|
+
$goa-dropdown-multiselect-menu-margin: 0.5rem;
|
|
440
|
+
$goa-dropdown-multiselect-compact-height: 40px;
|
|
441
|
+
$goa-dropdown-multiselect-compact-typography: 400 1rem/1.375rem acumin-variable, helvetica-neue, arial, sans-serif;
|
|
442
|
+
$goa-dropdown-multiselect-compact-padding: 0 0.75rem;
|
|
443
|
+
$goa-dropdown-multiselect-compact-item-padding: 0 0.5rem;
|
|
444
|
+
$goa-dropdown-multiselect-compact-item-typography: 400 1rem/1.375rem acumin-variable, helvetica-neue, arial, sans-serif;
|
|
445
|
+
$goa-dropdown-multiselect-divider: 1px solid #cdcdcd;
|
|
404
446
|
$goa-file-upload-border: 1.5px dashed #006dcc;
|
|
405
447
|
$goa-file-upload-border-active: 1.5px solid #045092;
|
|
406
448
|
$goa-file-upload-border-drag: 1.5px solid #045092;
|