@abgov/design-tokens 2.8.1 → 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.
- package/.github/workflows/publish.yml +1 -1
- package/.github/workflows/pull-request.yml +0 -20
- package/data/component-design-tokens/dropdown-multiselect-design-tokens.json +171 -0
- package/data/component-design-tokens/modal-design-tokens.json +12 -7
- package/data/component-design-tokens/scroll-panel-design-tokens.json +61 -0
- package/data/component-design-tokens/temporary-notification-design-tokens.json +2 -1
- package/data/component-design-tokens/work-side-menu-design-tokens.json +0 -32
- package/data/component-design-tokens/workspace-layout-design-tokens.json +85 -0
- package/data/goa-global-design-tokens.json +12 -51
- package/dist/dark-theme.css +8 -3
- package/dist/tokens.css +74 -14
- package/dist/tokens.scss +74 -14
- package/package.json +1 -1
|
@@ -26,23 +26,3 @@ jobs:
|
|
|
26
26
|
run: npm run test
|
|
27
27
|
- name: Build
|
|
28
28
|
run: npm run build
|
|
29
|
-
- name: Add auto-generated file
|
|
30
|
-
run: |
|
|
31
|
-
echo "Autobuild is currently disabled"
|
|
32
|
-
# npm run build
|
|
33
|
-
# git config user.email "build-bot@gov.ab.ca"
|
|
34
|
-
# git config user.name "Build Bot"
|
|
35
|
-
# PREVIOUS_MESSAGE="$(git log --format=%B -n 1)"
|
|
36
|
-
# CURRENT_BRANCH="$(git branch --show-current)"
|
|
37
|
-
# echo $(git branch)
|
|
38
|
-
# git add .
|
|
39
|
-
# git commit --amend -m "$PREVIOUS_MESSAGE"
|
|
40
|
-
# git push origin $CURRENT_BRANCH -f
|
|
41
|
-
- name: Semantic Release
|
|
42
|
-
uses: cycjimmy/semantic-release-action@v4
|
|
43
|
-
with:
|
|
44
|
-
dry_run: true
|
|
45
|
-
env:
|
|
46
|
-
GITHUB_TOKEN: ${{ secrets.RELEASE_TOKEN }}
|
|
47
|
-
NPM_TOKEN: ${{ secrets.NPM_TOKEN_GRANULAR }}
|
|
48
|
-
NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN_GRANULAR }}
|
|
@@ -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
|
+
}
|
|
@@ -101,7 +101,7 @@
|
|
|
101
101
|
"description": "Modal maximum width"
|
|
102
102
|
},
|
|
103
103
|
"modal-heading-border-bottom": {
|
|
104
|
-
"value": "
|
|
104
|
+
"value": "none",
|
|
105
105
|
"type": "other",
|
|
106
106
|
"description": "Heading section bottom border separator"
|
|
107
107
|
},
|
|
@@ -111,12 +111,12 @@
|
|
|
111
111
|
"description": "Heading section padding"
|
|
112
112
|
},
|
|
113
113
|
"modal-content-padding": {
|
|
114
|
-
"value": "{space.
|
|
114
|
+
"value": "{space.xl} 0 {space.xl} 0",
|
|
115
115
|
"type": "spacing",
|
|
116
116
|
"description": "Content section padding"
|
|
117
117
|
},
|
|
118
118
|
"modal-actions-padding": {
|
|
119
|
-
"value": "
|
|
119
|
+
"value": "{space.xs} {space.xl} {space.xl} {space.xl}",
|
|
120
120
|
"type": "spacing",
|
|
121
121
|
"description": "Actions section padding"
|
|
122
122
|
},
|
|
@@ -151,14 +151,19 @@
|
|
|
151
151
|
"description": "Callout variant heading padding for mobile (16px all around)"
|
|
152
152
|
},
|
|
153
153
|
"modal-content-padding-mobile": {
|
|
154
|
-
"value": "{space.
|
|
154
|
+
"value": "{space.xl} {space.m} {space.xl} {space.m}",
|
|
155
|
+
"type": "spacing",
|
|
156
|
+
"description": "Content section padding for mobile (32px top, 16px sides, 32px bottom)"
|
|
157
|
+
},
|
|
158
|
+
"modal-content-padding-desktop": {
|
|
159
|
+
"value": "{space.l} {space.l} {space.xl} {space.l}",
|
|
155
160
|
"type": "spacing",
|
|
156
|
-
"description": "Content section padding for
|
|
161
|
+
"description": "Content section padding for desktop (24px top, 24px sides, 32px bottom)"
|
|
157
162
|
},
|
|
158
163
|
"modal-actions-padding-mobile": {
|
|
159
|
-
"value": "
|
|
164
|
+
"value": "{space.xs} {space.m} {space.m} {space.m}",
|
|
160
165
|
"type": "spacing",
|
|
161
|
-
"description": "Actions section padding for mobile (
|
|
166
|
+
"description": "Actions section padding for mobile (8px top, 16px sides and bottom)"
|
|
162
167
|
},
|
|
163
168
|
"modal-callout-information-bg": {
|
|
164
169
|
"value": "{color.info.light}",
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
{
|
|
2
|
+
"scroll-panel-color-bg": {
|
|
3
|
+
"value": "{color.greyscale.white}",
|
|
4
|
+
"type": "color",
|
|
5
|
+
"description": "Background color for the scroll-panel host."
|
|
6
|
+
},
|
|
7
|
+
"scroll-panel-header-color-bg": {
|
|
8
|
+
"value": "{color.greyscale.white}",
|
|
9
|
+
"type": "color",
|
|
10
|
+
"description": "Background color for the scroll-panel header slot."
|
|
11
|
+
},
|
|
12
|
+
"scroll-panel-footer-color-bg": {
|
|
13
|
+
"value": "{color.greyscale.white}",
|
|
14
|
+
"type": "color",
|
|
15
|
+
"description": "Background color for the scroll-panel footer slot."
|
|
16
|
+
},
|
|
17
|
+
"scroll-panel-content-shadow-bottom": {
|
|
18
|
+
"value": {
|
|
19
|
+
"light": "inset 0px -4px 8px -4px rgba(0,0,0,0.25)",
|
|
20
|
+
"dark": "inset 0px -4px 8px -4px rgba(0,0,0,0.5)"
|
|
21
|
+
},
|
|
22
|
+
"type": "other",
|
|
23
|
+
"description": "Inset shadow on scroll-panel content when scrolled to the top (more content below the visible edge)."
|
|
24
|
+
},
|
|
25
|
+
"scroll-panel-content-shadow-top": {
|
|
26
|
+
"value": {
|
|
27
|
+
"light": "inset 0px 4px 8px -4px rgba(0,0,0,0.25)",
|
|
28
|
+
"dark": "inset 0px 4px 8px -4px rgba(0,0,0,0.5)"
|
|
29
|
+
},
|
|
30
|
+
"type": "other",
|
|
31
|
+
"description": "Inset shadow on scroll-panel content when scrolled to the bottom (more content above the visible edge)."
|
|
32
|
+
},
|
|
33
|
+
"scroll-panel-content-shadow-top-bottom": {
|
|
34
|
+
"value": {
|
|
35
|
+
"light": "inset 0px 4px 8px -4px rgba(0,0,0,0.175), inset 0px -4px 8px -4px rgba(0,0,0,0.175)",
|
|
36
|
+
"dark": "inset 0px 4px 8px -4px rgba(0,0,0,0.4), inset 0px -4px 8px -4px rgba(0,0,0,0.4)"
|
|
37
|
+
},
|
|
38
|
+
"type": "other",
|
|
39
|
+
"description": "Inset shadows on both edges of scroll-panel content when scrolled to the middle (more content above and below)."
|
|
40
|
+
},
|
|
41
|
+
"scroll-panel-header-scroll-border": {
|
|
42
|
+
"value": "{color.greyscale.150}",
|
|
43
|
+
"type": "color",
|
|
44
|
+
"description": "Border color shown under the header when content is scrolled beneath it."
|
|
45
|
+
},
|
|
46
|
+
"scroll-panel-header-scroll-shadow": {
|
|
47
|
+
"value": "{shadow.shallow-below}",
|
|
48
|
+
"type": "other",
|
|
49
|
+
"description": "Drop shadow cast below the header when content is scrolled beneath it."
|
|
50
|
+
},
|
|
51
|
+
"scroll-panel-footer-scroll-border": {
|
|
52
|
+
"value": "{color.greyscale.150}",
|
|
53
|
+
"type": "color",
|
|
54
|
+
"description": "Border color shown above the footer when content is scrolled below it."
|
|
55
|
+
},
|
|
56
|
+
"scroll-panel-footer-scroll-shadow": {
|
|
57
|
+
"value": "{shadow.shallow-above}",
|
|
58
|
+
"type": "other",
|
|
59
|
+
"description": "Drop shadow cast above the footer when content is scrolled below it."
|
|
60
|
+
}
|
|
61
|
+
}
|
|
@@ -17,8 +17,9 @@
|
|
|
17
17
|
},
|
|
18
18
|
"temporary-notification-color-text": {
|
|
19
19
|
"value": "{color.text.light}",
|
|
20
|
+
"dark": "#ffffff",
|
|
20
21
|
"type": "color",
|
|
21
|
-
"description": "Text color for notification messages"
|
|
22
|
+
"description": "Text color for notification messages. Static white in dark mode because the notification background stays dark in both modes; cascading through {color.text.light} would flip to #1e1e1e (page bg) and become unreadable."
|
|
22
23
|
},
|
|
23
24
|
"temporary-notification-color-border": {
|
|
24
25
|
"value": "{color.greyscale.700}",
|
|
@@ -55,37 +55,5 @@
|
|
|
55
55
|
"work-side-menu-transition-duration-medium": {
|
|
56
56
|
"value": "{motionDuration.medium-2}",
|
|
57
57
|
"type": "other"
|
|
58
|
-
},
|
|
59
|
-
"work-side-menu-top-section-border": {
|
|
60
|
-
"value": "{borderWidth.s} solid transparent",
|
|
61
|
-
"type": "other"
|
|
62
|
-
},
|
|
63
|
-
"work-side-menu-top-section-shadow": {
|
|
64
|
-
"value": "0 4px 6px -4px rgba(0, 0, 0, 0)",
|
|
65
|
-
"type": "other"
|
|
66
|
-
},
|
|
67
|
-
"work-side-menu-top-section-border-scrolled": {
|
|
68
|
-
"value": "{borderWidth.s} solid {color.greyscale.200}",
|
|
69
|
-
"type": "other"
|
|
70
|
-
},
|
|
71
|
-
"work-side-menu-top-section-shadow-scrolled": {
|
|
72
|
-
"value": "0 4px 6px -4px rgba(0, 0, 0, 0.1)",
|
|
73
|
-
"type": "other"
|
|
74
|
-
},
|
|
75
|
-
"work-side-menu-bottom-section-border": {
|
|
76
|
-
"value": "{borderWidth.s} solid transparent",
|
|
77
|
-
"type": "other"
|
|
78
|
-
},
|
|
79
|
-
"work-side-menu-bottom-section-shadow": {
|
|
80
|
-
"value": "0 -4px 6px -4px rgba(0, 0, 0, 0)",
|
|
81
|
-
"type": "other"
|
|
82
|
-
},
|
|
83
|
-
"work-side-menu-bottom-section-border-scrolled": {
|
|
84
|
-
"value": "{borderWidth.s} solid {color.greyscale.200}",
|
|
85
|
-
"type": "other"
|
|
86
|
-
},
|
|
87
|
-
"work-side-menu-bottom-section-shadow-scrolled": {
|
|
88
|
-
"value": "0 -4px 6px -4px rgba(0, 0, 0, 0.1)",
|
|
89
|
-
"type": "other"
|
|
90
58
|
}
|
|
91
59
|
}
|
|
@@ -0,0 +1,85 @@
|
|
|
1
|
+
{
|
|
2
|
+
"workspace-layout-bg-color": {
|
|
3
|
+
"value": "{color.greyscale.50}",
|
|
4
|
+
"type": "color",
|
|
5
|
+
"description": "Background color of the workspace layout shell (visible around the main card)."
|
|
6
|
+
},
|
|
7
|
+
"workspace-layout-card-bg-color": {
|
|
8
|
+
"value": "{color.greyscale.white}",
|
|
9
|
+
"type": "color",
|
|
10
|
+
"description": "Background color of the workspace layout's main scrollable card."
|
|
11
|
+
},
|
|
12
|
+
"workspace-layout-header-bg-color": {
|
|
13
|
+
"value": "{color.greyscale.white}",
|
|
14
|
+
"type": "color",
|
|
15
|
+
"description": "Background color of the sticky page header inside the workspace layout card."
|
|
16
|
+
},
|
|
17
|
+
"workspace-layout-header-border-bottom": {
|
|
18
|
+
"value": {
|
|
19
|
+
"width": "{borderWidth.s}",
|
|
20
|
+
"style": "solid",
|
|
21
|
+
"color": "{color.greyscale.200}"
|
|
22
|
+
},
|
|
23
|
+
"type": "border",
|
|
24
|
+
"description": "Divider line under the sticky page header."
|
|
25
|
+
},
|
|
26
|
+
"workspace-layout-header-scroll-border-color": {
|
|
27
|
+
"value": "{color.greyscale.200}",
|
|
28
|
+
"type": "color",
|
|
29
|
+
"description": "Border color under the sticky page header when content is scrolled past it."
|
|
30
|
+
},
|
|
31
|
+
"workspace-layout-header-scroll-shadow": {
|
|
32
|
+
"value": "{shadow.shallow-below}",
|
|
33
|
+
"type": "other",
|
|
34
|
+
"description": "Soft drop shadow cast below the sticky page header when content is scrolled past it."
|
|
35
|
+
},
|
|
36
|
+
"workspace-layout-footer-bg-color": {
|
|
37
|
+
"value": "{color.greyscale.white}",
|
|
38
|
+
"type": "color",
|
|
39
|
+
"description": "Background color of the sticky page footer inside the workspace layout card."
|
|
40
|
+
},
|
|
41
|
+
"workspace-layout-footer-border-top": {
|
|
42
|
+
"value": {
|
|
43
|
+
"width": "{borderWidth.s}",
|
|
44
|
+
"style": "solid",
|
|
45
|
+
"color": "{color.greyscale.200}"
|
|
46
|
+
},
|
|
47
|
+
"type": "border",
|
|
48
|
+
"description": "Divider line above the sticky page footer."
|
|
49
|
+
},
|
|
50
|
+
"workspace-layout-footer-scroll-border-color": {
|
|
51
|
+
"value": "{color.greyscale.200}",
|
|
52
|
+
"type": "color",
|
|
53
|
+
"description": "Border color above the sticky page footer when content is scrolled past it."
|
|
54
|
+
},
|
|
55
|
+
"workspace-layout-footer-scroll-shadow": {
|
|
56
|
+
"value": "{shadow.shallow-above}",
|
|
57
|
+
"type": "other",
|
|
58
|
+
"description": "Soft drop shadow cast above the sticky page footer when content is scrolled past it."
|
|
59
|
+
},
|
|
60
|
+
"workspace-layout-mobile-toggle-top": {
|
|
61
|
+
"value": "{space.l}",
|
|
62
|
+
"type": "spacing",
|
|
63
|
+
"description": "Vertical offset of the auto-rendered mobile hamburger button from the top of the layout."
|
|
64
|
+
},
|
|
65
|
+
"workspace-layout-mobile-toggle-left": {
|
|
66
|
+
"value": "{space.s}",
|
|
67
|
+
"type": "spacing",
|
|
68
|
+
"description": "Horizontal offset of the auto-rendered mobile hamburger button from the left of the layout."
|
|
69
|
+
},
|
|
70
|
+
"workspace-layout-mobile-toggle-size": {
|
|
71
|
+
"value": "{iconSize.xl}",
|
|
72
|
+
"type": "sizing",
|
|
73
|
+
"description": "Width and height of the auto-rendered mobile hamburger button."
|
|
74
|
+
},
|
|
75
|
+
"workspace-layout-mobile-toggle-color": {
|
|
76
|
+
"value": "{color.text.default}",
|
|
77
|
+
"type": "color",
|
|
78
|
+
"description": "Color of the auto-rendered mobile hamburger button icon."
|
|
79
|
+
},
|
|
80
|
+
"workspace-layout-mobile-header-padding-left": {
|
|
81
|
+
"value": "{space.2xl}",
|
|
82
|
+
"type": "spacing",
|
|
83
|
+
"description": "Left padding of the sticky page header on mobile, reserving space so the header content clears the auto-rendered hamburger button."
|
|
84
|
+
}
|
|
85
|
+
}
|
|
@@ -770,66 +770,27 @@
|
|
|
770
770
|
"shadow": {
|
|
771
771
|
"100": {
|
|
772
772
|
"value": {
|
|
773
|
-
"light":
|
|
774
|
-
|
|
775
|
-
"y": "1",
|
|
776
|
-
"blur": "0",
|
|
777
|
-
"spread": "0",
|
|
778
|
-
"color": "#1a1a1a12",
|
|
779
|
-
"type": "dropShadow"
|
|
780
|
-
},
|
|
781
|
-
"dark": {
|
|
782
|
-
"x": "0",
|
|
783
|
-
"y": "1",
|
|
784
|
-
"blur": "0",
|
|
785
|
-
"spread": "0",
|
|
786
|
-
"color": "rgba(255,255,255,0.05)",
|
|
787
|
-
"type": "dropShadow"
|
|
788
|
-
}
|
|
773
|
+
"light": "0px 1px 0px 0px #1a1a1a12",
|
|
774
|
+
"dark": "inset 0px 1px 0px 0px rgba(255,255,255,0.08)"
|
|
789
775
|
},
|
|
790
|
-
"type": "
|
|
776
|
+
"type": "other",
|
|
777
|
+
"description": "Subtle 1px elevation. Light: bottom-edge line. Dark: top-edge inner rim (1px-line shadows don't read on dark, inverted to a thin highlight at the top edge instead)."
|
|
791
778
|
},
|
|
792
779
|
"150": {
|
|
793
780
|
"value": {
|
|
794
|
-
"light":
|
|
795
|
-
|
|
796
|
-
"y": "1",
|
|
797
|
-
"blur": "0",
|
|
798
|
-
"spread": "0",
|
|
799
|
-
"color": "#1a1a1a40",
|
|
800
|
-
"type": "dropShadow"
|
|
801
|
-
},
|
|
802
|
-
"dark": {
|
|
803
|
-
"x": "0",
|
|
804
|
-
"y": "1",
|
|
805
|
-
"blur": "0",
|
|
806
|
-
"spread": "0",
|
|
807
|
-
"color": "rgba(255,255,255,0.08)",
|
|
808
|
-
"type": "dropShadow"
|
|
809
|
-
}
|
|
781
|
+
"light": "0px 1px 0px 0px #1a1a1a40",
|
|
782
|
+
"dark": "inset 0px 1px 0px 0px rgba(255,255,255,0.14)"
|
|
810
783
|
},
|
|
811
|
-
"type": "
|
|
784
|
+
"type": "other",
|
|
785
|
+
"description": "Stronger 1px elevation divider. Same rim pattern as 100 but more visible."
|
|
812
786
|
},
|
|
813
787
|
"200": {
|
|
814
788
|
"value": {
|
|
815
|
-
"light":
|
|
816
|
-
|
|
817
|
-
"y": "3",
|
|
818
|
-
"blur": "1",
|
|
819
|
-
"spread": "-1",
|
|
820
|
-
"color": "#1a1a1a12",
|
|
821
|
-
"type": "dropShadow"
|
|
822
|
-
},
|
|
823
|
-
"dark": {
|
|
824
|
-
"x": "0",
|
|
825
|
-
"y": "3",
|
|
826
|
-
"blur": "1",
|
|
827
|
-
"spread": "-1",
|
|
828
|
-
"color": "rgba(255,255,255,0.05)",
|
|
829
|
-
"type": "dropShadow"
|
|
830
|
-
}
|
|
789
|
+
"light": "0px 3px 1px -1px #1a1a1a12",
|
|
790
|
+
"dark": "inset 0px 1px 0px 0px rgba(255,255,255,0.08), 0px 3px 4px -1px rgba(0,0,0,0.4)"
|
|
831
791
|
},
|
|
832
|
-
"type": "
|
|
792
|
+
"type": "other",
|
|
793
|
+
"description": "Stat card / subtle lift. Light: small drop. Dark: top-edge inner rim + small drop shadow underneath."
|
|
833
794
|
},
|
|
834
795
|
"300": {
|
|
835
796
|
"value": {
|
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;
|
|
@@ -76,10 +77,14 @@
|
|
|
76
77
|
--goa-radio-color-bg: var(--goa-color-surface-input);
|
|
77
78
|
--goa-radio-color-bg-error-hover: #3a1818;
|
|
78
79
|
--goa-radio-label-color-disabled: #6a6a6a;
|
|
80
|
+
--goa-scroll-panel-content-shadow-bottom: inset 0px -4px 8px -4px rgba(0,0,0,0.5);
|
|
81
|
+
--goa-scroll-panel-content-shadow-top: inset 0px 4px 8px -4px rgba(0,0,0,0.5);
|
|
82
|
+
--goa-scroll-panel-content-shadow-top-bottom: inset 0px 4px 8px -4px rgba(0,0,0,0.4), inset 0px -4px 8px -4px rgba(0,0,0,0.4);
|
|
79
83
|
--goa-table-color-bg-heading-hover: var(--goa-color-surface-heading-hover);
|
|
80
84
|
--goa-table-color-bg-heading: var(--goa-color-surface-heading);
|
|
81
85
|
--goa-table-color-bg-data: var(--goa-color-surface-table-data);
|
|
82
86
|
--goa-temporary-notification-color-bg-basic: var(--goa-color-surface-heading);
|
|
87
|
+
--goa-temporary-notification-color-text: #ffffff;
|
|
83
88
|
--goa-work-side-menu-account-bg: var(--goa-color-surface-widget);
|
|
84
89
|
--goa-work-side-menu-logo: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPSczMicgaGVpZ2h0PSczMicgZmlsbD0nbm9uZSc+PHJlY3Qgd2lkdGg9JzMxLjY5NScgaGVpZ2h0PSczMS42ODgnIHg9Jy4wMjgnIGZpbGw9JyMwMDg0QkInIHJ4PSc0Jy8+PGcgY2xpcC1wYXRoPSd1cmwoI2EpJz48bWFzayBpZD0nYicgd2lkdGg9JzQ3JyBoZWlnaHQ9JzM5JyB4PSctMTEnIHk9Jy0yJyBtYXNrVW5pdHM9J3VzZXJTcGFjZU9uVXNlJyBzdHlsZT0nbWFzay10eXBlOmFscGhhJz48cGF0aCBmaWxsPScjNTQ1ODYwJyBkPSdNMjIuMDE3IDMxLjEwM2E2My40NyA2My40NyAwIDAgMS03LjIyLTMuMTY0IDUyLjQxIDUyLjQxIDAgMCAwIDYuMTk1LTIuNzI0IDQzLjE0OCA0My4xNDggMCAwIDAgMS4wMjMgNS44OW0xMy4yNy0yNC4zOTJjLTEuMDM0LS4xMy0uNDk3LjM0OC0uNzg1IDEuNy0xLjI0NiA1LjgzMi02LjA1IDEwLjAzNS0xMC44NzMgMTIuODU1LS41MDYtNi42NzgtLjMtMTQuMDkzLjk2Ny0xOC42MzYgMS4wNjktMy44MzYgMi4zNC0zLjEzMi43NjMtMy45MzgtMS42Ni0uODQ4LTMuNDQuMjczLTQuODgyIDMuMTNDMTkuMDMzIDQuNjggMTIuMzkzIDIwLjE5IDEuNzggMzAuNjY0Yy01LjQzIDUuMzYtMTAuMzQgMi42LTExLjMyMyAxLjc3NS0uOC0uNjctMS4wOTYuMzY1LS4xMDMgMS40MjYgNC4zOSA0LjcgMTAuODA1IDIuMDAzIDEzLjE0MS0uMzE0IDYuNDU1LTYuNDA1IDEzLjk2LTIwLjE5MyAxNi45OTYtMjYuMDQ0YTg5Ljg5IDg5Ljg5IDAgMCAwIC4yNDMgMTUuMjk0IDQ0LjY5IDQ0LjY5IDAgMCAxLTcuNjE5IDIuODg1Yy0xLjUwNC4zOTEtMi40MzUgMS0yLjQ2MiAxLjY5MS0uMDMuNzU4Ljk4IDEuMzk3IDIuNDQgMi4wODUgMi42IDEuMjI2IDEwLjIxNiA0Ljc5OCAxMi4wOTMgNS44NzggMS42MDYuOTI1IDIuMzkuMjA0IDIuODY2LS43OTYuNjIyLTEuMzAyLTEuMDgzLTIuMDU0LTIuNzM1LTIuNTQ1YTUwLjQ3IDUwLjQ3IDAgMCAxLTEuNDgtOC4zODVjMy44Ny0yLjM2NSA3LjY4Mi01LjUyIDkuODgtOS40NTJhMTguMDA0IDE4LjAwNCAwIDAgMCAxLjU2OC00LjM2NWMuMjMtLjkzNC4yOTMtMS45LjE4Ni0yLjg1NSAwIDAtLjAzLS4yMDktLjE4Ni0uMjI5Jy8+PC9tYXNrPjxnIG1hc2s9J3VybCgjYiknPjxyZWN0IHdpZHRoPSczMS42OTUnIGhlaWdodD0nMzEuNjk1JyB4PScuMDI4JyBmaWxsPScjQzJDNkNFJyByeD0nMy4wNDgnLz48L2c+PC9nPjxkZWZzPjxjbGlwUGF0aCBpZD0nYSc+PHJlY3Qgd2lkdGg9JzMyJyBoZWlnaHQ9JzMxLjk5MicgeT0nLjAwOCcgZmlsbD0nI2ZmZicgcng9JzQnLz48L2NsaXBQYXRoPjwvZGVmcz48L3N2Zz4=);
|
|
85
90
|
--goa-work-side-menu-popover-shadow: 0 4px 6px rgba(0,0,0,0.4);
|
|
@@ -188,9 +193,9 @@
|
|
|
188
193
|
--goa-color-extended-prairie-border: #5e4825;
|
|
189
194
|
--goa-color-extended-prairie-text: #e8d8a0;
|
|
190
195
|
--goa-opacity-background-modal: 70%;
|
|
191
|
-
--goa-shadow-100: 0px 1px 0px 0px rgba(255,255,255,0.
|
|
192
|
-
--goa-shadow-150: 0px 1px 0px 0px rgba(255,255,255,0.
|
|
193
|
-
--goa-shadow-200: 0px
|
|
196
|
+
--goa-shadow-100: inset 0px 1px 0px 0px rgba(255,255,255,0.08);
|
|
197
|
+
--goa-shadow-150: inset 0px 1px 0px 0px rgba(255,255,255,0.14);
|
|
198
|
+
--goa-shadow-200: inset 0px 1px 0px 0px rgba(255,255,255,0.08), 0px 3px 4px -1px rgba(0,0,0,0.4);
|
|
194
199
|
--goa-shadow-300: 0px 4px 6px -2px rgba(0,0,0,0.4);
|
|
195
200
|
--goa-shadow-400: 0px 8px 16px -4px rgba(0,0,0,0.5);
|
|
196
201
|
--goa-shadow-500: 0px 12px 20px -8px rgba(0,0,0,0.5);
|
package/dist/tokens.css
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on
|
|
3
|
+
* Generated on Wed, 08 Jul 2026 15:43:58 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
:root {
|
|
@@ -239,10 +239,6 @@
|
|
|
239
239
|
--goa-work-side-menu-item-icon-display: flex;
|
|
240
240
|
--goa-work-side-menu-group-item-min-height: 1.75rem;
|
|
241
241
|
--goa-work-side-menu-group-padding: 0 0 0 0.75rem;
|
|
242
|
-
--goa-work-side-menu-bottom-section-shadow-scrolled: 0 -4px 6px -4px rgba(0, 0, 0, 0.1);
|
|
243
|
-
--goa-work-side-menu-bottom-section-shadow: 0 -4px 6px -4px rgba(0, 0, 0, 0);
|
|
244
|
-
--goa-work-side-menu-top-section-shadow-scrolled: 0 4px 6px -4px rgba(0, 0, 0, 0.1);
|
|
245
|
-
--goa-work-side-menu-top-section-shadow: 0 4px 6px -4px rgba(0, 0, 0, 0);
|
|
246
242
|
--goa-work-side-menu-logo: initial;
|
|
247
243
|
--goa-work-side-menu-color-bg: transparent;
|
|
248
244
|
--goa-work-side-menu-width-closed: 4.5rem;
|
|
@@ -274,6 +270,9 @@
|
|
|
274
270
|
--goa-side-menu-item-focus-outline-offset: -3px;
|
|
275
271
|
--goa-scrollable-padding-mobile: 1.5rem;
|
|
276
272
|
--goa-scrollable-padding-desktop: 2rem;
|
|
273
|
+
--goa-scroll-panel-content-shadow-top-bottom: inset 0px 4px 8px -4px rgba(0,0,0,0.175), inset 0px -4px 8px -4px rgba(0,0,0,0.175);
|
|
274
|
+
--goa-scroll-panel-content-shadow-top: inset 0px 4px 8px -4px rgba(0,0,0,0.25);
|
|
275
|
+
--goa-scroll-panel-content-shadow-bottom: inset 0px -4px 8px -4px rgba(0,0,0,0.25);
|
|
277
276
|
--goa-radio-label-color-disabled: #bab7b7;
|
|
278
277
|
--goa-radio-inner-size: 16px;
|
|
279
278
|
--goa-radio-inner-color-error-hover: #ba0000;
|
|
@@ -284,6 +283,7 @@
|
|
|
284
283
|
--goa-notification-banner-padding-tb-compact: 0.9375rem;
|
|
285
284
|
--goa-notification-banner-padding-tb: 1.4375rem;
|
|
286
285
|
--goa-modal-content-wrapper-padding: 0;
|
|
286
|
+
--goa-modal-heading-border-bottom: none;
|
|
287
287
|
--goa-modal-max-width: 480px;
|
|
288
288
|
--goa-modal-content-margin-mobile: 0;
|
|
289
289
|
--goa-modal-content-margin: 0;
|
|
@@ -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;
|
|
@@ -440,6 +443,20 @@
|
|
|
440
443
|
--goa-color-text-secondary: var(--goa-color-greyscale-600);
|
|
441
444
|
--goa-color-text-default: var(--goa-color-greyscale-black);
|
|
442
445
|
--goa-color-interactive-disabled: var(--goa-color-greyscale-300);
|
|
446
|
+
--goa-workspace-layout-mobile-header-padding-left: var(--goa-space-2xl);
|
|
447
|
+
--goa-workspace-layout-mobile-toggle-size: var(--goa-icon-size-xl);
|
|
448
|
+
--goa-workspace-layout-mobile-toggle-left: var(--goa-space-s);
|
|
449
|
+
--goa-workspace-layout-mobile-toggle-top: var(--goa-space-l);
|
|
450
|
+
--goa-workspace-layout-footer-scroll-shadow: var(--goa-shadow-shallow-above);
|
|
451
|
+
--goa-workspace-layout-footer-scroll-border-color: var(--goa-color-greyscale-200);
|
|
452
|
+
--goa-workspace-layout-footer-border-top: var(--goa-border-width-s) solid var(--goa-color-greyscale-200);
|
|
453
|
+
--goa-workspace-layout-footer-bg-color: var(--goa-color-greyscale-white);
|
|
454
|
+
--goa-workspace-layout-header-scroll-shadow: var(--goa-shadow-shallow-below);
|
|
455
|
+
--goa-workspace-layout-header-scroll-border-color: var(--goa-color-greyscale-200);
|
|
456
|
+
--goa-workspace-layout-header-border-bottom: var(--goa-border-width-s) solid var(--goa-color-greyscale-200);
|
|
457
|
+
--goa-workspace-layout-header-bg-color: var(--goa-color-greyscale-white);
|
|
458
|
+
--goa-workspace-layout-card-bg-color: var(--goa-color-greyscale-white);
|
|
459
|
+
--goa-workspace-layout-bg-color: var(--goa-color-greyscale-50);
|
|
443
460
|
--goa-work-side-menu-item-text-color: var(--goa-color-greyscale-600);
|
|
444
461
|
--goa-work-side-menu-item-padding: var(--goa-space-xs) var(--goa-space-xs) var(--goa-space-xs) 0.625rem;
|
|
445
462
|
--goa-work-side-menu-item-color-bg-hover: var(--goa-color-greyscale-100);
|
|
@@ -452,10 +469,6 @@
|
|
|
452
469
|
--goa-work-side-menu-group-item-padding: var(--goa-space-2xs) var(--goa-space-xs);
|
|
453
470
|
--goa-work-side-menu-group-margin: var(--goa-space-xs) 0 0.375rem 1.125rem;
|
|
454
471
|
--goa-work-side-menu-group-border: var(--goa-border-width-xl) solid var(--goa-color-greyscale-100);
|
|
455
|
-
--goa-work-side-menu-bottom-section-border-scrolled: var(--goa-border-width-s) solid var(--goa-color-greyscale-200);
|
|
456
|
-
--goa-work-side-menu-bottom-section-border: var(--goa-border-width-s) solid transparent;
|
|
457
|
-
--goa-work-side-menu-top-section-border-scrolled: var(--goa-border-width-s) solid var(--goa-color-greyscale-200);
|
|
458
|
-
--goa-work-side-menu-top-section-border: var(--goa-border-width-s) solid transparent;
|
|
459
472
|
--goa-work-side-menu-transition-duration-medium: var(--goa-motion-duration-medium-2);
|
|
460
473
|
--goa-work-side-menu-mobile-bg: var(--goa-color-greyscale-50);
|
|
461
474
|
--goa-work-side-menu-text-color: var(--goa-color-greyscale-600);
|
|
@@ -557,6 +570,13 @@
|
|
|
557
570
|
--goa-side-menu-color-bg-menu-item-hover: var(--goa-color-greyscale-100);
|
|
558
571
|
--goa-side-menu-color-bg: var(--goa-color-greyscale-white);
|
|
559
572
|
--goa-side-menu-border-right: var(--goa-border-width-s) solid var(--goa-color-greyscale-150);
|
|
573
|
+
--goa-scroll-panel-footer-scroll-shadow: var(--goa-shadow-shallow-above);
|
|
574
|
+
--goa-scroll-panel-footer-scroll-border: var(--goa-color-greyscale-150);
|
|
575
|
+
--goa-scroll-panel-header-scroll-shadow: var(--goa-shadow-shallow-below);
|
|
576
|
+
--goa-scroll-panel-header-scroll-border: var(--goa-color-greyscale-150);
|
|
577
|
+
--goa-scroll-panel-footer-color-bg: var(--goa-color-greyscale-white);
|
|
578
|
+
--goa-scroll-panel-header-color-bg: var(--goa-color-greyscale-white);
|
|
579
|
+
--goa-scroll-panel-color-bg: var(--goa-color-greyscale-white);
|
|
560
580
|
--goa-radio-reveal-border: var(--goa-border-width-s) solid var(--goa-color-greyscale-200);
|
|
561
581
|
--goa-radio-reveal-padding: var(--goa-space-m) var(--goa-space-l);
|
|
562
582
|
--goa-radio-reveal-margin: var(--goa-space-2xs) 0 0 calc(var(--goa-space-s) - 1px);
|
|
@@ -672,17 +692,17 @@
|
|
|
672
692
|
--goa-modal-callout-information-icon: var(--goa-color-info-default);
|
|
673
693
|
--goa-modal-callout-information-border: var(--goa-color-info-border);
|
|
674
694
|
--goa-modal-callout-information-bg: var(--goa-color-info-light);
|
|
675
|
-
--goa-modal-actions-padding-mobile:
|
|
676
|
-
--goa-modal-content-padding-
|
|
695
|
+
--goa-modal-actions-padding-mobile: var(--goa-space-xs) var(--goa-space-m) var(--goa-space-m) var(--goa-space-m);
|
|
696
|
+
--goa-modal-content-padding-desktop: var(--goa-space-l) var(--goa-space-l) var(--goa-space-xl) var(--goa-space-l);
|
|
697
|
+
--goa-modal-content-padding-mobile: var(--goa-space-xl) var(--goa-space-m) var(--goa-space-xl) var(--goa-space-m);
|
|
677
698
|
--goa-modal-callout-heading-padding-mobile: var(--goa-space-m);
|
|
678
699
|
--goa-modal-heading-padding-mobile: var(--goa-space-m);
|
|
679
700
|
--goa-modal-callout-heading-padding: var(--goa-space-m) var(--goa-space-l);
|
|
680
701
|
--goa-modal-scrollable-padding-mobile: var(--goa-space-m);
|
|
681
702
|
--goa-modal-scrollable-padding-desktop: var(--goa-space-l);
|
|
682
|
-
--goa-modal-actions-padding:
|
|
683
|
-
--goa-modal-content-padding: var(--goa-space-
|
|
703
|
+
--goa-modal-actions-padding: var(--goa-space-xs) var(--goa-space-xl) var(--goa-space-xl) var(--goa-space-xl);
|
|
704
|
+
--goa-modal-content-padding: var(--goa-space-xl) 0 var(--goa-space-xl) 0;
|
|
684
705
|
--goa-modal-heading-padding: 20px var(--goa-space-l);
|
|
685
|
-
--goa-modal-heading-border-bottom: var(--goa-border-width-s) solid var(--goa-color-greyscale-150);
|
|
686
706
|
--goa-modal-border: var(--goa-border-width-s) solid var(--goa-color-greyscale-150);
|
|
687
707
|
--goa-modal-color-bg: var(--goa-color-greyscale-white);
|
|
688
708
|
--goa-modal-overlay-opacity: var(--goa-opacity-background-modal);
|
|
@@ -861,6 +881,20 @@
|
|
|
861
881
|
--goa-file-upload-border-drag: var(--goa-border-width-m) solid var(--goa-color-interactive-hover);
|
|
862
882
|
--goa-file-upload-border-active: var(--goa-border-width-m) solid var(--goa-color-interactive-hover);
|
|
863
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);
|
|
864
898
|
--goa-dropdown-compact-item-padding: 0 var(--goa-space-xs);
|
|
865
899
|
--goa-dropdown-compact-padding: 0 var(--goa-space-s);
|
|
866
900
|
--goa-dropdown-menu-margin: var(--goa-space-xs);
|
|
@@ -1131,6 +1165,7 @@
|
|
|
1131
1165
|
--goa-accordion-color-filled-bg-heading: var(--goa-color-greyscale-100);
|
|
1132
1166
|
--goa-accordion-color-bg-heading: var(--goa-color-greyscale-white);
|
|
1133
1167
|
--goa-input-color-text-default: var(--goa-color-text-default);
|
|
1168
|
+
--goa-workspace-layout-mobile-toggle-color: var(--goa-color-text-default);
|
|
1134
1169
|
--goa-work-side-menu-item-text-size: var(--goa-typography-body-s);
|
|
1135
1170
|
--goa-work-side-menu-item-text-color-hover: var(--goa-color-text-default);
|
|
1136
1171
|
--goa-work-side-menu-item-text-color-current: var(--goa-color-text-default);
|
|
@@ -1240,6 +1275,29 @@
|
|
|
1240
1275
|
--goa-filter-chip-text-color: var(--goa-color-text-default);
|
|
1241
1276
|
--goa-file-upload-instruction-text: var(--goa-typography-body-m);
|
|
1242
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);
|
|
1243
1301
|
--goa-dropdown-compact-item-typography: var(--goa-typography-body-s);
|
|
1244
1302
|
--goa-dropdown-compact-typography: var(--goa-typography-body-s);
|
|
1245
1303
|
--goa-dropdown-menu-border-radius: var(--goa-input-border-radius-input);
|
|
@@ -1327,6 +1385,8 @@
|
|
|
1327
1385
|
--goa-accordion-color-heading-hover: var(--goa-color-text-default);
|
|
1328
1386
|
--goa-accordion-color-heading: var(--goa-color-text-default);
|
|
1329
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);
|
|
1330
1390
|
--goa-dropdown-color-text-placeholder: var(--goa-input-color-text-default);
|
|
1331
1391
|
--goa-dropdown-color-text: var(--goa-input-color-text-default);
|
|
1332
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
|
|
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;
|
|
@@ -676,18 +718,19 @@ $goa-modal-border: 1px solid #e9e9e9;
|
|
|
676
718
|
$goa-modal-content-margin: 0;
|
|
677
719
|
$goa-modal-content-margin-mobile: 0;
|
|
678
720
|
$goa-modal-max-width: 480px;
|
|
679
|
-
$goa-modal-heading-border-bottom:
|
|
721
|
+
$goa-modal-heading-border-bottom: none;
|
|
680
722
|
$goa-modal-heading-padding: 20px 1.5rem;
|
|
681
|
-
$goa-modal-content-padding:
|
|
682
|
-
$goa-modal-actions-padding: 0 2rem 2rem 2rem;
|
|
723
|
+
$goa-modal-content-padding: 2rem 0 2rem 0;
|
|
724
|
+
$goa-modal-actions-padding: 0.5rem 2rem 2rem 2rem;
|
|
683
725
|
$goa-modal-content-wrapper-padding: 0;
|
|
684
726
|
$goa-modal-scrollable-padding-desktop: 1.5rem;
|
|
685
727
|
$goa-modal-scrollable-padding-mobile: 1rem;
|
|
686
728
|
$goa-modal-callout-heading-padding: 1rem 1.5rem;
|
|
687
729
|
$goa-modal-heading-padding-mobile: 1rem;
|
|
688
730
|
$goa-modal-callout-heading-padding-mobile: 1rem;
|
|
689
|
-
$goa-modal-content-padding-mobile:
|
|
690
|
-
$goa-modal-
|
|
731
|
+
$goa-modal-content-padding-mobile: 2rem 1rem 2rem 1rem;
|
|
732
|
+
$goa-modal-content-padding-desktop: 1.5rem 1.5rem 2rem 1.5rem;
|
|
733
|
+
$goa-modal-actions-padding-mobile: 0.5rem 1rem 1rem 1rem;
|
|
691
734
|
$goa-modal-callout-information-bg: #ebf8ff;
|
|
692
735
|
$goa-modal-callout-information-border: #cbeaf7;
|
|
693
736
|
$goa-modal-callout-information-icon: #0077ad;
|
|
@@ -827,6 +870,16 @@ $goa-radio-size: 1.5rem;
|
|
|
827
870
|
$goa-radio-reveal-margin: 0.25rem 0 0 calc(0.75rem - 1px);
|
|
828
871
|
$goa-radio-reveal-padding: 1rem 1.5rem;
|
|
829
872
|
$goa-radio-reveal-border: 1px solid #cdcdcd;
|
|
873
|
+
$goa-scroll-panel-color-bg: #ffffff;
|
|
874
|
+
$goa-scroll-panel-header-color-bg: #ffffff;
|
|
875
|
+
$goa-scroll-panel-footer-color-bg: #ffffff;
|
|
876
|
+
$goa-scroll-panel-content-shadow-bottom: inset 0px -4px 8px -4px rgba(0,0,0,0.25);
|
|
877
|
+
$goa-scroll-panel-content-shadow-top: inset 0px 4px 8px -4px rgba(0,0,0,0.25);
|
|
878
|
+
$goa-scroll-panel-content-shadow-top-bottom: inset 0px 4px 8px -4px rgba(0,0,0,0.175), inset 0px -4px 8px -4px rgba(0,0,0,0.175);
|
|
879
|
+
$goa-scroll-panel-header-scroll-border: #e9e9e9;
|
|
880
|
+
$goa-scroll-panel-header-scroll-shadow: 0px 1px 8px 0px rgba(0,0,0,0.07);
|
|
881
|
+
$goa-scroll-panel-footer-scroll-border: #e9e9e9;
|
|
882
|
+
$goa-scroll-panel-footer-scroll-shadow: 0px -2px 16px 0px rgba(0,0,0,0.1);
|
|
830
883
|
$goa-scrollable-padding-desktop: 2rem;
|
|
831
884
|
$goa-scrollable-padding-mobile: 1.5rem;
|
|
832
885
|
$goa-side-menu-border-right: 1px solid #e9e9e9;
|
|
@@ -988,14 +1041,6 @@ $goa-work-side-menu-popover-shadow: 0px 12px 16px -4px rgba(16,29,40,0.08), 0px
|
|
|
988
1041
|
$goa-work-side-menu-text-color: #6f6f6f;
|
|
989
1042
|
$goa-work-side-menu-mobile-bg: #f8f8f8;
|
|
990
1043
|
$goa-work-side-menu-transition-duration-medium: 300ms;
|
|
991
|
-
$goa-work-side-menu-top-section-border: 1px solid transparent;
|
|
992
|
-
$goa-work-side-menu-top-section-shadow: 0 4px 6px -4px rgba(0, 0, 0, 0);
|
|
993
|
-
$goa-work-side-menu-top-section-border-scrolled: 1px solid #cdcdcd;
|
|
994
|
-
$goa-work-side-menu-top-section-shadow-scrolled: 0 4px 6px -4px rgba(0, 0, 0, 0.1);
|
|
995
|
-
$goa-work-side-menu-bottom-section-border: 1px solid transparent;
|
|
996
|
-
$goa-work-side-menu-bottom-section-shadow: 0 -4px 6px -4px rgba(0, 0, 0, 0);
|
|
997
|
-
$goa-work-side-menu-bottom-section-border-scrolled: 1px solid #cdcdcd;
|
|
998
|
-
$goa-work-side-menu-bottom-section-shadow-scrolled: 0 -4px 6px -4px rgba(0, 0, 0, 0.1);
|
|
999
1044
|
$goa-work-side-menu-group-border: 3px solid #f2f0f0;
|
|
1000
1045
|
$goa-work-side-menu-group-margin: 0.5rem 0 0.375rem 1.125rem;
|
|
1001
1046
|
$goa-work-side-menu-group-padding: 0 0 0 0.75rem;
|
|
@@ -1016,6 +1061,21 @@ $goa-work-side-menu-item-text-color: #6f6f6f;
|
|
|
1016
1061
|
$goa-work-side-menu-item-text-color-current: #000000;
|
|
1017
1062
|
$goa-work-side-menu-item-text-color-hover: #000000;
|
|
1018
1063
|
$goa-work-side-menu-item-text-size: 400 1rem/1.375rem acumin-variable, helvetica-neue, arial, sans-serif;
|
|
1064
|
+
$goa-workspace-layout-bg-color: #f8f8f8;
|
|
1065
|
+
$goa-workspace-layout-card-bg-color: #ffffff;
|
|
1066
|
+
$goa-workspace-layout-header-bg-color: #ffffff;
|
|
1067
|
+
$goa-workspace-layout-header-border-bottom: 1px solid #cdcdcd;
|
|
1068
|
+
$goa-workspace-layout-header-scroll-border-color: #cdcdcd;
|
|
1069
|
+
$goa-workspace-layout-header-scroll-shadow: 0px 1px 8px 0px rgba(0,0,0,0.07);
|
|
1070
|
+
$goa-workspace-layout-footer-bg-color: #ffffff;
|
|
1071
|
+
$goa-workspace-layout-footer-border-top: 1px solid #cdcdcd;
|
|
1072
|
+
$goa-workspace-layout-footer-scroll-border-color: #cdcdcd;
|
|
1073
|
+
$goa-workspace-layout-footer-scroll-shadow: 0px -2px 16px 0px rgba(0,0,0,0.1);
|
|
1074
|
+
$goa-workspace-layout-mobile-toggle-top: 1.5rem;
|
|
1075
|
+
$goa-workspace-layout-mobile-toggle-left: 0.75rem;
|
|
1076
|
+
$goa-workspace-layout-mobile-toggle-size: 2rem;
|
|
1077
|
+
$goa-workspace-layout-mobile-toggle-color: #000000;
|
|
1078
|
+
$goa-workspace-layout-mobile-header-padding-left: 3rem;
|
|
1019
1079
|
$goa-color-interactive-default: #006dcc;
|
|
1020
1080
|
$goa-color-interactive-secondary: #e0f1ff;
|
|
1021
1081
|
$goa-color-interactive-hover: #045092;
|