@qhealth-design-system/core 1.18.0 → 1.18.2

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 (5) hide show
  1. package/CHANGELOG.md +4 -0
  2. package/package.json +1 -1
  3. package/src/components/header/js/global.js +11 -5
  4. package/src/components/search_box/css/component.scss +1 -1
  5. package/src/styles/imports/variables.scss +29 -29
package/CHANGELOG.md CHANGED
@@ -7,6 +7,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
7
7
 
8
8
  ## Unreleased
9
9
 
10
+ ## 1.18.2 - 2025-11-19
11
+
12
+ ## 1.18.1 - 2025-11-12
13
+
10
14
  ## 1.18.0 - 2025-11-12
11
15
 
12
16
  ## 1.17.2 - 2025-10-23
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@qhealth-design-system/core",
3
- "version": "1.18.0",
3
+ "version": "1.18.2",
4
4
  "description": "",
5
5
  "licence": "MIT",
6
6
  "main": "index.js",
package/src/components/header/js/global.js CHANGED
@@ -5,11 +5,17 @@
5
5
  // Search toggle button
6
6
  const searchToggle = document.querySelector(".qld__main-nav__toggle-search");
7
7
  const searchForm = document.querySelector(".qld__header__search .qld__search-form");
8
- const targetId = searchToggle.getAttribute("aria-controls");
9
- const target = document.getElementById(targetId);
10
- const focustrapTop = target.querySelector(".qld__main-nav__focus-trap-top");
11
- const focustrapBottom = target.querySelector(".qld__main-nav__focus-trap-bottom");
12
- const searchToggleText = searchToggle.querySelector(".qld__main-nav__toggle-text");
8
+ let searchToggleText, targetId, target, focustrapTop, focustrapBottom;
9
+ if (searchToggle) {
10
+ searchToggleText = searchToggle.querySelector(".qld__main-nav__toggle-text");
11
+ targetId = searchToggle.getAttribute("aria-controls");
12
+ target = document.getElementById(targetId);
13
+ if (target) {
14
+ focustrapTop = target.querySelector(".qld__main-nav__focus-trap-top");
15
+ focustrapBottom = target.querySelector(".qld__main-nav__focus-trap-bottom");
16
+ }
17
+ }
18
+
13
19
  // Hold state of the header (open vs close)
14
20
  let isHeaderOpen = false;
15
21
  // Global events object
package/src/components/search_box/css/component.scss CHANGED
@@ -42,7 +42,7 @@
42
42
  }
43
43
 
44
44
  // Push the input cursor to the right when search icon is present
45
- > input.qld__text-input {
45
+ input.qld__text-input {
46
46
  padding-left: 3rem;
47
47
  }
48
48
  }
package/src/styles/imports/variables.scss CHANGED
@@ -354,57 +354,57 @@ $QLD-color-status__info--darker: #006a8f !default;
354
354
  /**
355
355
  * QLD-color-light styles
356
356
  */
357
- $QLD-color-light__site-title: #022a50 !default;
358
- $QLD-color-light__design-accent: #6bbe27 !default;
359
- $QLD-color-light__heading: #04284c !default;
360
- $QLD-color-light__text: #414141 !default;
357
+ $QLD-color-light__site-title: #005eb8 !default;
358
+ $QLD-color-light__design-accent: #84d3ff !default;
359
+ $QLD-color-light__heading: #000053 !default;
360
+ $QLD-color-light__text: #353535 !default;
361
361
  $QLD-color-light__text--lighter: #636363 !default;
362
- $QLD-color-light__link: #09549f !default;
362
+ $QLD-color-light__link: #005eb8 !default;
363
363
  $QLD-color-light__link--visited: #551a8b !default;
364
364
  $QLD-color-light__link--on-action: #ffffff !default;
