@bonniernews/dn-design-system-web 25.0.5 → 25.0.6-beta.0

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 (107) hide show
  1. package/assets/form-field/form-field.scss +6 -6
  2. package/assets/teaser/teaser.scss +5 -5
  3. package/components/article-top-image/article-top-image.scss +1 -1
  4. package/components/badge/badge.scss +5 -5
  5. package/components/blocked-content/blocked-content.scss +9 -9
  6. package/components/buddy-menu/buddy-menu.scss +15 -15
  7. package/components/button/button.scss +49 -33
  8. package/components/checkbox/checkbox.scss +9 -9
  9. package/components/disclaimer/disclaimer.scss +10 -10
  10. package/components/divider/divider.scss +3 -3
  11. package/components/empty-state/empty-state.scss +3 -3
  12. package/components/factbox/factbox.scss +13 -13
  13. package/components/footer/footer.scss +16 -16
  14. package/components/game-header/game-header.scss +6 -6
  15. package/components/group-header/group-header.scss +6 -6
  16. package/components/image-caption/image-caption.scss +3 -3
  17. package/components/link-box/link-box-item.scss +4 -4
  18. package/components/link-box/link-box.scss +1 -1
  19. package/components/list-item/list-item.scss +24 -24
  20. package/components/modal/modal.scss +4 -4
  21. package/components/pagination/pagination.scss +4 -4
  22. package/components/pictogram/pictogram.scss +3 -3
  23. package/components/profile-header/profile-header.scss +7 -7
  24. package/components/quote/quote.scss +2 -2
  25. package/components/radio-button/radio-button.scss +9 -9
  26. package/components/spinner/spinner.scss +14 -14
  27. package/components/switch/switch.scss +13 -13
  28. package/components/tag-header/tag-header.scss +8 -8
  29. package/components/teaser-centered/teaser-centered.scss +1 -1
  30. package/components/teaser-footer/teaser-footer.scss +5 -5
  31. package/components/teaser-image/teaser-image.scss +4 -4
  32. package/components/teaser-large/teaser-large.scss +7 -6
  33. package/components/teaser-list-vertical/teaser-list-vertical.scss +8 -8
  34. package/components/teaser-longlife/teaser-longlife.scss +7 -7
  35. package/components/teaser-native/teaser-native.scss +19 -19
  36. package/components/teaser-onsite/teaser-onsite.scss +2 -2
  37. package/components/teaser-package/teaser-package.scss +2 -2
  38. package/components/teaser-right-now/teaser-right-now.scss +1 -1
  39. package/components/teaser-slideshow/teaser-slideshow.scss +3 -3
  40. package/components/teaser-split/teaser-split.scss +5 -5
  41. package/components/teaser-standard/teaser-standard.scss +5 -5
  42. package/components/teaser-swipe-card/teaser-swipe-card.scss +10 -10
  43. package/components/teaser-tipsa/teaser-tipsa.scss +2 -2
  44. package/components/text-button/text-button.scss +7 -7
  45. package/components/text-button-toggle/text-button-toggle.scss +7 -7
  46. package/components/text-input/text-input.scss +22 -23
  47. package/components/tooltip/tooltip.scss +5 -5
  48. package/components/video-caption/video-caption.scss +4 -4
  49. package/components/vip-badge/vip-badge.scss +10 -10
  50. package/foundations/colors.scss +6 -18
  51. package/foundations/cssVariables.scss +1 -0
  52. package/foundations/gradients.scss +25 -0
  53. package/foundations/helpers/colors.scss +10 -18
  54. package/foundations/helpers/forward.helpers.scss +1 -0
  55. package/foundations/helpers/gradients.scss +33 -0
  56. package/foundations/helpers/hover.scss +2 -2
  57. package/foundations/helpers/links.scss +4 -3
  58. package/foundations/helpers/metrics.scss +4 -6
  59. package/foundations/helpers/shadows.scss +5 -5
  60. package/foundations/helpers/typography.scss +11 -12
  61. package/foundations/shadows.scss +4 -4
  62. package/foundations/variables/border-width.scss +5 -0
  63. package/foundations/variables/colorsCssVariables.scss +84 -82
  64. package/foundations/variables/colorsDnDark.scss +89 -0
  65. package/foundations/variables/colorsDnLight.scss +89 -0
  66. package/foundations/variables/gradientsDnDark.scss +46 -0
  67. package/foundations/variables/gradientsDnLight.scss +46 -0
  68. package/foundations/variables/gradientsList.scss +4 -0
  69. package/foundations/variables/radius.scss +6 -0
  70. package/foundations/variables/shadowsDnDark.scss +30 -0
  71. package/foundations/variables/shadowsDnLight.scss +30 -0
  72. package/foundations/variables/shadowsList.scss +4 -0
  73. package/foundations/variables/spacingBase.scss +1 -0
  74. package/foundations/variables/spacingBaseList.scss +1 -0
  75. package/foundations/variables/spacingDetail.scss +3 -16
  76. package/foundations/variables/spacingDetailList.scss +3 -16
  77. package/foundations/variables/spacingDetailScreenLarge.scss +3 -16
  78. package/foundations/variables/typographyLetterSpacing.scss +1 -1
  79. package/foundations/variables/typographyLineHeight.scss +3 -3
  80. package/foundations/variables/typographyList.scss +53 -0
  81. package/foundations/variables/typographyScreenExtraLarge.scss +381 -0
  82. package/foundations/variables/typographyScreenLarge.scss +381 -0
  83. package/foundations/variables/{typographyTokensScreenSmall.scss → typographyScreenSmall.scss} +267 -309
  84. package/package.json +2 -2
  85. package/preact/components/icon-with-wrapper/icon-with-wrapper.js +86 -84
  86. package/preact/components/icon-with-wrapper/icon-with-wrapper.js.map +3 -3
  87. package/types-lib/ds-color.d.ts +97 -93
  88. package/variables/colors-dark-mode.json +109 -0
  89. package/variables/colors-light-mode.json +109 -0
  90. package/variables/gradients-dark-mode.json +58 -0
  91. package/variables/gradients-light-mode.json +58 -0
  92. package/variables/typography-list.json +55 -0
  93. package/foundations/variables/colorsDnDarkTokens.scss +0 -88
  94. package/foundations/variables/colorsDnLightTokens.scss +0 -87
  95. package/foundations/variables/decorations.scss +0 -1
  96. package/foundations/variables/metrics.scss +0 -12
  97. package/foundations/variables/shadowsDnDarkTokens.scss +0 -34
  98. package/foundations/variables/shadowsDnLightTokens.scss +0 -34
  99. package/foundations/variables/shadowsTokensList.scss +0 -4
  100. package/foundations/variables/typographyTokensList.scss +0 -59
  101. package/foundations/variables/typographyTokensScreenExtraLarge.scss +0 -422
  102. package/foundations/variables/typographyTokensScreenLarge.scss +0 -422
  103. package/tokens/colors-dark-mode.json +0 -106
  104. package/tokens/colors-light-mode.json +0 -105
  105. package/tokens/typography-list.json +0 -61
  106. package/variables/shadows-css-variables.json +0 -6
  107. /package/{tokens → variables}/icon-list.json +0 -0
