@qld-gov-au/qgds-bootstrap5 2.0.4 → 2.0.6

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.
Files changed (37) hide show
  1. package/.esbuild/helpers/scssOverrideTheme.js +40 -0
  2. package/.esbuild/plugins/qgds-plugin-handlebar-partial-builder.js +4 -0
  3. package/.storybook/dynamicThemeDecorator.js +159 -0
  4. package/.storybook/main.js +8 -0
  5. package/.storybook/preview.js +19 -0
  6. package/README.md +26 -18
  7. package/dist/README.md +26 -18
  8. package/dist/assets/components/bs5/head/head.hbs +1 -1
  9. package/dist/assets/css/qld.bootstrap.css +1 -1
  10. package/dist/assets/css/qld.bootstrap.css.map +3 -3
  11. package/dist/assets/css/qld.bootstrap.legacy.css +2 -0
  12. package/dist/assets/css/qld.bootstrap.legacy.css.map +7 -0
  13. package/dist/assets/js/handlebars.init.min.js +1 -1
  14. package/dist/assets/node/handlebars.init.min.js +1 -1
  15. package/dist/components/bs5/head/head.hbs +1 -1
  16. package/dist/package.json +6 -2
  17. package/esbuild.js +40 -10
  18. package/package.json +6 -2
  19. package/src/components/bs5/accordion/accordion.scss +3 -3
  20. package/src/components/bs5/button/button.scss +25 -45
  21. package/src/components/bs5/callout/callout.stories.js +15 -21
  22. package/src/components/bs5/card/card--icon-list-footer.stories.js +171 -0
  23. package/src/components/bs5/card/card.scss +20 -5
  24. package/src/components/bs5/footer/footer.scss +3 -7
  25. package/src/components/bs5/header/header.scss +8 -0
  26. package/src/components/bs5/pageLayout/pageLayout.stories.js +2 -2
  27. package/src/components/bs5/pagination/pagination.scss +290 -274
  28. package/src/components/bs5/pagination/pagination.stories.js +18 -33
  29. package/src/components/bs5/searchInput/searchInput.test.js +21 -5
  30. package/src/components/bs5/textbox/textInput.scss +55 -39
  31. package/src/components/bs5/video/video.scss +41 -27
  32. package/src/css/main.legacy.scss +19 -0
  33. package/src/css/main.scss +17 -0
  34. package/src/css/qld-tokens-legacy.scss +94 -0
  35. package/src/css/qld-tokens.scss +110 -0
  36. package/src/css/qld-variables.scss +43 -29
  37. package/src/css/readme.md +6 -1
@@ -50,9 +50,9 @@
50
50
  // Video styled card
51
51
  .video-overlay {
52
52
  --#{$prefix}video-nav-bg: var(--#{$prefix}light-action-primary);
53
- --#{$prefix}video-nav-bg-rgb: 9, 84, 159;
53
+ --#{$prefix}video-nav-bg-rgb: 0, 94, 184;
54
54
  --#{$prefix}video-nav-bg-hover: var(--#{$prefix}light-action-primary-hover);
55
- --#{$prefix}video-nav-bg-hover-rgb: 0, 62, 125;
55
+ --#{$prefix}video-nav-bg-hover-rgb: 0, 62, 150;
56
56
  --#{$prefix}video-nav-bg-opacity: 0.9;
57
57
  --#{$prefix}video-nav-color: var(--#{$prefix}dark-text);
58
58
  --#{$prefix}video-clock-icon-size: 1.25rem;
@@ -144,11 +144,11 @@
144
144
  }
145
145
  .video-overlay {
146
146
  --#{$prefix}video-nav-bg: var(--#{$prefix}dark-action-primary);
147
- --#{$prefix}video-nav-bg-rgb: 120, 186, 0;
147
+ --#{$prefix}video-nav-bg-rgb: 132, 211, 255;
148
148
  --#{$prefix}video-nav-bg-hover: var(
149
149
  --#{$prefix}dark-action-primary-hover
150
150
  );
