@qld-gov-au/qgds-bootstrap5 1.0.7 → 1.0.8
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/.storybook/preview.js +2 -1
- package/dist/assets/css/qld.bootstrap.css +1 -1
- package/dist/assets/css/qld.bootstrap.css.map +2 -2
- package/dist/assets/js/handlebars.helpers.bundle.js +1 -1
- package/dist/assets/js/handlebars.helpers.bundle.js.map +3 -3
- package/dist/assets/js/handlebars.helpers.js +8 -1
- package/dist/assets/js/qld.bootstrap.min.js +16 -1
- package/dist/assets/js/qld.bootstrap.min.js.map +4 -4
- package/dist/components/bs5/dateinput/dateinput.hbs +12 -12
- package/dist/components/bs5/header/header.hbs +131 -33
- package/dist/components/bs5/navbar/navbar.hbs +65 -3
- package/dist/components/bs5/select/select.hbs +3 -3
- package/dist/components/bs5/textarea/textarea.hbs +8 -8
- package/dist/components/bs5/textbox/textbox.hbs +7 -6
- package/dist/components/handlebars.helpers.js +8 -1
- package/dist/components/handlebars.init.bundle.js +1 -1
- package/dist/components/handlebars.init.bundle.js.map +3 -3
- package/dist/sample-data/dateinput/dateinput.data.json +1 -0
- package/dist/sample-data/header/header.data.json +245 -31
- package/dist/sample-data/select/select.data.json +1 -0
- package/dist/sample-data/textarea/textarea.data.json +1 -0
- package/dist/sample-data/textbox/textbox.data.json +1 -0
- package/package.json +19 -19
- package/src/components/bs5/dateinput/Dateinput.stories.js +2 -32
- package/src/components/bs5/dateinput/dateinput.data.json +1 -0
- package/src/components/bs5/dateinput/dateinput.hbs +12 -12
- package/src/components/bs5/header/_colours.scss +31 -15
- package/src/components/bs5/header/_icons.scss +1 -1
- package/src/components/bs5/header/_search.json +45 -0
- package/src/components/bs5/header/header.data.json +245 -31
- package/src/components/bs5/header/header.functions.js +143 -8
- package/src/components/bs5/header/header.hbs +131 -33
- package/src/components/bs5/header/header.scss +178 -35
- package/src/components/bs5/navbar/_colours.scss +19 -19
- package/src/components/bs5/navbar/navbar.functions.js +59 -52
- package/src/components/bs5/navbar/navbar.hbs +65 -3
- package/src/components/bs5/navbar/navbar.scss +73 -27
- package/src/components/bs5/select/Select.stories.js +4 -4
- package/src/components/bs5/select/select.data.json +1 -0
- package/src/components/bs5/select/select.hbs +3 -3
- package/src/components/bs5/textarea/Textarea.stories.js +2 -32
- package/src/components/bs5/textarea/textarea.data.json +1 -0
- package/src/components/bs5/textarea/textarea.hbs +8 -8
- package/src/components/bs5/textbox/Textbox.stories.js +2 -15
- package/src/components/bs5/textbox/textInput.scss +10 -2
- package/src/components/bs5/textbox/textbox.data.json +1 -0
- package/src/components/bs5/textbox/textbox.hbs +7 -6
- package/src/js/handlebars.helpers.js +8 -1
- package/src/main.js +26 -2
- package/src/stories/templates/ContentPage/ContentPage.mdx +0 -40
- package/src/stories/templates/ContentPage/ContentPage.stories.js +0 -36
- package/src/stories/templates/LandingPage/LandingPage.mdx +0 -20
- package/src/stories/templates/LandingPage/LandingPage.stories.js +0 -25
|
@@ -8,24 +8,185 @@
|
|
|
8
8
|
"text": {
|
|
9
9
|
"value": "Queensland Government websites"
|
|
10
10
|
},
|
|
11
|
-
"
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
"
|
|
11
|
+
"CTA": [
|
|
12
|
+
{
|
|
13
|
+
"id": "CTAone",
|
|
14
|
+
"url": {
|
|
15
|
+
"value": "#"
|
|
16
|
+
},
|
|
17
|
+
"icon": {
|
|
18
|
+
"value": "ctaIcon"
|
|
19
|
+
},
|
|
20
|
+
"text": {
|
|
21
|
+
"value": "For Queenslanders"
|
|
22
|
+
},
|
|
23
|
+
"dropdown_enabled": true,
|
|
24
|
+
"dropdown_options": {
|
|
25
|
+
"dropdown_type": "list",
|
|
26
|
+
"view_more_label": "Browse all information and services",
|
|
27
|
+
"view_more_url": "https://www.qld.gov.au/queenslanders",
|
|
28
|
+
"dropdown_config": {
|
|
29
|
+
"groups": [
|
|
30
|
+
{
|
|
31
|
+
"action": "_blank",
|
|
32
|
+
"url": "#",
|
|
33
|
+
"label": "Transport and motoring"
|
|
34
|
+
},
|
|
35
|
+
{
|
|
36
|
+
"action": "_blank",
|
|
37
|
+
"url": "#",
|
|
38
|
+
"label": "Employment and jobs"
|
|
39
|
+
},
|
|
40
|
+
{
|
|
41
|
+
"action": "_blank",
|
|
42
|
+
"url": "#",
|
|
43
|
+
"label": "Education and training"
|
|
44
|
+
},
|
|
45
|
+
{
|
|
46
|
+
"action": "_blank",
|
|
47
|
+
"url": "#",
|
|
48
|
+
"label": "Queensland and its government"
|
|
49
|
+
},
|
|
50
|
+
{
|
|
51
|
+
"action": "_blank",
|
|
52
|
+
"url": "#",
|
|
53
|
+
"label": "Health and wellbeing"
|
|
54
|
+
},
|
|
55
|
+
{
|
|
56
|
+
"action": "_blank",
|
|
57
|
+
"url": "#",
|
|
58
|
+
"label": "Community support"
|
|
59
|
+
}
|
|
60
|
+
],
|
|
61
|
+
"view_more": true,
|
|
62
|
+
"view_more_options": {
|
|
63
|
+
"url": "#",
|
|
64
|
+
"label": "View more",
|
|
65
|
+
"target": "_blank"
|
|
66
|
+
}
|
|
67
|
+
}
|
|
68
|
+
}
|
|
15
69
|
},
|
|
16
|
-
|
|
17
|
-
"
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
70
|
+
{
|
|
71
|
+
"id": "CTAtwo",
|
|
72
|
+
"url": {
|
|
73
|
+
"value": "#"
|
|
74
|
+
},
|
|
75
|
+
"icon": {
|
|
76
|
+
"value": "ctaIcon"
|
|
77
|
+
},
|
|
78
|
+
"text": {
|
|
79
|
+
"value": "Business and Industry"
|
|
80
|
+
},
|
|
81
|
+
"dropdown_enabled": true,
|
|
82
|
+
"dropdown_options": {
|
|
83
|
+
"dropdown_type": "list",
|
|
84
|
+
"view_more_label": "All categories",
|
|
85
|
+
"view_more_url": "https://www.business.qld.gov.au/",
|
|
86
|
+
"dropdown_config": {
|
|
87
|
+
"groups": [
|
|
88
|
+
{
|
|
89
|
+
"action": "_blank",
|
|
90
|
+
"url": "#",
|
|
91
|
+
"label": "Starting a business"
|
|
92
|
+
},
|
|
93
|
+
{
|
|
94
|
+
"action": "_blank",
|
|
95
|
+
"url": "#",
|
|
96
|
+
"label": "Running a business"
|
|
97
|
+
},
|
|
98
|
+
{
|
|
99
|
+
"action": "_blank",
|
|
100
|
+
"url": "#",
|
|
101
|
+
"label": "Employing people"
|
|
102
|
+
},
|
|
103
|
+
{
|
|
104
|
+
"action": "_blank",
|
|
105
|
+
"url": "#",
|
|
106
|
+
"label": "Payroll tax"
|
|
107
|
+
},
|
|
108
|
+
{
|
|
109
|
+
"action": "_blank",
|
|
110
|
+
"url": "#",
|
|
111
|
+
"label": "Industries"
|
|
112
|
+
},
|
|
113
|
+
{
|
|
114
|
+
"action": "_blank",
|
|
115
|
+
"url": "#",
|
|
116
|
+
"label": "Investing in Queensland"
|
|
117
|
+
}
|
|
118
|
+
],
|
|
119
|
+
"view_more": true,
|
|
120
|
+
"view_more_options": {
|
|
121
|
+
"url": "#",
|
|
122
|
+
"label": "View more",
|
|
123
|
+
"target": "_blank"
|
|
124
|
+
}
|
|
125
|
+
}
|
|
126
|
+
}
|
|
24
127
|
},
|
|
25
|
-
|
|
26
|
-
"
|
|
128
|
+
{
|
|
129
|
+
"id": "CTAthree",
|
|
130
|
+
"url": {
|
|
131
|
+
"value": "#"
|
|
132
|
+
},
|
|
133
|
+
"icon": {
|
|
134
|
+
"value": "ctaIcon"
|
|
135
|
+
},
|
|
136
|
+
"text": {
|
|
137
|
+
"value": "Login"
|
|
138
|
+
},
|
|
139
|
+
"dropdown_enabled": true,
|
|
140
|
+
"dropdown_options": {
|
|
141
|
+
"dropdown_type": "form",
|
|
142
|
+
"dropdown_config": {
|
|
143
|
+
"groups": [
|
|
144
|
+
{
|
|
145
|
+
"heading": "Log in to For government",
|
|
146
|
+
"content": "Most employees can log in using single sign on (SSO).",
|
|
147
|
+
"usesButton": "true",
|
|
148
|
+
"actionType": "button",
|
|
149
|
+
"action": {
|
|
150
|
+
"button_action": "#",
|
|
151
|
+
"button_targetAttr": "_blank",
|
|
152
|
+
"button_label": "Login"
|
|
153
|
+
},
|
|
154
|
+
"links": [
|
|
155
|
+
{
|
|
156
|
+
"action": "_blank",
|
|
157
|
+
"label": "If your agency doesn't use SSO.",
|
|
158
|
+
"url": "https://www.forgov.qld.gov.au/user#log-in"
|
|
159
|
+
}
|
|
160
|
+
]
|
|
161
|
+
},
|
|
162
|
+
{
|
|
163
|
+
"heading": "Select your agency",
|
|
164
|
+
"content": "See information relevant to your agency.",
|
|
165
|
+
"actionType": "select",
|
|
166
|
+
"options": [
|
|
167
|
+
{
|
|
168
|
+
"value": "agency 1"
|
|
169
|
+
}
|
|
170
|
+
]
|
|
171
|
+
}
|
|
172
|
+
],
|
|
173
|
+
"examples": [
|
|
174
|
+
{
|
|
175
|
+
"heading": "For employees",
|
|
176
|
+
"actionType": "list",
|
|
177
|
+
"list_items": [
|
|
178
|
+
{
|
|
179
|
+
"action": "_self",
|
|
180
|
+
"label": "Your profile",
|
|
181
|
+
"href": "#"
|
|
182
|
+
}
|
|
183
|
+
]
|
|
184
|
+
}
|
|
185
|
+
]
|
|
186
|
+
}
|
|
187
|
+
}
|
|
27
188
|
}
|
|
28
|
-
|
|
189
|
+
]
|
|
29
190
|
},
|
|
30
191
|
"siteHeader": {
|
|
31
192
|
"config": {
|
|
@@ -49,13 +210,20 @@
|
|
|
49
210
|
},
|
|
50
211
|
"siteSearchAsset": {
|
|
51
212
|
"value": "#",
|
|
52
|
-
"
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
"
|
|
213
|
+
"placeholder": "",
|
|
214
|
+
"label": "",
|
|
215
|
+
"formAction": {
|
|
216
|
+
"url": "https://www.forgov.qld.gov.au/search"
|
|
56
217
|
},
|
|
57
|
-
"
|
|
58
|
-
"
|
|
218
|
+
"options": {
|
|
219
|
+
"icons": {
|
|
220
|
+
"menu-icon": "qld__icon__mobile-menu",
|
|
221
|
+
"search-icon": "qld__icon__search",
|
|
222
|
+
"search-close-icon": "qld__icon__close"
|
|
223
|
+
},
|
|
224
|
+
"borderStyle": {
|
|
225
|
+
"full": true
|
|
226
|
+
}
|
|
59
227
|
}
|
|
60
228
|
}
|
|
61
229
|
},
|
|
@@ -74,7 +242,11 @@
|
|
|
74
242
|
"value": "#"
|
|
75
243
|
},
|
|
76
244
|
"text": {
|
|
77
|
-
"value": "
|
|
245
|
+
"value": "List 1"
|
|
246
|
+
},
|
|
247
|
+
"dropdown_enabled": true,
|
|
248
|
+
"dropdown_options": {
|
|
249
|
+
"dropdown_type": "list"
|
|
78
250
|
}
|
|
79
251
|
},
|
|
80
252
|
"mainNavCtaTwo": {
|
|
@@ -83,7 +255,43 @@
|
|
|
83
255
|
"value": "#"
|
|
84
256
|
},
|
|
85
257
|
"text": {
|
|
86
|
-
"value": "
|
|
258
|
+
"value": "List 2"
|
|
259
|
+
},
|
|
260
|
+
"dropdown_enabled": true,
|
|
261
|
+
"dropdown_options": {
|
|
262
|
+
"dropdown_type": "list"
|
|
263
|
+
}
|
|
264
|
+
},
|
|
265
|
+
"mainNavCtaThree": {
|
|
266
|
+
"value": "#",
|
|
267
|
+
"icon": {
|
|
268
|
+
"value": "ctaIcon"
|
|
269
|
+
},
|
|
270
|
+
"text": {
|
|
271
|
+
"value": "Login"
|
|
272
|
+
},
|
|
273
|
+
"dropdown_enabled": true,
|
|
274
|
+
"dropdown_options": {
|
|
275
|
+
"dropdown_type": "form",
|
|
276
|
+
"dropdown_config": {
|
|
277
|
+
"groups": [
|
|
278
|
+
{
|
|
279
|
+
"heading": "Log in to For government",
|
|
280
|
+
"button_action": "#",
|
|
281
|
+
"button_targetAttr": "_blank",
|
|
282
|
+
"button_label": "Login"
|
|
283
|
+
}
|
|
284
|
+
],
|
|
285
|
+
"examples": [
|
|
286
|
+
{
|
|
287
|
+
"heading": "For employees",
|
|
288
|
+
"content": "See information relevant to your agency.",
|
|
289
|
+
"button_action": "#",
|
|
290
|
+
"button_targetAttr": "_blank",
|
|
291
|
+
"button_label": "Login"
|
|
292
|
+
}
|
|
293
|
+
]
|
|
294
|
+
}
|
|
87
295
|
}
|
|
88
296
|
}
|
|
89
297
|
},
|
|
@@ -95,8 +303,7 @@
|
|
|
95
303
|
"url": {
|
|
96
304
|
"value": "https://qld.gov.au"
|
|
97
305
|
},
|
|
98
|
-
"logo": {
|
|
99
|
-
},
|
|
306
|
+
"logo": {},
|
|
100
307
|
"secondaryType": {
|
|
101
308
|
"logo": {
|
|
102
309
|
"value": ""
|
|
@@ -111,13 +318,20 @@
|
|
|
111
318
|
},
|
|
112
319
|
"siteSearchAsset": {
|
|
113
320
|
"value": "#",
|
|
114
|
-
"
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
"
|
|
321
|
+
"placeholder": "Placeholder",
|
|
322
|
+
"label": "Label",
|
|
323
|
+
"formAction": {
|
|
324
|
+
"url": "https://www.forgov.qld.gov.au/search"
|
|
118
325
|
},
|
|
119
|
-
"
|
|
120
|
-
"
|
|
326
|
+
"options": {
|
|
327
|
+
"icons": {
|
|
328
|
+
"menu-icon": "qld__icon__mobile-menu",
|
|
329
|
+
"search-icon": "qld__icon__search",
|
|
330
|
+
"search-close-icon": "qld__icon__close"
|
|
331
|
+
},
|
|
332
|
+
"borderStyle": {
|
|
333
|
+
"full": false
|
|
334
|
+
}
|
|
121
335
|
}
|
|
122
336
|
}
|
|
123
337
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@qld-gov-au/qgds-bootstrap5",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.8",
|
|
4
4
|
"description": "",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
"main": "index.js",
|
|
10
10
|
"scripts": {
|
|
11
11
|
"start": "npm run build",
|
|
12
|
-
"lint": "eslint --fix --ext .js,.json --ignore-pattern 'docs/*' --ignore-pattern 'dist/*' .",
|
|
12
|
+
"lint": "eslint --fix --ext .js,.json --ignore-pattern 'docs/*' --ignore-pattern 'dist/*' --ignore-pattern 'storybook-static/*' .",
|
|
13
13
|
"build": "node esbuild.js",
|
|
14
14
|
"test": "echo 'no tests yet'",
|
|
15
15
|
"watch": "node esbuild.js --watch",
|
|
@@ -39,23 +39,22 @@
|
|
|
39
39
|
"dependencies": {
|
|
40
40
|
"@fortawesome/fontawesome-free": "^6.5.2",
|
|
41
41
|
"bootstrap": "^5.3.1",
|
|
42
|
-
"material-symbols": "^0.
|
|
42
|
+
"material-symbols": "^0.18.0"
|
|
43
43
|
},
|
|
44
44
|
"devDependencies": {
|
|
45
|
-
"
|
|
46
|
-
"@
|
|
47
|
-
"@storybook/addon-
|
|
48
|
-
"@storybook/addon-
|
|
49
|
-
"@storybook/addon-
|
|
50
|
-
"@storybook/addon-
|
|
51
|
-
"@storybook/
|
|
52
|
-
"@storybook/
|
|
53
|
-
"@storybook/
|
|
54
|
-
"@storybook/html": "^8.1.
|
|
55
|
-
"@storybook/
|
|
56
|
-
"@storybook/
|
|
57
|
-
"@storybook/
|
|
58
|
-
"@storybook/theming": "^8.1.0",
|
|
45
|
+
"@chromatic-com/storybook": "^1.4.0",
|
|
46
|
+
"@storybook/addon-essentials": "^8.1.1",
|
|
47
|
+
"@storybook/addon-interactions": "^8.1.1",
|
|
48
|
+
"@storybook/addon-links": "^8.1.1",
|
|
49
|
+
"@storybook/addon-mdx-gfm": "^8.1.1",
|
|
50
|
+
"@storybook/addon-themes": "^8.1.1",
|
|
51
|
+
"@storybook/blocks": "^8.1.1",
|
|
52
|
+
"@storybook/cli": "^8.1.1",
|
|
53
|
+
"@storybook/html": "^8.1.1",
|
|
54
|
+
"@storybook/html-vite": "^8.1.1",
|
|
55
|
+
"@storybook/manager-api": "^8.1.1",
|
|
56
|
+
"@storybook/test": "^8.1.1",
|
|
57
|
+
"@storybook/theming": "^8.1.1",
|
|
59
58
|
"@stylistic/eslint-plugin-js": "2.1.0",
|
|
60
59
|
"@vitejs/plugin-vue": "5.0.4",
|
|
61
60
|
"@whitespace/storybook-addon-html": "^6.1.1",
|
|
@@ -66,10 +65,11 @@
|
|
|
66
65
|
"esbuild-plugin-copy": "^2.1.1",
|
|
67
66
|
"esbuild-plugin-eslint": "^0.3.7",
|
|
68
67
|
"esbuild-plugin-handlebars": "1.0.3",
|
|
69
|
-
"esbuild-sass-plugin": "3.
|
|
68
|
+
"esbuild-sass-plugin": "3.3.0",
|
|
70
69
|
"eslint": "8.57.0",
|
|
71
70
|
"eslint-plugin-json": "^3.1.0",
|
|
72
71
|
"eslint-plugin-storybook": "^0.8.0",
|
|
72
|
+
"handlebars": "4.7.8",
|
|
73
73
|
"live-server": "1.2.2",
|
|
74
74
|
"minimist": "^1.2.8",
|
|
75
75
|
"npm-run-all2": "^6.1.2",
|
|
@@ -79,7 +79,7 @@
|
|
|
79
79
|
"raw-loader": "^4.0.2",
|
|
80
80
|
"rimraf": "^5.0.7",
|
|
81
81
|
"sass": "^1.76.0",
|
|
82
|
-
"storybook": "^8.1.
|
|
82
|
+
"storybook": "^8.1.1",
|
|
83
83
|
"vite": "^5.2.11",
|
|
84
84
|
"watch": "^1.0.2"
|
|
85
85
|
},
|
|
@@ -22,36 +22,6 @@ export default {
|
|
|
22
22
|
|
|
23
23
|
//https://storybook.js.org/docs/api/arg-types
|
|
24
24
|
argTypes: {
|
|
25
|
-
customClass: {
|
|
26
|
-
name: "Classes",
|
|
27
|
-
description: 'Settable classes for the component',
|
|
28
|
-
control: {
|
|
29
|
-
type: "check",
|
|
30
|
-
labels: {
|
|
31
|
-
"form-style-filled": "Filled",
|
|
32
|
-
},
|
|
33
|
-
},
|
|
34
|
-
options: [
|
|
35
|
-
"form-style-filled",
|
|
36
|
-
],
|
|
37
|
-
},
|
|
38
|
-
states: {
|
|
39
|
-
name: "States",
|
|
40
|
-
description: `Valid/Invalid states`,
|
|
41
|
-
control: {
|
|
42
|
-
type: "radio",
|
|
43
|
-
labels: {
|
|
44
|
-
"default": "Default",
|
|
45
|
-
"qld-input-success": "Success",
|
|
46
|
-
"qld-input-error": "Error",
|
|
47
|
-
},
|
|
48
|
-
},
|
|
49
|
-
options: [
|
|
50
|
-
"default",
|
|
51
|
-
"qld-input-success",
|
|
52
|
-
"qld-input-error",
|
|
53
|
-
],
|
|
54
|
-
},
|
|
55
25
|
},
|
|
56
26
|
};
|
|
57
27
|
|
|
@@ -116,7 +86,7 @@ export const Disabled = {
|
|
|
116
86
|
export const Valid = {
|
|
117
87
|
args: {
|
|
118
88
|
...defaultdata,
|
|
119
|
-
...{
|
|
89
|
+
...{customClass: "qld-input-success"},
|
|
120
90
|
},
|
|
121
91
|
};
|
|
122
92
|
|
|
@@ -126,6 +96,6 @@ export const Valid = {
|
|
|
126
96
|
export const Invalid = {
|
|
127
97
|
args: {
|
|
128
98
|
...defaultdata,
|
|
129
|
-
...{
|
|
99
|
+
...{customClass: "qld-input-error"},
|
|
130
100
|
},
|
|
131
101
|
};
|
|
@@ -15,13 +15,13 @@
|
|
|
15
15
|
<span class="qld-hint-text" id="example-1-hint">{{hint-text}}</span>
|
|
16
16
|
{{/if}}
|
|
17
17
|
|
|
18
|
-
{{#contains "qld-input-success"
|
|
18
|
+
{{#contains "qld-input-success" customClass}}
|
|
19
19
|
<span id="text-field-success" class="qld-input-success">
|
|
20
20
|
{{successMessageText}}
|
|
21
21
|
</span>
|
|
22
22
|
{{/contains}}
|
|
23
23
|
|
|
24
|
-
{{#contains "qld-input-error"
|
|
24
|
+
{{#contains "qld-input-error" customClass}}
|
|
25
25
|
<span id="text-field-error" class="qld-input-error">
|
|
26
26
|
{{errorMessageText}}
|
|
27
27
|
</span>
|
|
@@ -34,9 +34,9 @@
|
|
|
34
34
|
<div>
|
|
35
35
|
<input aria-required="true" aria-labelledby="dategroup-label" placeholder="{{day-placeholder}}" type="text"
|
|
36
36
|
inputmode="numeric" maxlength="2"
|
|
37
|
-
class="qld-text-input form-control dayinput {{customClass}} {{
|
|
38
|
-
|
|
39
|
-
|
|
37
|
+
class="qld-text-input form-control dayinput {{customClass}} {{#if isFilled}}form-style-filled{{/if}}" id="dayinput" ref="day"
|
|
38
|
+
aria-invalid="false" {{#if isDisabled}}disabled{{/if}} {{#if isRequired}}required aria-required="true"
|
|
39
|
+
{{/if}}>
|
|
40
40
|
</div>
|
|
41
41
|
</div>
|
|
42
42
|
<!-- month group -->
|
|
@@ -45,9 +45,9 @@
|
|
|
45
45
|
<div>
|
|
46
46
|
<input aria-required="true" aria-labelledby="dategroup-label" placeholder="{{month-placeholder}}"
|
|
47
47
|
type="text" inputmode="numeric" maxlength="2"
|
|
48
|
-
class="qld-text-input form-control monthinput {{customClass}} {{
|
|
49
|
-
|
|
50
|
-
|
|
48
|
+
class="qld-text-input form-control monthinput {{customClass}} {{#if isFilled}}form-style-filled{{/if}}" id="monthinput" ref="month"
|
|
49
|
+
aria-invalid="false" {{#if isDisabled}}disabled{{/if}} {{#if isRequired}}required aria-required="true"
|
|
50
|
+
{{/if}}>
|
|
51
51
|
</div>
|
|
52
52
|
</div>
|
|
53
53
|
<!-- year group -->
|
|
@@ -56,9 +56,9 @@
|
|
|
56
56
|
<div class="year-label">
|
|
57
57
|
<input aria-required="true" aria-labelledby="dategroup-label qld-text-input-label"
|
|
58
58
|
placeholder="{{year-placeholder}}" type="text" inputmode="numeric" maxlength="4"
|
|
59
|
-
class="qld-text-input form-control yearinput {{customClass}} {{
|
|
60
|
-
ref="year" aria-invalid="false" {{#if isDisabled}}disabled{{/if}} {{#if
|
|
61
|
-
aria-required="true" {{/if}}>
|
|
59
|
+
class="qld-text-input form-control yearinput {{customClass}} {{#if isFilled}}form-style-filled{{/if}}"
|
|
60
|
+
id="yearinput" ref="year" aria-invalid="false" {{#if isDisabled}}disabled{{/if}} {{#if
|
|
61
|
+
isRequired}}required aria-required="true" {{/if}}>
|
|
62
62
|
</div>
|
|
63
63
|
</div>
|
|
64
|
-
</div>
|
|
64
|
+
</div>
|
|
@@ -46,7 +46,6 @@
|
|
|
46
46
|
// ------------------------------------------------------------------------------------------------------------------
|
|
47
47
|
// 2. Second hand variables (each variant, default, light, dark, dark-alt)
|
|
48
48
|
// ------------------------------------------------------------------------------------------------------------------
|
|
49
|
-
|
|
50
49
|
// Search
|
|
51
50
|
--#{$prefix}header-site-search-bg: var(--#{$prefix}header-color-light-background__shade);
|
|
52
51
|
--#{$prefix}header-site-search-btn-color: var(--#{$prefix}header-color-dark-text);
|
|
@@ -55,6 +54,7 @@
|
|
|
55
54
|
--#{$prefix}header-site-search-icon-color:var(--#{$prefix}header-color-light-text__muted);
|
|
56
55
|
--#{$prefix}header-site-search-text-color:var(--#{$prefix}header-color-light-text);
|
|
57
56
|
|
|
57
|
+
// Search dark
|
|
58
58
|
--#{$prefix}header-dark-site-search-bg: var(--#{$prefix}header-color-dark-background__shade);
|
|
59
59
|
--#{$prefix}header-dark-site-search-btn-color: var(--#{$prefix}header-color-light-text);
|
|
60
60
|
--#{$prefix}header-dark-site-search-btn-bg: var(--#{$prefix}header-color-light-designAccent);
|
|
@@ -67,10 +67,10 @@
|
|
|
67
67
|
--#{$prefix}header_bg: var(--#{$prefix}header-color-light-background);
|
|
68
68
|
|
|
69
69
|
// Skip links
|
|
70
|
-
--#{$prefix}header_skip-link_color: var(--#{$prefix}header-color-
|
|
71
|
-
--#{$prefix}header_skip-link_focus_outline_color: var(--#{$prefix}header-color-
|
|
72
|
-
--#{$prefix}header_skip-link_focus_text_color: var(--#{$prefix}header-color-
|
|
73
|
-
--#{$prefix}header_skip-link_focus_bg_color: var(--#{$prefix}header-color-
|
|
70
|
+
--#{$prefix}header_skip-link_color: var(--#{$prefix}header-color-dark-link);
|
|
71
|
+
--#{$prefix}header_skip-link_focus_outline_color: var(--#{$prefix}header-color-dark-focus);
|
|
72
|
+
--#{$prefix}header_skip-link_focus_text_color: var(--#{$prefix}header-color-dark-link);
|
|
73
|
+
--#{$prefix}header_skip-link_focus_bg_color: var(--#{$prefix}header-color-dark-background__shade);
|
|
74
74
|
|
|
75
75
|
// Pre-header bar
|
|
76
76
|
--#{$prefix}header__pre-header_text_color: var(--#{$prefix}header-color-dark-text);
|
|
@@ -89,6 +89,10 @@
|
|
|
89
89
|
--#{$prefix}header__cta-wrapper__cta-link_text_color: var(--#{$prefix}header-color-dark-link);
|
|
90
90
|
--#{$prefix}header__cta-wrapper__cta-link-icon_color: var(--#{$prefix}header-color-dark-alt-button);
|
|
91
91
|
--#{$prefix}header__cta-wrapper__cta-link-icon_hover_color: var(--#{$prefix}header-color-dark-alt-button__hover);
|
|
92
|
+
--#{$prefix}header__cta-wrapper__cta-link_dropdown_bg_color: var(--#{$prefix}header-color-dark-background);
|
|
93
|
+
|
|
94
|
+
--#{$prefix}header__CTA_text_color: var(--#{$prefix}header-color-dark-link);
|
|
95
|
+
--#{$prefix}header__CTA_border_color: var(--#{$prefix}header-color-dark-border);
|
|
92
96
|
|
|
93
97
|
// Toggle main navigation
|
|
94
98
|
--#{$prefix}header__toggle-main-nav_text_color: var(--#{$prefix}header-color-dark-link);
|
|
@@ -121,12 +125,16 @@
|
|
|
121
125
|
--site-search-input-focus-color: var(--#{$prefix}header-color-light-focus);
|
|
122
126
|
--site-search-text-color: var(--#{$prefix}header-site-search-text-color);
|
|
123
127
|
|
|
128
|
+
// Suggestions colours
|
|
129
|
+
--#{$prefix}header_site-search-suggestions-bg: var(--#{$prefix}header-color-light-background);
|
|
130
|
+
--#{$prefix}header_site-search-suggestions-hover: var(--#{$prefix}header-color-light-background__shade);
|
|
131
|
+
--#{$prefix}header_site-search-suggestions-hover__border_color: var(--#{$prefix}header-color-light-designAccent);
|
|
132
|
+
|
|
124
133
|
// ------------------------------------------------------------------------------------------------------------------
|
|
125
134
|
// 3. Dark/dark-alt modes
|
|
126
135
|
// ------------------------------------------------------------------------------------------------------------------
|
|
127
136
|
.dark &,
|
|
128
137
|
.dark-alt & {
|
|
129
|
-
|
|
130
138
|
// Root (dark/dark-alt)
|
|
131
139
|
--#{$prefix}header_color: var(--#{$prefix}header-color-dark-text);
|
|
132
140
|
|
|
@@ -158,17 +166,33 @@
|
|
|
158
166
|
--#{$prefix}header__toggle-main-nav__hover_svg_color: var(--#{$prefix}header-color-dark-alt-button__hover);
|
|
159
167
|
--#{$prefix}header__toggle-main-nav__focus_outline_color: var(--#{$prefix}header-color-dark-focus);
|
|
160
168
|
--#{$prefix}header__toggle-main-nav__svg_color: var(--#{$prefix}header-color-dark-alt-button);
|
|
169
|
+
|
|
161
170
|
--#{$prefix}header__brand__anchor__hover_text_color: var(--#{$prefix}header-color-dark-link);
|
|
162
171
|
--#{$prefix}header__brand__anchor__hover_brand-image__text_color: var(--#{$prefix}header-color-dark-link);
|
|
163
172
|
--#{$prefix}header__brand__anchor__hover_headingsubline__text_color: var(--#{$prefix}header-color-dark-link);
|
|
164
173
|
--#{$prefix}header__brand__anchor__hover_brand-image__filter: drop-shadow(0px 2px 5px rgba(0, 0, 0, 0.08)), drop-shadow(0px 13px 20px rgba(0, 0, 0, 0.08));
|
|
165
174
|
--#{$prefix}header__brand-image__subtype__border_color: var(--#{$prefix}header-color-dark-designAccent);
|
|
166
175
|
--#{$prefix}header__brand-image__subtype__text_color: var(--#{$prefix}header-color-dark-siteTitle);
|
|
176
|
+
|
|
167
177
|
--#{$prefix}header__site-name__heading__text_color: var(--#{$prefix}header-color-dark-siteTitle);
|
|
168
178
|
--#{$prefix}header__site-name__subline__text_color: var(--#{$prefix}header-color-dark-text__muted);
|
|
169
179
|
|
|
170
180
|
// COA
|
|
171
181
|
--#{$prefix}header__brand-image__crest_fill: var(--#{$prefix}header-color-dark-crest-fill);
|
|
182
|
+
|
|
183
|
+
// Search (dark/dark/alt)
|
|
184
|
+
--site-search-bg: var(--#{$prefix}header-dark-site-search-bg);
|
|
185
|
+
--site-search-btn-color: var(--#{$prefix}header-dark-site-search-btn-color);
|
|
186
|
+
--site-search-btn-bg: var(--#{$prefix}header-dark-site-search-btn-bg);
|
|
187
|
+
--site-search-border-color: var(--#{$prefix}header-dark-site-search-border-color);
|
|
188
|
+
--site-search-icon-color: var(--#{$prefix}header-dark-site-search-icon-color);
|
|
189
|
+
--site-search-input-color: var(--#{$prefix}header-dark-site-search-text-color);
|
|
190
|
+
--site-search-text-color: var(--#{$prefix}header-site-search-text-color);
|
|
191
|
+
|
|
192
|
+
// Suggestions colours
|
|
193
|
+
--#{$prefix}header_site-search-suggestions-bg: var(--#{$prefix}header-color-dark-alt-background);
|
|
194
|
+
--#{$prefix}header_site-search-suggestions-hover: var(--#{$prefix}header-color-dark-background__shade);
|
|
195
|
+
--#{$prefix}header_site-search-suggestions-hover__border_color: var(--#{$prefix}header-color-dark-designAccent);
|
|
172
196
|
}
|
|
173
197
|
|
|
174
198
|
.dark-alt & {
|
|
@@ -179,14 +203,6 @@
|
|
|
179
203
|
.dark & {
|
|
180
204
|
--#{$prefix}header_bg: var(--#{$prefix}header-color-dark-background);
|
|
181
205
|
--#{$prefix}header__pre-header_bg_color: var(--#{$prefix}header-color-dark-alt-background);
|
|
182
|
-
|
|
183
|
-
// Search (dark/dark/alt)
|
|
184
|
-
--site-search-bg: var(--#{$prefix}header-dark-site-search-bg);
|
|
185
|
-
--site-search-btn-color: var(--#{$prefix}header-dark-site-search-btn-color);
|
|
186
|
-
--site-search-btn-bg: var(--#{$prefix}header-dark-site-search-btn-bg);
|
|
187
|
-
--site-search-border-color: var(--#{$prefix}header-dark-site-search-border-color);
|
|
188
|
-
--site-search-icon-color: var(--#{$prefix}header-dark-site-search-icon-color);
|
|
189
|
-
--site-search-input-color: var(--#{$prefix}header-dark-site-search-text-color);
|
|
190
|
-
--site-search-text-color: var(--#{$prefix}header-site-search-text-color);
|
|
206
|
+
--#{$prefix}header__cta-wrapper__cta-link_dropdown_bg_color: var(--#{$prefix}header-color-dark-alt-background);
|
|
191
207
|
}
|
|
192
208
|
}
|