package/foundations/variables/radius.scss ADDED
@@ -0,0 +1,6 @@
1
+ $radius: (
2
+ 100: 16,
3
+ 012: 2,
4
+ 025: 4,
5
+ 050: 8
6
+ );
package/foundations/variables/shadowsDnDark.scss ADDED
@@ -0,0 +1,30 @@
1
+ $shadowsDnDark: (
2
+ elevation-xs: (
3
+ x: 0,
4
+ y: 0,
5
+ blur: 0,
6
+ spread: 0,
7
+ color: #0505051a
8
+ ),
9
+ elevation-sm: (
10
+ x: 0,
11
+ y: 0,
12
+ blur: 0,
13
+ spread: 0,
14
+ color: #0505051a
15
+ ),
16
+ elevation-md: (
17
+ x: 0,
18
+ y: 0,
19
+ blur: 0,
20
+ spread: 0,
21
+ color: #0505051a
22
+ ),
23
+ elevation-lg: (
24
+ x: 0,
25
+ y: 0,
26
+ blur: 0,
27
+ spread: 0,
28
+ color: #0000001a
29
+ )
30
+ );
package/foundations/variables/shadowsDnLight.scss ADDED
@@ -0,0 +1,30 @@
1
+ $shadowsDnLight: (
2
+ elevation-xs: (
3
+ x: 0,
4
+ y: 1,
5
+ blur: 2,
6
+ spread: 1,
7
+ color: #0505051a
8
+ ),
9
+ elevation-sm: (
10
+ x: 0,
11
+ y: 2,
12
+ blur: 4,
13
+ spread: 1,
14
+ color: #0505051a
15
+ ),
16
+ elevation-md: (
17
+ x: 0,
18
+ y: 4,
19
+ blur: 8,
20
+ spread: 0,
21
+ color: #0505051a
22
+ ),
23
+ elevation-lg: (
24
+ x: 0,
25
+ y: 4,
26
+ blur: 16,
27
+ spread: 0,
28
+ color: #0000001a
29
+ )
30
+ );
package/foundations/variables/shadowsList.scss ADDED
@@ -0,0 +1,4 @@
1
+ $ds-shadow-elevation-xs: --ds-shadow-elevation-xs;
2
+ $ds-shadow-elevation-sm: --ds-shadow-elevation-sm;
3
+ $ds-shadow-elevation-md: --ds-shadow-elevation-md;
4
+ $ds-shadow-elevation-lg: --ds-shadow-elevation-lg;
package/foundations/variables/spacingBase.scss CHANGED
@@ -8,6 +8,7 @@ $spacingBase: (
8
8
  350: 56,
9
9
  400: 64,
10
10
  500: 80,
11
+ 012: 2,
11
12
  025: 4,
12
13
  050: 8,
13
14
  075: 12
package/foundations/variables/spacingBaseList.scss CHANGED
@@ -7,6 +7,7 @@ $ds-s-300: 300;
7
7
  $ds-s-350: 350;
8
8
  $ds-s-400: 400;
9
9
  $ds-s-500: 500;
10
+ $ds-s-012: 012;
10
11
  $ds-s-025: 025;
11
12
  $ds-s-050: 050;
12
13
  $ds-s-075: 075;
package/foundations/variables/spacingDetail.scss CHANGED
@@ -1,18 +1,5 @@
1
1
  $spacingDetail: (
2
- outer: 16,
3
- outer-negative: -16,
4
- page-horizontal: 16,
5
- page-top-small: 16,
6
- gap-vertical-static-medium: 16,
7
- gap-vertical-medium: 16,
8
- gap-vertical-static-large: 32,
9
- gap-vertical-static-small: 8,
10
- page-top-xsmall: 4,
11
- teaser-vertical-small: 8,
12
- teaser-horizontal: 16,
13
- teaser-vertical-medium: 12,
14
- direkt-header-bottom: 48,
15
- spacing-sm: 4,
16
- spacing-md: 8,
17
- spacing-lg: 16
2
+ sm: 4,
3
+ md: 8,
4
+ lg: 16
18
5
  );
package/foundations/variables/spacingDetailList.scss CHANGED
@@ -1,16 +1,3 @@
1
- $ds-s-outer: outer;
2
- $ds-s-outer-negative: outer-negative;
3
- $ds-s-page-horizontal: page-horizontal;
4
- $ds-s-page-top-small: page-top-small;
5
- $ds-s-gap-vertical-static-medium: gap-vertical-static-medium;
6
- $ds-s-gap-vertical-medium: gap-vertical-medium;
7
- $ds-s-gap-vertical-static-large: gap-vertical-static-large;
8
- $ds-s-gap-vertical-static-small: gap-vertical-static-small;
9
- $ds-s-page-top-xsmall: page-top-xsmall;
10
- $ds-s-teaser-vertical-small: teaser-vertical-small;
11
- $ds-s-teaser-horizontal: teaser-horizontal;
12
- $ds-s-teaser-vertical-medium: teaser-vertical-medium;
13
- $ds-s-direkt-header-bottom: direkt-header-bottom;
14
- $ds-s-spacing-sm: spacing-sm;
15
- $ds-s-spacing-md: spacing-md;
16
- $ds-s-spacing-lg: spacing-lg;
1
+ $ds-s-sm: sm;
2
+ $ds-s-md: md;
3
+ $ds-s-lg: lg;
package/foundations/variables/spacingDetailScreenLarge.scss CHANGED
@@ -1,18 +1,5 @@
1
1
  $spacingDetailScreenLarge: (
2
- page-top-small: 32,
3
- page-horizontal: 32,
4
- gap-vertical-medium: 32,
5
- teaser-vertical-small: 12,
6
- teaser-horizontal: 16,
7
- teaser-vertical-medium: 16,
8
- direkt-header-bottom: 64,
9
- spacing-sm: 8,
10
- spacing-md: 16,
11
- spacing-lg: 32,
12
- outer: 16,
13
- outer-negative: -16,
14
- gap-vertical-static-medium: 16,
15
- gap-vertical-static-large: 32,
16
- gap-vertical-static-small: 8,
17
- page-top-xsmall: 4
2
+ sm: 8,
3
+ md: 16,
4
+ lg: 32
18
5
  );
package/foundations/variables/typographyLetterSpacing.scss CHANGED
@@ -1,3 +1,3 @@
1
1
  $ds-letterspacing-none: 0;
2
2
  $ds-letterspacing-xs: 0.2;
3
- $ds-letterspacing-s: 0.5;
3
+ $ds-letterspacing-sm: 0.5;
package/foundations/variables/typographyLineHeight.scss CHANGED
@@ -1,4 +1,4 @@
1
1
  $ds-lineheight-none: 1;
2
- $ds-lineheight-s: 1.1;
3
- $ds-lineheight-m: 1.2;
4
- $ds-lineheight-l: 1.5;
2
+ $ds-lineheight-sm: 1.1;
3
+ $ds-lineheight-md: 1.2;
4
+ $ds-lineheight-lg: 1.5;
package/foundations/variables/typographyList.scss ADDED
@@ -0,0 +1,53 @@
1
+ $ds-typography-expressive-heading-xxs: 'expressive-heading-xxs';
2
+ $ds-typography-expressive-heading-xs: 'expressive-heading-xs';
3
+ $ds-typography-expressive-heading-sm: 'expressive-heading-sm';
4
+ $ds-typography-expressive-heading-md: 'expressive-heading-md';
5
+ $ds-typography-expressive-heading-lg: 'expressive-heading-lg';
6
+ $ds-typography-expressive-heading-xl: 'expressive-heading-xl';
7
+ $ds-typography-expressive-body-sm: 'expressive-body-sm';
8
+ $ds-typography-expressive-body-md: 'expressive-body-md';
9
+ $ds-typography-expressive-body-lg: 'expressive-body-lg';
10
+ $ds-typography-expressive-ingress-sm: 'expressive-ingress-sm';
11
+ $ds-typography-expressive-ingress-md: 'expressive-ingress-md';
12
+ $ds-typography-functional-heading-xxs: 'functional-heading-xxs';
13
+ $ds-typography-functional-heading-xs: 'functional-heading-xs';
14
+ $ds-typography-functional-heading-sm: 'functional-heading-sm';
15
+ $ds-typography-functional-heading-md: 'functional-heading-md';
16
+ $ds-typography-functional-heading-lg: 'functional-heading-lg';
17
+ $ds-typography-functional-heading-xl: 'functional-heading-xl';
18
+ $ds-typography-functional-label-sm: 'functional-label-sm';
19
+ $ds-typography-functional-label-md: 'functional-label-md';
20
+ $ds-typography-functional-body-sm: 'functional-body-sm';
21
+ $ds-typography-functional-body-md: 'functional-body-md';
22
+ $ds-typography-functional-body-lg: 'functional-body-lg';
23
+ $ds-typography-functional-meta-sm: 'functional-meta-sm';
24
+ $ds-typography-functional-meta-md: 'functional-meta-md';
25
+ $ds-typography-functional-ingress-sm: 'functional-ingress-sm';
26
+ $ds-typography-functional-ingress-md: 'functional-ingress-md';
27
+ $ds-typography-detail-dropcap: 'detail-dropcap';
28
+ $ds-typography-detail-gameheader: 'detail-gameheader';
29
+ $ds-typography-detail-medryckare: 'detail-medryckare';
30
+ $ds-typography-detail-mellanrubrik: 'detail-mellanrubrik';
31
+ $ds-typography-detail-direkt-header: 'detail-direkt-header';
32
+ $ds-typography-detail-teaser-standard: 'detail-teaser-standard';
33
+ $ds-typography-detail-teaser-standard-opinion: 'detail-teaser-standard-opinion';
34
+ $ds-typography-detail-teaser-standard-compact: 'detail-teaser-standard-compact';
35
+ $ds-typography-detail-teaser-standard-compact-opinion: 'detail-teaser-standard-compact-opinion';
36
+ $ds-typography-detail-teaser-large: 'detail-teaser-large';
37
+ $ds-typography-detail-teaser-large-compact: 'detail-teaser-large-compact';
38
+ $ds-typography-detail-teaser-storrubrik-opinion: 'detail-teaser-storrubrik-opinion';
39
+ $ds-typography-detail-teaser-storrubrik: 'detail-teaser-storrubrik';
40
+ $ds-typography-detail-teaser-twin: 'detail-teaser-twin';
41
+ $ds-typography-detail-teaser-tipsa: 'detail-teaser-tipsa';
42
+ $ds-typography-detail-teaser-baotaxl: 'detail-teaser-baotaxl';
43
+ $ds-typography-detail-teaser-longlife: 'detail-teaser-longlife';
44
+ $ds-typography-detail-teaser-breaking: 'detail-teaser-breaking';
45
+ $ds-typography-detail-teaser-large-opinion: 'detail-teaser-large-opinion';
46
+ $ds-typography-detail-teaser-story: 'detail-teaser-story';
47
+ $ds-typography-detail-article-standard: 'detail-article-standard';
48
+ $ds-typography-detail-article-opinion: 'detail-article-opinion';
49
+ $ds-typography-detail-article-longread: 'detail-article-longread';
50
+ $ds-typography-detail-article-longread-premium: 'detail-article-longread-premium';
51
+ $ds-typography-detail-article-direkt: 'detail-article-direkt';
52
+ $ds-typography-detail-article-direct-opinion: 'detail-article-direct-opinion';
53
+ $ds-typography-detail-article-quote: 'detail-article-quote';
package/foundations/variables/typographyScreenExtraLarge.scss ADDED
@@ -0,0 +1,381 @@
1
+ $typographyScreenExtraLarge: (
2
+ expressive-heading-xxs: (
3
+ fontFamily: "DN Serif Headline",
4
+ fontSize: 16,
5
+ fontWeight: Bold,
6
+ letterSpacing: 0,
7
+ lineHeight: 1.2
8
+ ),
9
+ expressive-heading-xs: (
10
+ fontFamily: "DN Serif Headline",
11
+ fontSize: 24,
12
+ fontWeight: Bold,
13
+ letterSpacing: 0,
14
+ lineHeight: 1.1
15
+ ),
16
+ expressive-heading-sm: (
17
+ fontFamily: "DN Serif Display",
18
+ fontSize: 32,
19
+ fontWeight: Bold,
20
+ letterSpacing: 0,
21
+ lineHeight: 1.1
22
+ ),
23
+ expressive-heading-md: (
24
+ fontFamily: "DN Serif Display",
25
+ fontSize: 48,
26
+ fontWeight: Bold,
27
+ letterSpacing: 0,
28
+ lineHeight: 1.1
29
+ ),
30
+ expressive-heading-lg: (
31
+ fontFamily: "DN Serif Display",
32
+ fontSize: 56,
33
+ fontWeight: Bold,
34
+ letterSpacing: 0,
35
+ lineHeight: 1.1
36
+ ),
37
+ expressive-heading-xl: (
38
+ fontFamily: "DN Serif Display",
39
+ fontSize: 64,
40
+ fontWeight: Bold,
41
+ letterSpacing: 0,
42
+ lineHeight: 1.1
43
+ ),
44
+ expressive-body-sm: (
45
+ fontFamily: "DN Serif Text",
46
+ fontSize: 14,
47
+ fontWeight: Regular,
48
+ letterSpacing: 0,
49
+ lineHeight: 1.5
50
+ ),
51
+ expressive-body-md: (
52
+ fontFamily: "DN Serif Text",
53
+ fontSize: 16,
54
+ fontWeight: Regular,
55
+ letterSpacing: 0,
56
+ lineHeight: 1.5
57
+ ),
58
+ expressive-body-lg: (
59
+ fontFamily: "DN Serif Text",
60
+ fontSize: 18,
61
+ fontWeight: Regular,
62
+ letterSpacing: 0,
63
+ lineHeight: 1.5
64
+ ),
65
+ expressive-ingress-sm: (
66
+ fontFamily: "DN Serif Text",
67
+ fontSize: 20,
68
+ fontWeight: SemiBold,
69
+ letterSpacing: 0,
70
+ lineHeight: 1.5
71
+ ),
72
+ expressive-ingress-md: (
73
+ fontFamily: "DN Serif Headline",
74
+ fontSize: 24,
75
+ fontWeight: SemiBold,
76
+ letterSpacing: 0,
77
+ lineHeight: 1.5
78
+ ),
79
+ functional-heading-xxs: (
80
+ fontFamily: "DN Sans",
81
+ fontSize: 16,
82
+ fontWeight: Bold,
83
+ letterSpacing: 0,
84
+ lineHeight: 1.1
85
+ ),
86
+ functional-heading-xs: (
87
+ fontFamily: "DN Sans",
88
+ fontSize: 20,
89
+ fontWeight: Bold,
90
+ letterSpacing: 0,
91
+ lineHeight: 1.1
92
+ ),
93
+ functional-heading-sm: (
94
+ fontFamily: "DN Sans",
95
+ fontSize: 24,
96
+ fontWeight: Bold,
97
+ letterSpacing: 0,
98
+ lineHeight: 1.2
99
+ ),
100
+ functional-heading-md: (
101
+ fontFamily: "DN Sans",
102
+ fontSize: 28,
103
+ fontWeight: Bold,
104
+ letterSpacing: 0,
105
+ lineHeight: 1.1
106
+ ),
107
+ functional-heading-lg: (
108
+ fontFamily: "DN Sans",
109
+ fontSize: 36,
110
+ fontWeight: Bold,
111
+ letterSpacing: 0,
112
+ lineHeight: 1.1
113
+ ),
114
+ functional-heading-xl: (
115
+ fontFamily: "DN Sans",
116
+ fontSize: 40,
117
+ fontWeight: Bold,
118
+ letterSpacing: 0,
119
+ lineHeight: 1.1
120
+ ),
121
+ functional-label-sm: (
122
+ fontFamily: "DN Sans",
123
+ fontSize: 12,
124
+ fontWeight: Bold,
125
+ letterSpacing: 0.5,
126
+ lineHeight: 1.1,
127
+ textTransform: uppercase
128
+ ),
129
+ functional-label-md: (
130
+ fontFamily: "DN Sans",
131
+ fontSize: 16,
132
+ fontWeight: Bold,
133
+ letterSpacing: 0,
134
+ lineHeight: 1.1
135
+ ),
136
+ functional-body-sm: (
137
+ fontFamily: "DN Sans",
138
+ fontSize: 14,
139
+ fontWeight: Regular,
140
+ letterSpacing: 0,
141
+ lineHeight: 1.5
142
+ ),
143
+ functional-body-md: (
144
+ fontFamily: "DN Sans",
145
+ fontSize: 16,
146
+ fontWeight: Regular,
147
+ letterSpacing: 0,
148
+ lineHeight: 1.5
149
+ ),
150
+ functional-body-lg: (
151
+ fontFamily: "DN Sans",
152
+ fontSize: 18,
153
+ fontWeight: Regular,
154
+ letterSpacing: 0,
155
+ lineHeight: 1.5
156
+ ),
157
+ functional-meta-sm: (
158
+ fontFamily: "DN Sans",
159
+ fontSize: 10,
160
+ fontWeight: Regular,
161
+ letterSpacing: 0.2,
162
+ lineHeight: 1.2
163
+ ),
164
+ functional-meta-md: (
165
+ fontFamily: "DN Sans",
166
+ fontSize: 12,
167
+ fontWeight: Regular,
168
+ letterSpacing: 0,
169
+ lineHeight: 1.2
170
+ ),
171
+ functional-ingress-sm: (
172
+ fontFamily: "DN Sans",
173
+ fontSize: 20,
174
+ fontWeight: Regular,
175
+ letterSpacing: 0,
176
+ lineHeight: 1.5
177
+ ),
178
+ functional-ingress-md: (
179
+ fontFamily: "DN Sans",
180
+ fontSize: 24,
181
+ fontWeight: Regular,
182
+ letterSpacing: 0,
183
+ lineHeight: 1.5
184
+ ),
185
+ detail-dropcap: (
186
+ fontFamily: "DN Serif Display",
187
+ fontSize: 92,
188
+ fontWeight: Bold,
189
+ letterSpacing: 0,
190
+ lineHeight: 1
191
+ ),
192
+ detail-gameheader: (
193
+ fontFamily: "DN Serif Display",
194
+ fontSize: 36,
195
+ fontWeight: Regular,
196
+ letterSpacing: 0,
197
+ lineHeight: 1.1
198
+ ),
199
+ detail-medryckare: (
200
+ fontFamily: "DN Serif Text",
201
+ fontSize: 16,
202
+ fontWeight: Regular,
203
+ letterSpacing: 0,
204
+ lineHeight: 1.4
205
+ ),
206
+ detail-mellanrubrik: (
207
+ fontFamily: "DN Serif Display",
208
+ fontSize: 28,
209
+ fontWeight: Bold,
210
+ letterSpacing: 0,
211
+ lineHeight: 1.1
212
+ ),
213
+ detail-direkt-header: (
214
+ fontFamily: "DN Serif Display",
215
+ fontSize: 48,
216
+ fontWeight: Regular,
217
+ letterSpacing: 0,
218
+ lineHeight: 1.1
219
+ ),
220
+ detail-teaser-standard: (
221
+ fontFamily: "DN Serif Display",
222
+ fontSize: 36,
223
+ fontWeight: Bold,
224
+ letterSpacing: 0,
225
+ lineHeight: 1.1
226
+ ),
227
+ detail-teaser-standard-opinion: (
228
+ fontFamily: "DN Serif Display",
229
+ fontSize: 36,
230
+ fontWeight: Regular,
231
+ letterSpacing: 0,
232
+ lineHeight: 1.1,
233
+ fontStyle: italic
234
+ ),
235
+ detail-teaser-standard-compact: (
236
+ fontFamily: "DN Serif Display",
237
+ fontSize: 24,
238
+ fontWeight: Bold,
239
+ letterSpacing: 0,
240
+ lineHeight: 1.2
241
+ ),
242
+ detail-teaser-standard-compact-opinion: (
243
+ fontFamily: "DN Serif Display",
244
+ fontSize: 24,
245
+ fontWeight: Regular,
246
+ letterSpacing: 0,
247
+ lineHeight: 1.2,
248
+ fontStyle: italic
249
+ ),
250
+ detail-teaser-large: (
251
+ fontFamily: "DN Serif Display",
252
+ fontSize: 48,
253
+ fontWeight: Bold,
254
+ letterSpacing: 0,
255
+ lineHeight: 1.1
256
+ ),
257
+ detail-teaser-large-compact: (
258
+ fontFamily: "DN Serif Display",
259
+ fontSize: 36,
260
+ fontWeight: Bold,
261
+ letterSpacing: 0,
262
+ lineHeight: 1.1
263
+ ),
264
+ detail-teaser-storrubrik-opinion: (
265
+ fontFamily: "DN Serif Display",
266
+ fontSize: 56,
267
+ fontWeight: Regular,
268
+ letterSpacing: 0,
269
+ lineHeight: 1.1,
270
+ fontStyle: italic
271
+ ),
272
+ detail-teaser-storrubrik: (
273
+ fontFamily: "DN Serif Display",
274
+ fontSize: 56,
275
+ fontWeight: Bold,
276
+ letterSpacing: 0,
277
+ lineHeight: 1.1
278
+ ),
279
+ detail-teaser-twin: (
280
+ fontFamily: "DN Serif Display",
281
+ fontSize: 22,
282
+ fontWeight: Bold,
283
+ letterSpacing: 0,
284
+ lineHeight: 1.2
285
+ ),
286
+ detail-teaser-tipsa: (
287
+ fontFamily: "DN Serif Display",
288
+ fontSize: 22,
289
+ fontWeight: Bold,
290
+ letterSpacing: 0,
291
+ lineHeight: 1.1
292
+ ),
293
+ detail-teaser-baotaxl: (
294
+ fontFamily: "DN Serif Display",
295
+ fontSize: 80,
296
+ fontWeight: Bold,
297
+ letterSpacing: 0,
298
+ lineHeight: 1.1
299
+ ),
300
+ detail-teaser-longlife: (
301
+ fontFamily: "DN Sans",
302
+ fontSize: 20,
303
+ fontWeight: Bold,
304
+ letterSpacing: 0,
305
+ lineHeight: 1.1
306
+ ),
307
+ detail-teaser-breaking: (
308
+ fontFamily: "DN Serif Display",
309
+ fontSize: 64,
310
+ fontWeight: ExtraBold,
311
+ letterSpacing: 0,
312
+ lineHeight: 1.1
313
+ ),
314
+ detail-teaser-large-opinion: (
315
+ fontFamily: "DN Serif Display",
316
+ fontSize: 36,
317
+ fontWeight: Regular,
318
+ letterSpacing: 0,
319
+ lineHeight: 1.1,
320
+ fontStyle: italic
321
+ ),
322
+ detail-teaser-story: (
323
+ fontFamily: "DN Serif Display",
324
+ fontSize: 40,
325
+ fontWeight: Regular,
326
+ letterSpacing: 0,
327
+ lineHeight: 1.1
328
+ ),
329
+ detail-article-standard: (
330
+ fontFamily: "DN Serif Display",
331
+ fontSize: 48,
332
+ fontWeight: Regular,
333
+ letterSpacing: 0,
334
+ lineHeight: 1.1,
335
+ fontStyle: italic
336
+ ),
337
+ detail-article-opinion: (
338
+ fontFamily: "DN Serif Display",
339
+ fontSize: 48,
340
+ fontWeight: Regular,
341
+ letterSpacing: 0,
342
+ lineHeight: 1.1,
343
+ fontStyle: italic
344
+ ),
345
+ detail-article-longread: (
346
+ fontFamily: "DN Serif Display",
347
+ fontSize: 56,
348
+ fontWeight: Regular,
349
+ letterSpacing: 0,
350
+ lineHeight: 1.1
351
+ ),
352
+ detail-article-longread-premium: (
353
+ fontFamily: "DN Serif Display",
354
+ fontSize: 56,
355
+ fontWeight: Bold,
356
+ letterSpacing: 0,
357
+ lineHeight: 1.1
358
+ ),
359
+ detail-article-direkt: (
360
+ fontFamily: "DN Serif Display",
361
+ fontSize: 32,
362
+ fontWeight: Bold,
363
+ letterSpacing: 0,
364
+ lineHeight: 1.1
365
+ ),
366
+ detail-article-direct-opinion: (
367
+ fontFamily: "DN Serif Display",
368
+ fontSize: 32,
369
+ fontWeight: Regular,
370
+ letterSpacing: 0,
371
+ lineHeight: 1.1,
372
+ fontStyle: italic
373
+ ),
374
+ detail-article-quote: (
375
+ fontFamily: "DN Serif Display",
376
+ fontSize: 28,
377
+ fontWeight: Bold,
378
+ letterSpacing: 0,
379
+ lineHeight: 1.2
380
+ )
381
+ );