@royaloperahouse/harmonic 0.1.1-a-test → 0.1.1-c

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 (10) hide show
  1. package/dist/components/atoms/Typography/Typography.d.ts +0 -1
  2. package/dist/harmonic.cjs.development.css +93 -190
  3. package/dist/harmonic.cjs.development.js +2 -3
  4. package/dist/harmonic.cjs.development.js.map +1 -1
  5. package/dist/harmonic.cjs.production.min.js +1 -1
  6. package/dist/harmonic.cjs.production.min.js.map +1 -1
  7. package/dist/harmonic.esm.js +3 -7
  8. package/dist/harmonic.esm.js.map +1 -1
  9. package/package.json +2 -2
  10. package/dist/components/Typography/AltHeaders/AltHeaders.d.ts +0 -4
package/dist/components/atoms/Typography/Typography.d.ts CHANGED
@@ -1,5 +1,4 @@
1
1
  import React from 'react';
2
- import './Typography.css';
3
2
  import { IAltHeaderProps, IBodyTextProps, IHeaderProps, IOverlineProps, IStyledTag, ISubtitleProps } from '../../../types/typography';
4
3
  export declare const StyledTag: ({ tag, typography, children, level }: IStyledTag) => React.JSX.Element;
5
4
  export declare const AltHeader: ({ semanticLevel, level, children }: IAltHeaderProps) => React.JSX.Element;
package/dist/harmonic.cjs.development.css CHANGED
@@ -1,39 +1,43 @@
1
- /* TEMPORARY CSS FILE - will relocate when CSS module issue is fixed */
1
+ /* TEMPORARY SCSS FILE - will relocate when CSS module issue is fixed */
2
2
 
3
3
  :root {
4
- --font-family-sans: 'Grey LL Bold', 'Roboto', sans-serif;
5
- --font-family-serif: 'Victor Serif Medium', 'Inria Serif Regular', serif;
6
- --harmonic-red: #F40B0B;
7
- --harmonic-black: #000000;
8
- --text-link-underline-offset: 4px;
4
+ --font-family-sans: 'Grey LL Bold', 'Roboto', sans-serif;
5
+ --font-family-serif: 'Victor Serif Medium', 'Inria Serif Regular', serif;
6
+ --harmonic-red: #F40B0B;
7
+ --harmonic-black: #000000;
8
+ --text-link-underline-offset: 4px;
9
9
  }
10
10
 
11
- /* ~~~~~ Colour Classes ~~~~~ */
11
+ .styles_em__v4FoO {
12
+ font-style: italic;
13
+ }
14
+
15
+ /* ~~~~~ Color Classes ~~~~~ */
12
16
  .styles_color-black__a05Fo {
13
17
  color: var(--harmonic-black);
14
18
  }
15
19
 
16
20
  .styles_color-red__zwTZW {
17
- color: var(--harmonic-red)
21
+ color: var(--harmonic-red);
18
22
  }
19
23
 