151
- --#{$prefix}video-nav-bg-hover-rgb: 173, 211, 63;
151
+ --#{$prefix}video-nav-bg-hover-rgb: 166, 247, 255;
152
152
  --#{$prefix}video-nav-color: var(--#{$prefix}dark-action-text);
153
153
  --#{$prefix}video-play-icon-color: var(--#{$prefix}text-darkest);
154
154
  }
@@ -162,7 +162,7 @@
162
162
  --#{$prefix}card-footer-border: var(--#{$prefix}dark-border);
163
163
  }
164
164
  &-dark-alt {
165
- --#{$prefix}card-bg: var(--#{$prefix}dark-blue);
165
+ --#{$prefix}card-bg: var(--#{$prefix}dark-alt-background);
166
166
  --#{$prefix}card-icon-background-color: var(
167
167
  --#{$prefix}dark-alt-background-shade
168
168
  );
@@ -431,6 +431,21 @@
431
431
  margin: 0;
432
432
  }
433
433
  }
434
+ /////////////////////////////////////////////
435
+ // Override default spacing on link list component for icon links
436
+ .link-list {
437
+ display: flex;
438
+ flex-direction: column;
439
+ margin: 1rem 0;
440
+ padding: 0;
441
+ gap: 0.75rem;
442
+ .link-item {
443
+ margin: 0;
444
+ a {
445
+ gap: 12px;
446
+ }
447
+ }
448
+ }
434
449
  }
435
450
  .card-footer {
436
451
  font-size: 1.25rem;
@@ -7,9 +7,7 @@
7
7
  // 1. Palette colours
8
8
  // ------------------------------------------------------------------------------------------------------------------
9
9
  // Default palette
10
- --#{$prefix}footer-color-crest-fill: var(
11
- --#{$prefix}color-default-color-light-crest-fill
12
- );
10
+ --#{$prefix}footer-color-crest-fill: var(--#{$prefix}-neutral-black);
13
11
  --#{$prefix}footer-color-border: var(
14
12
  --#{$prefix}color-default-color-light-border-default
15
13
  );
@@ -35,11 +33,9 @@
35
33
  --#{$prefix}footer-color-background: var(
36
34
  --#{$prefix}color-default-color-light-background-default
37
35
  );
38
- --#{$prefix}footer-color-alt-button: var(
39
- --#{$prefix}core-default-color-brand-secondary-darkgreen
40
- );
36
+ --#{$prefix}footer-color-alt-button: var(--#{$prefix}light-action-secondary);
41
37
  --#{$prefix}footer-color-alt-button__hover: var(
42
- --#{$prefix}core-default-color-brand-primary-light-green
38
+ --#{$prefix}light-action-secondary-hover
43
39
  );
44
40
  --#{$prefix}footer-color-social-icon: #{$core-default-color-neutral-black};
45
41
 
@@ -293,6 +293,14 @@
293
293
  position: relative;
294
294
  color: var(--#{$prefix}header-color-text);
295
295
  background: var(--#{$prefix}header-color-bg);
296
+
297
+ // Patch for v2.0.5. Redundant after header QGDS-266 is merged
298
+ border-bottom: 0.25rem solid var(--qld-light-accent);
299
+
300
+ @include media-breakpoint-up(lg) {
301
+ border-bottom: none;
302
+ }
303
+ // End patch for v2.0.5
296
304
  }
297
305
 
298
306
  &-brand {
@@ -43,12 +43,12 @@ const sideNavData = {
43
43
  },
44
44
  {
45
45
  link: "#",
46
- label: "Content page (basic bar)",
46
+ label: "Content page (with bar)",
47
47
  class: "",
48
48
  },
49
49
  {
50
50
  link: "#",
51
- label: "Single page form",
51
+ label: "Page with form",
52
52
  class: "",
53
53
  },
54
54
  ],