@swisspost/design-system-styles 6.6.1 → 6.6.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 (14) hide show
  1. package/_svg-icon-map.scss +2 -0
  2. package/basics.css +1 -1
  3. package/components/form-check.scss +29 -0
  4. package/components/form-select.scss +6 -1
  5. package/components/spinner.scss +134 -29
  6. package/functions/_contrast.scss +1 -1
  7. package/index.css +3 -3
  8. package/intranet.css +3 -3
  9. package/mixins/_icons.scss +2 -0
  10. package/mixins/_notification.scss +1 -2
  11. package/package.json +3 -4
  12. package/variables/_heading.scss +1 -2
  13. package/variables/components/_form-select.scss +2 -1
  14. package/variables/components/_spinners.scss +21 -4
package/mixins/_icons.scss CHANGED
@@ -11,6 +11,8 @@
11
11
  -webkit-mask-image: url('#{icon-fn.get-svg-url($name)}');
12
12
  mask-image: url('#{icon-fn.get-svg-url($name)}');
13
13
  background-color: currentColor;
14
+ color: currentColor; // Required in this case with usage of forced-color-adjust: preserve-parent-color
15
+ forced-color-adjust: preserve-parent-color;
14
16
  }
15
17
 
16
18
  @mixin remove-icon() {
package/mixins/_notification.scss CHANGED
@@ -72,8 +72,7 @@
72
72
 
73
73
  @include utilities-mx.high-contrast-mode {
74
74
  filter: none !important;
75
- background-color: transparent !important;
76
- border: 2px solid WindowText;
75
+ border: 2px solid CanvasText;
77
76
  }
78
77
  }
79
78
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@swisspost/design-system-styles",
3
- "version": "6.6.1",
3
+ "version": "6.6.2",
4
4
  "description": "Design System Styles for the Swiss Post web platform.",
5
5
  "author": "Swiss Post <oss@post.ch>",
6
6
  "license": "Apache-2.0",
@@ -33,17 +33,16 @@
33
33
  "bootstrap": "5.3.2"
34
34
  },
35
35
  "devDependencies": {
36
- "@swisspost/design-system-icons": "1.2.0",
36
+ "@swisspost/design-system-icons": "1.3.0",
37
37
  "@types/node": "18.19.14",
38
38
  "autoprefixer": "10.4.17",
39
39
  "copyfiles": "2.4.1",
40
40
  "glob": "10.3.10",
41
41
  "gulp": "4.0.2",
42
42
  "gulp-newer": "^1.4.0",
43
- "gulp-postcss": "9.1.0",
43
+ "gulp-postcss": "10.0.0",
44
44
  "gulp-sass": "5.1.0",
45
45
  "jest": "29.7.0",
46
- "npm-run-all2": "5.0.2",
47
46
  "postcss": "8.4.33",
48
47
  "postcss-scss": "4.0.9",
49
48
  "prettier": "3.2.5",
package/variables/_heading.scss CHANGED
@@ -30,8 +30,7 @@ $heading-sizes-h4: (
30
30
  );
31
31
 
32
32
  $heading-sizes-h5: (
33
- xs: type.$font-size-14,
34
- sm: type.$font-size-16,
33
+ xs: type.$font-size-16,
35
34
  md: type.$font-size-18,
36
35
  xxl: type.$font-size-20,
37
36
  );
package/variables/components/_form-select.scss CHANGED
@@ -18,4 +18,5 @@ $form-select-indicator-success: url(icons.get-colored-svg-url(
18
18
  color.$success-green
19
19
  )) !default;
20
20
  $form-select-indicator-error: url(icons.get-colored-svg-url('2104', color.$error-red)) !default;
21
- $form-select-indicator-hcm: url(icons.get-colored-svg-url('2113', color.$white)) !default;
21
+ $form-select-indicator-hcm-dark: url(icons.get-colored-svg-url('2113', color.$white)) !default;
22
+ $form-select-indicator-hcm-light: url(icons.get-colored-svg-url('2113', color.$black)) !default;
package/variables/components/_spinners.scss CHANGED
@@ -1,16 +1,33 @@
1
+ @use 'sass:math';
1
2
  @use './../color';
2
3
  @use './../spacing';
4
+ @use './../type';
5
+ @use './../../functions/sizing';
3
6
 
4
7
  // Spinners
5
8
 
6
9
  $spinner-color-primary: color.$yellow !default;
7
- $spinner-color-secondary: color.$gray-10 !default;
10
+ $spinner-color-secondary: color.$gray-60 !default;
8
11
 
9
- $spinner-size: spacing.$size-huge !default;
12
+ $spinner-size: type.$font-size-56 !default;
10
13
  $spinner-border-width: 6px !default;
11
14
 
12
- $spinner-size-sm: spacing.$size-big !default;
15
+ $spinner-duration: 3.125s !default;
16
+ $spinner-speed-reduced-motion: math.div(1, 8) !default;
17
+
18
+ $spinner-size-map: (
19
+ 16: type.$font-size-16,
20
+ 24: type.$font-size-24,
21
+ 32: type.$font-size-32,
22
+ 40: type.$font-size-40,
23
+ 48: type.$font-size-48,
24
+ // 56 is already defined as default
25
+ 80: sizing.px-to-rem(80px),
26
+ );
27
+
28
+ // DEPRECATED
29
+ $spinner-size-sm: type.$font-size-40 !default;
13
30
  $spinner-border-width-sm: spacing.$size-micro !default;
14
31
 
15
- $spinner-size-xs: spacing.$size-small-regular !default;
32
+ $spinner-size-xs: type.$font-size-16 !default;
16
33
  $spinner-border-width-xs: spacing.$size-line !default;