365
- $QLD-color-light__action--primary: #09549f !default;
366
- $QLD-color-light__action--primary-hover: #003e7d !default;
367
- $QLD-color-light__action--secondary: #008733 !default;
368
- $QLD-color-light__action--secondary-hover: #005b23 !default;
369
- $QLD-color-light__focus: #0085b3 !default;
370
- $QLD-color-light__border: #ccddee !default;
371
- $QLD-color-light__background: #eff4f9 !default;
372
- $QLD-color-light__background--shade: #e5eef5 !default;
365
+ $QLD-color-light__action--primary: #005eb8 !default;
366
+ $QLD-color-light__action--primary-hover: #003e96 !default;
367
+ $QLD-color-light__action--secondary: #307edb !default;
368
+ $QLD-color-light__action--secondary-hover: #004ea7 !default;
369
+ $QLD-color-light__focus: #002e85 !default;
370
+ $QLD-color-light__border: #bedfff !default;
371
+ $QLD-color-light__background: #e6f6ff !default;
372
+ $QLD-color-light__background--shade: #ceedff !default;
373
373
 
374
374
  /**
375
375
  * QLD-color-light-alt styles
376
376
  */
377
377
 
378
- $QLD-color-light__border--alt: #7a7a7a !default;
379
- $QLD-color-light__background--alt: #e8e8e8 !default;
380
- $QLD-color-light__background--alt-shade: #e0e0e0 !default;
378
+ $QLD-color-light__border--alt: #848484 !default;
379
+ $QLD-color-light__background--alt: #e3e7ea !default;
380
+ $QLD-color-light__background--alt-shade: #d6dce0 !default;
381
381
 
382
382
  /**
383
383
  * QLD-color-dark styles
384
384
  */
385
385
  $QLD-color-dark__site-title: #ffffff !default;
386
- $QLD-color-dark__design-accent: #6bbe27 !default;
386
+ $QLD-color-dark__design-accent: #84d3ff !default;
387
387
  $QLD-color-dark__heading: #ffffff !default;
388
388
  $QLD-color-dark__text: #ffffff !default;
389
389
  $QLD-color-dark__text--lighter: #deebf9 !default;
390
390
  $QLD-color-dark__link: #ffffff !default;
391
391
  $QLD-color-dark__link--visited: #e1bbee !default;
392
- $QLD-color-dark__link--on-action: #121940 !default;
393
- $QLD-color-dark__action--primary: #78ba00 !default;
394
- $QLD-color-dark__action--primary-hover: #add33f !default;
395
- $QLD-color-dark__action--secondary: #ffe500 !default;
396
- $QLD-color-dark__action--secondary-hover: #ffef60 !default;
397
- $QLD-color-dark__focus: #01b0e5 !default;
398
- $QLD-color-dark__border: #1d9ac6 !default;
399
- $QLD-color-dark__background: #09549f !default;
400
- $QLD-color-dark__background--shade: #04498f !default;
392
+ $QLD-color-dark__link--on-action: #001c37 !default;
393
+ $QLD-color-dark__action--primary: #84d3ff !default;
394
+ $QLD-color-dark__action--primary-hover: #a6f7ff !default;
395
+ $QLD-color-dark__action--secondary: #84d3ff !default;
396
+ $QLD-color-dark__action--secondary-hover: #a6f7ff !default;
397
+ $QLD-color-dark__focus: #c6ffff !default;
398
+ $QLD-color-dark__border: #418fed !default;
399
+ $QLD-color-dark__background: #005eb8 !default;
400
+ $QLD-color-dark__background--shade: #003e96 !default;
401
401
 
402
402
  /**
403
403
  * QLD-color-alt-dark styles
404
404
  */
405
- $QLD-color-dark__border--alt: #09acfe !default;
406
- $QLD-color-dark__background--alt: #05325f !default;
407
- $QLD-color-dark__background--alt-shade: #052c53 !default;
405
+ $QLD-color-dark__border--alt: #63b1ff !default;
406
+ $QLD-color-dark__background--alt: #001d74 !default;
407
+ $QLD-color-dark__background--alt-shade: #000764 !default;
408
408
 
409
409
  /**
410
410
  * QLD-border-radius styles