@bonniernews/dn-design-system-web 26.0.0 → 26.0.1

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 (8) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/foundations/variables/colorsDnDark.scss +15 -15
  3. package/foundations/variables/colorsDnLight.scss +12 -12
  4. package/foundations/variables/typographyScreenLarge.scss +1 -1
  5. package/foundations/variables/typographyScreenSmall.scss +2 -2
  6. package/package.json +1 -1
  7. package/variables/colors-dark-mode.json +15 -15
  8. package/variables/colors-light-mode.json +12 -12
package/CHANGELOG.md CHANGED
@@ -4,6 +4,14 @@ All changes to @bonniernews/dn-design-system-web will be documented in this file
4
4
 
5
5
 
6
6
 
7
+ ## [26.0.1](https://github.com/BonnierNews/dn-design-system/compare/@bonniernews/dn-design-system-web@26.0.0...@bonniernews/dn-design-system-web@26.0.1) (2025-02-03)
8
+
9
+
10
+ ### Maintenance
11
+
12
+ * prerelease packages ([db0f037](https://github.com/BonnierNews/dn-design-system/commit/db0f037943810381c984663611786f4172c06f65))
13
+ * update variables ([#1598](https://github.com/BonnierNews/dn-design-system/issues/1598)) ([38f8e3a](https://github.com/BonnierNews/dn-design-system/commit/38f8e3a9ea450d87c5afe7e3410e2678b5cc517d))
14
+
7
15
  ## [26.0.0](https://github.com/BonnierNews/dn-design-system/compare/@bonniernews/dn-design-system-web@25.0.5...@bonniernews/dn-design-system-web@26.0.0) (2025-01-30)
8
16
 
9
17
 
package/foundations/variables/colorsDnDark.scss CHANGED
@@ -1,8 +1,8 @@
1
- $ds-hex-dark-surface-foreground: #0d0d0d;
2
- $ds-hex-dark-surface-primary: #050505;
3
- $ds-hex-dark-surface-primary-raised-soft: #121212;
4
- $ds-hex-dark-surface-primary-raised-strong: #1e1e1e;
5
- $ds-hex-dark-surface-primary-elevated: #121212;
1
+ $ds-hex-dark-surface-foreground: #000000;
2
+ $ds-hex-dark-surface-primary: #0f0f0f;
3
+ $ds-hex-dark-surface-primary-raised-soft: #171717;
4
+ $ds-hex-dark-surface-primary-raised-strong: #212121;
5
+ $ds-hex-dark-surface-primary-elevated: #0f0f0f;
6
6
  $ds-hex-dark-surface-primaryinvert: #ffffff;
7
7
  $ds-hex-dark-surface-primaryinvert-raised-soft: rgba(5, 5, 5, 0.05);
8
8
  $ds-hex-dark-surface-primaryinvert-elevated: #ffffff;
@@ -19,15 +19,15 @@ $ds-hex-dark-border-primary-strong: rgba(255, 255, 255, 0.39);
19
19
  $ds-hex-dark-border-primary-strongest: #ffffff;
20
20
  $ds-hex-dark-border-primaryinvert: rgba(5, 5, 5, 0.13);
21
21
  $ds-hex-dark-border-primaryinvert-strong: rgba(5, 5, 5, 0.5);
22
- $ds-hex-dark-border-primaryinvert-strongest: #050505;
22
+ $ds-hex-dark-border-primaryinvert-strongest: #000000;
23
23
  $ds-hex-dark-border-brand: #fd2330;
24
24
  $ds-hex-dark-border-culture: #4293d7;
25
25
  $ds-hex-dark-text-primary: #e8e8e8;
26
26
  $ds-hex-dark-text-primary-subtle: #b2b2b2;
27
27
  $ds-hex-dark-text-primary-disabled: #b2b2b2;
28
- $ds-hex-dark-text-primaryinvert: #050505;
29
- $ds-hex-dark-text-primaryinvert-subtle: #5a5a5a;
30
- $ds-hex-dark-text-primaryinvert-disabled: #050505;
28
+ $ds-hex-dark-text-primaryinvert: #000000;
29
+ $ds-hex-dark-text-primaryinvert-subtle: #595959;
30
+ $ds-hex-dark-text-primaryinvert-disabled: #000000;
31
31
  $ds-hex-dark-text-brand: #fd2330;
32
32
  $ds-hex-dark-text-culture: #4293d7;
33
33
  $ds-hex-dark-text-critical: #fd2330;
@@ -67,14 +67,14 @@ $ds-hex-dark-neutral-300: #cdcdcd;
67
67
  $ds-hex-dark-neutral-400: #b2b2b2;
68
68
  $ds-hex-dark-neutral-500: #8c8c8c;
69
69
  $ds-hex-dark-neutral-600: #666666;
70
- $ds-hex-dark-neutral-700: #5a5a5a;
71
- $ds-hex-dark-neutral-800: #353535;
72
- $ds-hex-dark-neutral-900: #1e1e1e;
73
- $ds-hex-dark-neutral-1000: #121212;
74
- $ds-hex-dark-neutral-1100: #0d0d0d;
70
+ $ds-hex-dark-neutral-700: #595959;
71
+ $ds-hex-dark-neutral-800: #363636;
72
+ $ds-hex-dark-neutral-900: #212121;
73
+ $ds-hex-dark-neutral-1000: #171717;
74
+ $ds-hex-dark-neutral-1100: #0f0f0f;
75
75
  $ds-hex-dark-neutral-white: #ffffff;
76
76
  $ds-hex-dark-neutral-050: #f8f8f8;
77
- $ds-hex-dark-neutral-black: #050505;
77
+ $ds-hex-dark-neutral-black: #000000;
78
78
  $ds-hex-dark-bright-neutral-alpha-100: rgba(5, 5, 5, 0.05);
79
79
  $ds-hex-dark-bright-neutral-alpha-200: rgba(5, 5, 5, 0.13);
80
80
  $ds-hex-dark-bright-neutral-alpha-300: rgba(5, 5, 5, 0.2);
package/foundations/variables/colorsDnLight.scss CHANGED
@@ -3,9 +3,9 @@ $ds-hex-surface-primary: #ffffff;
3
3
  $ds-hex-surface-primary-raised-soft: #f2f2f2;
4
4
  $ds-hex-surface-primary-raised-strong: #e8e8e8;
5
5
  $ds-hex-surface-primary-elevated: #ffffff;
6
- $ds-hex-surface-primaryinvert: #050505;
6
+ $ds-hex-surface-primaryinvert: #000000;
7
7
  $ds-hex-surface-primaryinvert-raised-soft: #ffffff0d;
8
- $ds-hex-surface-primaryinvert-elevated: #121212;
8
+ $ds-hex-surface-primaryinvert-elevated: #171717;
9
9
  $ds-hex-surface-brand: #da000d;
10
10
  $ds-hex-surface-success: #3a8352;
11
11
  $ds-hex-surface-culture: #227ac3;
@@ -16,15 +16,15 @@ $ds-hex-surface-native-article: #ededed;
16
16
  $ds-hex-surface-quiz: #ea3e3f;
17
17
  $ds-hex-border-primary: #05050521;
18
18
  $ds-hex-border-primary-strong: #05050580;
19
- $ds-hex-border-primary-strongest: #050505;
19
+ $ds-hex-border-primary-strongest: #000000;
20
20
  $ds-hex-border-primaryinvert: #ffffff26;
21
21
  $ds-hex-border-primaryinvert-strong: #ffffff63;
22
22
  $ds-hex-border-primaryinvert-strongest: #ffffff;
23
23
  $ds-hex-border-brand: #da000d;
24
24
  $ds-hex-border-culture: #227ac3;
25
- $ds-hex-text-primary: #050505;
26
- $ds-hex-text-primary-subtle: #5a5a5a;
27
- $ds-hex-text-primary-disabled: #5a5a5a;
25
+ $ds-hex-text-primary: #000000;
26
+ $ds-hex-text-primary-subtle: #595959;
27
+ $ds-hex-text-primary-disabled: #595959;
28
28
  $ds-hex-text-primaryinvert: #f2f2f2;
29
29
  $ds-hex-text-primaryinvert-subtle: #b2b2b2;
30
30
  $ds-hex-text-primaryinvert-disabled: #f2f2f2;
@@ -67,14 +67,14 @@ $ds-hex-neutral-300: #cdcdcd;
67
67
  $ds-hex-neutral-400: #b2b2b2;
68
68
  $ds-hex-neutral-500: #8c8c8c;
69
69
  $ds-hex-neutral-600: #666666;
70
- $ds-hex-neutral-700: #5a5a5a;
71
- $ds-hex-neutral-800: #353535;
72
- $ds-hex-neutral-900: #1e1e1e;
73
- $ds-hex-neutral-1000: #121212;
74
- $ds-hex-neutral-1100: #0d0d0d;
70
+ $ds-hex-neutral-700: #595959;
71
+ $ds-hex-neutral-800: #363636;
72
+ $ds-hex-neutral-900: #212121;
73
+ $ds-hex-neutral-1000: #171717;
74
+ $ds-hex-neutral-1100: #0f0f0f;
75
75
  $ds-hex-neutral-white: #ffffff;
76
76
  $ds-hex-neutral-050: #f8f8f8;
77
- $ds-hex-neutral-black: #050505;
77
+ $ds-hex-neutral-black: #000000;
78
78
  $ds-hex-bright-neutral-alpha-100: #0505050d;
79
79
  $ds-hex-bright-neutral-alpha-200: #05050521;
80
80
  $ds-hex-bright-neutral-alpha-300: #05050533;
package/foundations/variables/typographyScreenLarge.scss CHANGED
@@ -321,7 +321,7 @@ $typographyScreenLarge: (
321
321
  ),
322
322
  detail-teaser-story: (
323
323
  fontFamily: "DN Serif Display",
324
- fontSize: 32,
324
+ fontSize: 40,
325
325
  fontWeight: Regular,
326
326
  letterSpacing: 0,
327
327
  lineHeight: 1.1
package/foundations/variables/typographyScreenSmall.scss CHANGED
@@ -320,8 +320,8 @@ $typographyScreenSmall: (
320
320
  fontStyle: italic
321
321
  ),
322
322
  detail-teaser-story: (
323
- fontFamily: "DN Serif Headline",
324
- fontSize: 26,
323
+ fontFamily: "DN Serif Display",
324
+ fontSize: 32,
325
325
  fontWeight: Regular,
326
326
  letterSpacing: 0,
327
327
  lineHeight: 1.1
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bonniernews/dn-design-system-web",
3
- "version": "26.0.0",
3
+ "version": "26.0.1",
4
4
  "description": "DN design system for web.",
5
5
  "type": "module",
6
6
  "homepage": "https://github.com/BonnierNews/dn-design-system/tree/main/web/src#readme",
package/variables/colors-dark-mode.json CHANGED
@@ -1,10 +1,10 @@
1
1
  {
2
2
  "surface": {
3
- "foreground": "#0d0d0d",
4
- "primary": "#050505",
5
- "primary-raised-soft": "#121212",
6
- "primary-raised-strong": "#1e1e1e",
7
- "primary-elevated": "#121212",
3
+ "foreground": "#000000",
4
+ "primary": "#0f0f0f",
5
+ "primary-raised-soft": "#171717",
6
+ "primary-raised-strong": "#212121",
7
+ "primary-elevated": "#0f0f0f",
8
8
  "primaryinvert": "#ffffff",
9
9
  "primaryinvert-raised-soft": "rgba(5, 5, 5, 0.05)",
10
10
  "primaryinvert-elevated": "#ffffff",
@@ -23,7 +23,7 @@
23
23
  "primary-strongest": "#ffffff",
24
24
  "primaryinvert": "rgba(5, 5, 5, 0.13)",
25
25
  "primaryinvert-strong": "rgba(5, 5, 5, 0.5)",
26
- "primaryinvert-strongest": "#050505",
26
+ "primaryinvert-strongest": "#000000",
27
27
  "brand": "#fd2330",
28
28
  "culture": "#4293d7"
29
29
  },
@@ -31,9 +31,9 @@
31
31
  "primary": "#e8e8e8",
32
32
  "primary-subtle": "#b2b2b2",
33
33
  "primary-disabled": "#b2b2b2",
34
- "primaryinvert": "#050505",
35
- "primaryinvert-subtle": "#5a5a5a",
36
- "primaryinvert-disabled": "#050505",
34
+ "primaryinvert": "#000000",
35
+ "primaryinvert-subtle": "#595959",
36
+ "primaryinvert-disabled": "#000000",
37
37
  "brand": "#fd2330",
38
38
  "culture": "#4293d7",
39
39
  "critical": "#fd2330",
@@ -81,14 +81,14 @@
81
81
  "400": "#b2b2b2",
82
82
  "500": "#8c8c8c",
83
83
  "600": "#666666",
84
- "700": "#5a5a5a",
85
- "800": "#353535",
86
- "900": "#1e1e1e",
87
- "1000": "#121212",
88
- "1100": "#0d0d0d",
84
+ "700": "#595959",
85
+ "800": "#363636",
86
+ "900": "#212121",
87
+ "1000": "#171717",
88
+ "1100": "#0f0f0f",
89
89
  "white": "#ffffff",
90
90
  "050": "#f8f8f8",
91
- "black": "#050505"
91
+ "black": "#000000"
92
92
  },
93
93
  "bright-neutral-alpha": {
94
94
  "100": "rgba(5, 5, 5, 0.05)",
package/variables/colors-light-mode.json CHANGED
@@ -5,9 +5,9 @@
5
5
  "primary-raised-soft": "#f2f2f2",
6
6
  "primary-raised-strong": "#e8e8e8",
7
7
  "primary-elevated": "#ffffff",
8
- "primaryinvert": "#050505",
8
+ "primaryinvert": "#000000",
9
9
  "primaryinvert-raised-soft": "#ffffff0d",
10
- "primaryinvert-elevated": "#121212",
10
+ "primaryinvert-elevated": "#171717",
11
11
  "brand": "#da000d",
12
12
  "success": "#3a8352",
13
13
  "culture": "#227ac3",
@@ -20,7 +20,7 @@
20
20
  "border": {
21
21
  "primary": "#05050521",
22
22
  "primary-strong": "#05050580",
23
- "primary-strongest": "#050505",
23
+ "primary-strongest": "#000000",
24
24
  "primaryinvert": "#ffffff26",
25
25
  "primaryinvert-strong": "#ffffff63",
26
26
  "primaryinvert-strongest": "#ffffff",
@@ -28,9 +28,9 @@
28
28
  "culture": "#227ac3"
29
29
  },
30
30
  "text": {
31
- "primary": "#050505",
32
- "primary-subtle": "#5a5a5a",
33
- "primary-disabled": "#5a5a5a",
31
+ "primary": "#000000",
32
+ "primary-subtle": "#595959",
33
+ "primary-disabled": "#595959",
34
34
  "primaryinvert": "#f2f2f2",
35
35
  "primaryinvert-subtle": "#b2b2b2",
36
36
  "primaryinvert-disabled": "#f2f2f2",
@@ -81,14 +81,14 @@
81
81
  "400": "#b2b2b2",
82
82
  "500": "#8c8c8c",
83
83
  "600": "#666666",
84
- "700": "#5a5a5a",
85
- "800": "#353535",
86
- "900": "#1e1e1e",
87
- "1000": "#121212",
88
- "1100": "#0d0d0d",
84
+ "700": "#595959",
85
+ "800": "#363636",
86
+ "900": "#212121",
87
+ "1000": "#171717",
88
+ "1100": "#0f0f0f",
89
89
  "white": "#ffffff",
90
90
  "050": "#f8f8f8",
91
- "black": "#050505"
91
+ "black": "#000000"
92
92
  },
93
93
  "bright-neutral-alpha": {
94
94
  "100": "#0505050d",