20
- /* ~~~~~ Device media queries ~~~~~ */
21
- /* mobile */
24
+ /* ~~~~~ Mobile Styles ~~~~~ */
22
25
  @media (max-width: 600px) {
23
-
24
- /* mobile letter spacing */
25
- .styles_display__VgnTB.styles_large__vqVxY, .styles_display__VgnTB.styles_small__e7YDe {
26
- letter-spacing: -1.5px;
26
+ /* Letter Spacing - Mobile */
27
+ .styles_display__VgnTB {
28
+ &.styles_large__vqVxY, &.styles_small__e7YDe {
29
+ letter-spacing: -1.5px;
30
+ }
31
+ &.styles_large__vqVxY.styles_serif__b-ZjM, &.styles_large__vqVxY.styles_em__v4FoO,
32
+ &.styles_small__e7YDe.styles_serif__b-ZjM, &.styles_small__e7YDe.styles_em__v4FoO {
33
+ letter-spacing: -0.5px;
34
+ }
27
35
  }
28
36
 
29
37
  .styles_header-small__W-GSS {
30
38
  letter-spacing: -0.75px;
31
39
  }
32
40
 
33
- .styles_display__VgnTB.styles_large__vqVxY.styles_serif__b-ZjM , .styles_display__VgnTB.styles_large__vqVxY.styles_em__v4FoO, .styles_display__VgnTB.styles_small__e7YDe.styles_serif__b-ZjM, .styles_display__VgnTB.styles_small__e7YDe.styles_em__v4FoO, .styles_header__UDH-H.styles_small__e7YDe.styles_serif__b-ZjM, .styles_header__UDH-H.styles_small__e7YDe.styles_em__v4FoO, .styles_captiontext__-TA6x {
34
- letter-spacing: -0.5px;
35
- }
36
-
37
41
  .styles_subtitle__os3DH.styles_small__e7YDe, .styles_bodycopy__uEx9r.styles_medium__WQPZj, .styles_bodycopy__uEx9r.styles_small__e7YDe {
38
42
  letter-spacing: -0.2px;
39
43
  }
@@ -42,244 +46,149 @@
42
46
  letter-spacing: -0.3px;
43
47
  }
44
48
 
45
- /* Display */
46
- .styles_display__VgnTB.styles_large__vqVxY {
47
- font-size: 38px;
48
- }
49
-
50
- .styles_display__VgnTB.styles_small__e7YDe {
51
- font-size: 32px;
52
- }
53
-
54
- /* Header */
55
- .styles_header__UDH-H.styles_large__vqVxY {
56
- font-size: 28px;
49
+ /* Typography Sizes - Mobile */
50
+ .styles_display__VgnTB {
51
+ &.styles_large__vqVxY { font-size: 38px; }
52
+ &.styles_small__e7YDe { font-size: 32px; }
57
53
  }
58
54
 
59
- .styles_header__UDH-H.styles_medium__WQPZj {
60
- font-size: 24px;
61
- }
62
-
63
- .styles_header__UDH-H.styles_small__e7YDe {
64
- font-size: 20px;
65
- }
66
-
67
- /* Subtitle */
68
- .styles_subtitle__os3DH.styles_large__vqVxY {
69
- font-size: 17px;
70
- }
71
-
72
- .styles_subtitle__os3DH.styles_small__e7YDe {
73
- font-size: 14px;
74
- }
75
-
76
- /* Body Copy */
77
- .styles_bodycopy__uEx9r.styles_large__vqVxY {
78
- font-size: 17px;
79
- }
80
-
81
- .styles_bodycopy__uEx9r.styles_medium__WQPZj {
82
- font-size: 14px;
55
+ .styles_header__UDH-H {
56
+ &.styles_large__vqVxY { font-size: 28px; line-height: 34px; }
57
+ &.styles_medium__WQPZj { font-size: 24px; line-height: 28px; }
58
+ &.styles_small__e7YDe { font-size: 20px; line-height: 26px; }
83
59
  }
84
60
 
85
- .styles_bodycopy__uEx9r.styles_small__e7YDe {
86
- font-size: 11px;
61
+ .styles_subtitle__os3DH {
62
+ &.styles_large__vqVxY { font-size: 17px; line-height: 24px; }
63
+ &.styles_small__e7YDe { font-size: 14px; line-height: 20px; }
87
64
  }
88
65
 
89
- /* Overline */
90
- .styles_overline__5xGDa.styles_large__vqVxY {
91
- font-size: 14px;
92
- }
93
-
94
- .styles_overline__5xGDa.styles_small__e7YDe {
95
- font-size: 12px;
66
+ .styles_bodycopy__uEx9r {
67
+ &.styles_large__vqVxY { font-size: 17px; line-height: 24px; }
68
+ &.styles_medium__WQPZj { font-size: 14px; line-height: 20px; }
69
+ &.styles_small__e7YDe { font-size: 11px; line-height: 16px; }
96
70
  }
97
71
 
98
- /* Caption */
99
- .styles_captiontext__-TA6x {
100
- font-size: 14px;
72
+ .styles_overline__5xGDa {
73
+ &.styles_large__vqVxY { font-size: 14px; line-height: 17px; }
74
+ &.styles_small__e7YDe { font-size: 12px; line-height: 14px; }
101
75
  }
102
76
 
103
- /* Text Link */
104
- .styles_textlinkharmonic__S77lE {
77
+ .styles_captiontext__-TA6x, .styles_navigationtext__qnnIo, .styles_textlinkharmonic__S77lE {
105
78
  font-size: 14px;
79
+ line-height: 17px;
106
80
  }
107
81
  }
108
82
 
109
- /* ~~~~~ Letter Spacing Desktop ~~~~~ */
110
-
111
- .styles_display__VgnTB.styles_large__vqVxY {
112
- letter-spacing: -5px;
113
- }
114
-
115
- .styles_header__UDH-H.styles_large__vqVxY {
116
- letter-spacing: -1.5px;
117
- }
118
-
119
- .styles_header__UDH-H.styles_medium__WQPZj {
120
- letter-spacing: -1.5px;
121
- }
122
-
123
- .styles_display__VgnTB.styles_large__vqVxY.styles_serif__b-ZjM, .styles_display__VgnTB.styles_large__vqVxY.styles_em__v4FoO, .styles_display__VgnTB.styles_small__e7YDe {
124
- letter-spacing: -3px;
125
- }
126
-
127
- .styles_display__VgnTB.styles_small__e7YDe.styles_serif__b-ZjM, .styles_display__VgnTB.styles_small__e7YDe.styles_em__v4FoO {
128
- letter-spacing: -2px;
129
- }
130
-
131
- .styles_header__UDH-H.styles_large__vqVxY.styles_serif__b-ZjM, .styles_header__UDH-H.styles_large__vqVxY.styles_em__v4FoO, .styles_header__UDH-H.styles_medium__WQPZj.styles_serif__b-ZjM, .styles_header__UDH-H.styles_medium__WQPZj.styles_em__v4FoO, .styles_header__UDH-H.styles_small__e7YDe, .styles_header__UDH-H.styles_small__e7YDe.styles_serif__b-ZjM, .styles_header__UDH-H.styles_small__e7YDe.styles_em__v4FoO, .styles_subtitle__os3DH, .styles_bodycopy__uEx9r, .styles_buttontext__UPumF, .styles_captiontext__-TA6x, .styles_navigationtext__qnnIo, .styles_textlinkharmonic__S77lE {
132
- letter-spacing: -0.5px;
133
- }
134
-
135
- .styles_overline-large__nRJSl {
136
- letter-spacing: -0.3px;
137
- }
138
-
139
- .styles_overline-small__iF6Pd {
140
- letter-spacing: -0.2px;
141
- }
142
-
143
-
144
- /* ~~~~~ Display Headers ~~~~~ */
145
-
83
+ /* ~~~~~ Desktop Styles ~~~~~ */
146
84
  .styles_display__VgnTB {
147
85
  font-family: var(--font-family-sans);
148
- font-weight: 700;
149
- }
150
-
151
- .styles_display__VgnTB em,
152
- .styles_display__VgnTB.styles_serif__b-ZjM {
153
- font-family: var(--font-family-serif);
154
- font-weight: 500;
155
- }
86
+ &.styles_large__vqVxY {
87
+ font-size: 96px;
88
+ letter-spacing: -5px;
89
+ }
156
90
 
157
- .styles_display__VgnTB.styles_large__vqVxY {
158
- font-size: 96px;
159
- }
91
+ &.styles_small__e7YDe {
92
+ font-size: 68px;
93
+ letter-spacing: -3px;
94
+ font-weight: 500;
95
+ }
160
96
 
161
- .styles_display__VgnTB.styles_small__e7YDe {
162
- font-size: 68px;
163
- font-weight: 500;
97
+ &.styles_serif__b-ZjM, &.styles_em__v4FoO {
98
+ font-family: var(--font-family-serif);
99
+ font-weight: 500;
100
+ }
164
101
  }
165
102
 
166
-
167
- /* ~~~~~ Header - H1 , H2 , H3 ~~~~~ */
168
-
169
103
  .styles_header__UDH-H {
170
104
  font-family: var(--font-family-sans);
171
105
  font-weight: 500;
172
- }
173
106
 
174
- .styles_header__UDH-H em,
175
- .styles_header__UDH-H.styles_serif__b-ZjM {
176
- font-family: var(--font-family-serif);
177
- font-weight: 500;
178
- }
107
+ &.styles_large__vqVxY {
108
+ font-size: 44px;
109
+ line-height: 48px;
110
+ letter-spacing: -1.5px;
111
+ }
179
112
 
180
- .styles_header__UDH-H.styles_large__vqVxY {
181
- font-size: 44px;
182
- }
113
+ &.styles_medium__WQPZj {
114
+ font-size: 34px;
115
+ line-height: 40px;
116
+ letter-spacing: -1.5px;
117
+ }
183
118
 
184
- .styles_header__UDH-H.styles_medium__WQPZj {
185
- font-size: 34px;
186
- }
119
+ &.styles_small__e7YDe {
120
+ font-size: 26px;
121
+ line-height: 32px;
122
+ letter-spacing: -0.5px;
123
+ }
187
124
 
188
- .styles_header__UDH-H.styles_small__e7YDe {
189
- font-size: 26px;
125
+ &.styles_serif__b-ZjM, &.styles_em__v4FoO {
126
+ font-family: var(--font-family-serif);
127
+ font-weight: 500;
128
+ }
190
129
  }
191
130
 
192
-
193
-
194
- /* ~~~~~ Subtitle ~~~~~ */
195
-
131
+ /* Subtitle */
196
132
  .styles_subtitle__os3DH {
197
133
  font-family: var(--font-family-sans);
198
134
  font-weight: 500;
199
- }
200
-
201
- .styles_subtitle__os3DH.styles_large__vqVxY {
202
- font-size: 19px;
203
- }
204
135
 
205
- .styles_subtitle__os3DH.styles_small__e7YDe {
206
- font-size: 17px;
136
+ &.styles_large__vqVxY { font-size: 19px; line-height: 26px; }
137
+ &.styles_small__e7YDe { font-size: 17px; line-height: 24px; }
207
138
  }
208
139
 
209
-
210
- /* ~~~~~ Body copy ~~~~~ */
211
-
140
+ /* Body Copy */
212
141
  .styles_bodycopy__uEx9r {
213
142
  font-family: var(--font-family-sans);
214
143
  font-weight: 400;
215
- }
216
-
217
- .styles_bodycopy__uEx9r.styles_large__vqVxY {
218
- font-size: 19px;
219
- }
220
-
221
- .styles_bodycopy__uEx9r.styles_medium__WQPZj {
222
- font-size: 17px;
223
- }
224
144
 
225
- .styles_bodycopy__uEx9r.styles_small__e7YDe {
226
- font-size: 14px;
145
+ &.styles_large__vqVxY { font-size: 19px; line-height: 26px; }
146
+ &.styles_medium__WQPZj { font-size: 17px; line-height: 24px; }
147
+ &.styles_small__e7YDe { font-size: 14px; line-height: 20px; }
227
148
  }
228
149
 
229
-
230
- /* ~~~~~ Overline ~~~~~ */
231
-
150
+ /* Overline */
232
151
  .styles_overline__5xGDa {
233
152
  font-family: var(--font-family-sans);
234
153
  font-weight: 500;
235
154
  text-transform: uppercase;
236
- }
237
155
 
238
- .styles_overline__5xGDa.styles_large__vqVxY {
239
- font-size: 14px;
240
- }
241
-
242
- .styles_overline__5xGDa.styles_small__e7YDe {
243
- font-size: 12px;
156
+ &.styles_large__vqVxY { font-size: 14px; line-height: 18px; letter-spacing: -0.3px; }
157
+ &.styles_small__e7YDe { font-size: 12px; line-height: 14px; letter-spacing: -0.2px; }
244
158
  }
245
159
 
246
- /* ~~~~~ Button text ~~~~~ */
247
-
160
+ /* Button Text */
248
161
  .styles_buttontext__UPumF {
249
162
  font-family: var(--font-family-sans);
250
163
  font-weight: 400;
251
164
  font-size: 17px;
165
+ line-height: 20px;
252
166
  }
253
167
 
254
-
255
- /* ~~~~~ Caption text ~~~~~ */
256
-
168
+ /* Caption Text */
257
169
  .styles_captiontext__-TA6x {
258
170
  font-size: 17px;
259
171
  font-weight: 400;
260
172
  font-style: italic;
261
- line-height: auto;
173
+ line-height: 24px;
262
174
  }
263
175
 
264
-
265
- /* ~~~~~ Navigation text ~~~~~ */
266
-
176
+ /* Navigation Text */
267
177
  .styles_navigationtext__qnnIo {
268
178
  font-family: var(--font-family-sans);
269
179
  font-size: 17px;
270
180
  font-weight: 500;
271
181
  text-transform: uppercase;
272
- line-height: auto;
182
+ line-height: 17px;
273
183
  }
274
184
 
275
-
276
- /* ~~~~~ Text link ~~~~~ */
277
-
185
+ /* Text Link */
278
186
  .styles_textlinkharmonic__S77lE {
279
187
  font-family: var(--font-family-sans);
280
188
  font-weight: 500;
281
189
  text-transform: uppercase;
282
190
  font-size: 17px;
191
+ line-height: 14px;
283
192
  border-bottom: solid 1px;
284
193
  width: -moz-fit-content;
285
194
  width: fit-content;
@@ -288,9 +197,3 @@
288
197
  cursor: pointer;
289
198
  text-decoration: none;
290
199
  }
291
-
292
- /* Typography.css */
293
- .Typography_test__1llmb {
294
- /* Add your styles here */
295
- color: red!important;
296
- }
package/dist/harmonic.cjs.development.js CHANGED
@@ -3404,7 +3404,6 @@ var StyledTag = function StyledTag(_ref) {
3404
3404
  children = _ref.children,
3405
3405
  level = _ref.level;
3406
3406
  return /*#__PURE__*/React__default.createElement(Wrapper$1, {
3407
- className: "test",
3408
3407
  typography: typography,
3409
3408
  as: tag,
3410
3409
  level: level
@@ -4441,7 +4440,7 @@ var TextFieldLegacy = function TextFieldLegacy(_ref) {
4441
4440
  };
4442
4441
 
4443
4442
  var _templateObject$q, _templateObject2$f;
4444
- var TextLinkWrapper = /*#__PURE__*/styled__default.a(_templateObject$q || (_templateObject$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-bottom: 1px solid;\n padding-bottom: ", ";\n font-family: var(--font-family-overline);\n font-size: var(--font-size-overline-1);\n font-weight: var(--font-weight-overline-1);\n line-height: var(--line-height-overline-1);\n letter-spacing: var(--letter-spacing-overline-1);\n text-transform: var(--text-transform-overline);\n color: var(--base-color-", ");\n width: fit-content;\n display: flex;\n align-items: center;\n cursor: pointer;\n text-decoration: none;\n"])), function (_ref) {
4443
+ var TextLinkWrapper = /*#__PURE__*/styled__default.a(_templateObject$q || (_templateObject$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-bottom: 1px solid;\n padding-bottom: ", ";\n font-family: var(--harmonic-font-family-sans);\n font-size: 17px;\n font-weight: 500;\n line-height: 14px;\n letter-spacing: var(--letter-spacing-overline-1);\n color: var(--base-color-", ");\n width: fit-content;\n display: flex;\n align-items: center;\n cursor: pointer;\n text-decoration: none;\n\n @media (max-width: 600px) {\n font-size: 14px;\n}\n"])), function (_ref) {
4445
4444
  var iconName = _ref.iconName;
4446
4445
  return iconName ? 'calc(var(--text-link-underline-offset) - 4px)' : 'var(--text-link-underline-offset)';
4447
4446
  }, function (_ref2) {
@@ -10408,7 +10407,7 @@ var ModalWindow = function ModalWindow(_ref) {
10408
10407
  };
10409
10408
 
10410
10409
  var _templateObject$1l;
10411
- var GlobalStyles = /*#__PURE__*/styled.createGlobalStyle(_templateObject$1l || (_templateObject$1l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n html {\n --base-color-primary: ", ";\n --base-color-core: ", ";\n --base-color-stream: ", ";\n --base-color-cinema: ", ";\n --base-color-white: ", ";\n --base-color-black: ", ";\n --base-color-dark-grey: ", ";\n --base-color-mid-grey: ", ";\n --base-color-light-grey: ", ";\n --error-color-state: ", ";\n --medium-color-state: ", ";\n --good-color-state: ", ";\n --base-color-darkgrey: ", ";\n --base-color-midgrey: ", ";\n --base-color-lightgrey: ", ";\n --base-color-transparent: transparent;\n --base-color-errorstate: ", ";\n --base-color-mediumstate: ", ";\n --base-color-goodstate: ", ";\n --base-color-progress: ", ";\n --base-color-navigation: ", ";\n --base-color-lapislazuli: ", ";\n --base-color-lemonchiffon: ", ";\n\n --button-height: ", ";\n --button-line-height: ", ";\n --button-padding-x: ", ";\n --button-padding-y: ", ";\n --button-padding-y-icon: ", ";\n --button-icon-margin: ", ";\n --button-icon-width: ", ";\n --button-icon-height: ", ";\n --button-font-size: ", ";\n --button-font-weight: ", ";\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n --margin-header-1: ", ";\n\n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n --margin-header-2: ", ";\n\n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n --margin-header-3: ", ";\n\n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n --margin-header-4: ", ";\n\n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n --margin-header-5: ", ";\n\n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n --margin-header-6: ", ";\n\n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n\n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n\n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n\n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n\n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n\n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n\n --font-size-overline-3: ", ";\n --font-weight-overline-3: ", ";\n --letter-spacing-overline-3: ", ";\n --line-height-overline-3: ", "; \n\n --font-size-overline-4: ", ";\n --font-weight-overline-4: ", ";\n --letter-spacing-overline-4: ", ";\n --line-height-overline-4: ", ";\n\n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n\n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n\n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n\n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-listing: ", ";\n --font-size-individual-listing-name: ", ";\n --line-height-individual-listing-name: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n\n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n\n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n\n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n\n --font-family-navigation: ", ";\n --font-size-navigation: ", ";\n --font-weight-navigation: ", ";\n --line-height-navigation: ", ";\n --text-transform-navigation: ", ";\n --letter-spacing-navigation: ", ";\n\n --navigation-small-gap: ", ";\n --navigation-middle-gap: ", ";\n --navigation-large-gap: ", ";\n --navigation-xlarge-gap: ", ";\n --navigation-large-margin: ", ";\n\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --grid-margin: ", ";\n --grid-outer-margin: ", ";\n --grid-template-columns: calc(", " - ", ") calc(", " - ", " - ", ") repeat(12, minmax(0,1fr)) calc(", " - ", " - ", ") calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: 0;\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --text-link-underline-offset: ", ";\n\n --cards-spacing-stack: ", ";\n\n --editorial-subtitle-margin-bottom: ", ";\n --editorial-margin-between: ", ";\n --editorial-spacing-hover: ", ";\n --anchor-tabs-height: 70px;\n \n\n @media ", " {\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n \n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n \n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n \n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n \n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n \n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n \n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n \n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n \n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n \n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n \n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n \n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n \n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n \n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n \n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n \n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n \n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n \n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n \n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n \n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --anchor-tabs-height: 60px;\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n }\n\n @media ", " {\n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-header-6: ", ";\n\n --font-size-altHeader-4: ", ";\n\n --font-size-body-1: ", ";\n }\n\n @media ", " {\n \n }\n\n @media ", " {\n \n }\n }\n"])), function (_ref) {
10410
+ var GlobalStyles = /*#__PURE__*/styled.createGlobalStyle(_templateObject$1l || (_templateObject$1l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n html {\n --base-color-primary: ", ";\n --base-color-core: ", ";\n --base-color-stream: ", ";\n --base-color-cinema: ", ";\n --base-color-white: ", ";\n --base-color-black: ", ";\n --base-color-dark-grey: ", ";\n --base-color-mid-grey: ", ";\n --base-color-light-grey: ", ";\n --error-color-state: ", ";\n --medium-color-state: ", ";\n --good-color-state: ", ";\n --base-color-darkgrey: ", ";\n --base-color-midgrey: ", ";\n --base-color-lightgrey: ", ";\n --base-color-transparent: transparent;\n --base-color-errorstate: ", ";\n --base-color-mediumstate: ", ";\n --base-color-goodstate: ", ";\n --base-color-progress: ", ";\n --base-color-navigation: ", ";\n --base-color-lapislazuli: ", ";\n --base-color-lemonchiffon: ", ";\n\n --button-height: ", ";\n --button-line-height: ", ";\n --button-padding-x: ", ";\n --button-padding-y: ", ";\n --button-padding-y-icon: ", ";\n --button-icon-margin: ", ";\n --button-icon-width: ", ";\n --button-icon-height: ", ";\n --button-font-size: ", ";\n --button-font-weight: ", ";\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n --margin-header-1: ", ";\n\n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n --margin-header-2: ", ";\n\n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n --margin-header-3: ", ";\n\n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n --margin-header-4: ", ";\n\n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n --margin-header-5: ", ";\n\n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n --margin-header-6: ", ";\n\n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n\n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n\n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n\n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n\n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n\n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n\n --font-size-overline-3: ", ";\n --font-weight-overline-3: ", ";\n --letter-spacing-overline-3: ", ";\n --line-height-overline-3: ", "; \n\n --font-size-overline-4: ", ";\n --font-weight-overline-4: ", ";\n --letter-spacing-overline-4: ", ";\n --line-height-overline-4: ", ";\n\n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n\n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n\n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n\n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-listing: ", ";\n --font-size-individual-listing-name: ", ";\n --line-height-individual-listing-name: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n\n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n\n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n\n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n\n --font-family-navigation: ", ";\n --font-size-navigation: ", ";\n --font-weight-navigation: ", ";\n --line-height-navigation: ", ";\n --text-transform-navigation: ", ";\n --letter-spacing-navigation: ", ";\n\n --navigation-small-gap: ", ";\n --navigation-middle-gap: ", ";\n --navigation-large-gap: ", ";\n --navigation-xlarge-gap: ", ";\n --navigation-large-margin: ", ";\n\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --grid-margin: ", ";\n --grid-outer-margin: ", ";\n --grid-template-columns: calc(", " - ", ") calc(", " - ", " - ", ") repeat(12, minmax(0,1fr)) calc(", " - ", " - ", ") calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: 0;\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --text-link-underline-offset: ", ";\n\n --cards-spacing-stack: ", ";\n\n --editorial-subtitle-margin-bottom: ", ";\n --editorial-margin-between: ", ";\n --editorial-spacing-hover: ", ";\n --anchor-tabs-height: 70px;\n \n --harmonic-font-family-sans: 'Grey LL Bold', 'Roboto', sans-serif;\n --harmonic-font-family-serif: 'Victor Serif Medium', 'Inria Serif Regular', serif;\n\n @media ", " {\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n \n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n \n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n \n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n \n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n \n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n \n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n \n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n \n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n \n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n \n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n \n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n \n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n \n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n \n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n \n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n \n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n \n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n \n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n \n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --anchor-tabs-height: 60px;\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n }\n\n @media ", " {\n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-header-6: ", ";\n\n --font-size-altHeader-4: ", ";\n\n --font-size-body-1: ", ";\n }\n\n @media ", " {\n \n }\n\n @media ", " {\n \n }\n }\n"])), function (_ref) {
10412
10411
  var theme = _ref.theme;
10413
10412
  return theme.colors.primary;
10414
10413
  }, function (_ref2) {