@royaloperahouse/harmonic 0.11.0-n → 0.12.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.
- package/README.GIT +278 -0
- package/README.md +43 -252
- package/dist/components/Typography/Typography.d.ts +3 -3
- package/dist/components/atoms/Buttons/Secondary/utils.d.ts +4 -4
- package/dist/components/atoms/Dropdown/Dropdown.d.ts +1 -1
- package/dist/components/atoms/SectionSplitter/SectionSplitter.d.ts +1 -1
- package/dist/components/atoms/Tab/Tab.d.ts +1 -1
- package/dist/components/atoms/TextField/TextField.style.d.ts +1 -1
- package/dist/components/index.d.ts +2 -2
- package/dist/components/molecules/ContactCard/ContactCard.style.d.ts +4 -5
- package/dist/components/molecules/ContentSummary/ContentSummary.style.d.ts +1 -1
- package/dist/components/molecules/Information/Information.style.d.ts +1 -1
- package/dist/components/molecules/PageHeading/Promo/Promo.d.ts +2 -1
- package/dist/components/molecules/PromoWithTags/PromoWithTags.style.d.ts +6 -3
- package/dist/components/molecules/PromoWithTitle/PromoWithTitle.style.d.ts +1 -1
- package/dist/components/molecules/SectionTitle/SectionTitle.d.ts +1 -1
- package/dist/components/molecules/TextOnly/TextOnly.d.ts +4 -0
- package/dist/components/molecules/TextOnly/index.d.ts +2 -0
- package/dist/components/molecules/index.d.ts +2 -1
- package/dist/components/organisms/AnchorTabBar/AnchorTabBar.style.d.ts +3 -8
- package/dist/components/organisms/StickyBar/StickyBar.style.d.ts +1 -1
- package/dist/harmonic.cjs.development.css +16 -345
- package/dist/harmonic.cjs.development.js +674 -598
- package/dist/harmonic.cjs.development.js.map +1 -1
- package/dist/harmonic.cjs.production.min.js +1 -1
- package/dist/harmonic.cjs.production.min.js.map +1 -1
- package/dist/harmonic.esm.js +687 -613
- package/dist/harmonic.esm.js.map +1 -1
- package/dist/index.d.ts +3 -5
- package/dist/styles/HarmonicThemeProvider/HarmonicThemeProvider.d.ts +0 -4
- package/dist/styles/HarmonicThemeProvider/index.d.ts +1 -2
- package/dist/types/buttonTypes.d.ts +2 -0
- package/dist/types/contactCard.d.ts +22 -8
- package/dist/types/impactHeader.d.ts +0 -2
- package/dist/types/information.d.ts +43 -23
- package/dist/types/navigation.d.ts +61 -33
- package/dist/types/promoWithTags.d.ts +1 -9
- package/dist/types/types.d.ts +40 -26
- package/dist/types/typography.d.ts +0 -4
- package/package.json +1 -1
- package/dist/components/molecules/BodyContent/BodyContent.d.ts +0 -4
- package/dist/components/molecules/BodyContent/index.d.ts +0 -2
- /package/dist/components/molecules/{BodyContent/BodyContent.style.d.ts → TextOnly/TextOnly.style.d.ts} +0 -0
package/dist/harmonic.esm.js
CHANGED
|
@@ -50,113 +50,274 @@ function _objectWithoutPropertiesLoose(r, e) {
|
|
|
50
50
|
}
|
|
51
51
|
return t;
|
|
52
52
|
}
|
|
53
|
-
function
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
53
|
+
function _regeneratorRuntime() {
|
|
54
|
+
_regeneratorRuntime = function () {
|
|
55
|
+
return r;
|
|
56
|
+
};
|
|
57
|
+
var t,
|
|
58
|
+
r = {},
|
|
59
|
+
e = Object.prototype,
|
|
60
|
+
n = e.hasOwnProperty,
|
|
61
|
+
o = "function" == typeof Symbol ? Symbol : {},
|
|
62
|
+
i = o.iterator || "@@iterator",
|
|
63
|
+
a = o.asyncIterator || "@@asyncIterator",
|
|
64
|
+
u = o.toStringTag || "@@toStringTag";
|
|
65
|
+
function c(t, r, e, n) {
|
|
66
|
+
Object.defineProperty(t, r, {
|
|
67
|
+
value: e,
|
|
68
|
+
enumerable: !n,
|
|
69
|
+
configurable: !n,
|
|
70
|
+
writable: !n
|
|
71
|
+
});
|
|
72
|
+
}
|
|
73
|
+
try {
|
|
74
|
+
c({}, "");
|
|
75
|
+
} catch (t) {
|
|
76
|
+
c = function (t, r, e) {
|
|
77
|
+
return t[r] = e;
|
|
78
|
+
};
|
|
79
|
+
}
|
|
80
|
+
function h(r, e, n, o) {
|
|
81
|
+
var i = e && e.prototype instanceof Generator ? e : Generator,
|
|
82
|
+
a = Object.create(i.prototype);
|
|
83
|
+
return c(a, "_invoke", function (r, e, n) {
|
|
84
|
+
var o = 1;
|
|
85
|
+
return function (i, a) {
|
|
86
|
+
if (3 === o) throw Error("Generator is already running");
|
|
87
|
+
if (4 === o) {
|
|
88
|
+
if ("throw" === i) throw a;
|
|
89
|
+
return {
|
|
90
|
+
value: t,
|
|
91
|
+
done: !0
|
|
92
|
+
};
|
|
87
93
|
}
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
94
|
+
for (n.method = i, n.arg = a;;) {
|
|
95
|
+
var u = n.delegate;
|
|
96
|
+
if (u) {
|
|
97
|
+
var c = d(u, n);
|
|
98
|
+
if (c) {
|
|
99
|
+
if (c === f) continue;
|
|
100
|
+
return c;
|
|
101
|
+
}
|
|
102
|
+
}
|
|
103
|
+
if ("next" === n.method) n.sent = n._sent = n.arg;else if ("throw" === n.method) {
|
|
104
|
+
if (1 === o) throw o = 4, n.arg;
|
|
105
|
+
n.dispatchException(n.arg);
|
|
106
|
+
} else "return" === n.method && n.abrupt("return", n.arg);
|
|
107
|
+
o = 3;
|
|
108
|
+
var h = s(r, e, n);
|
|
109
|
+
if ("normal" === h.type) {
|
|
110
|
+
if (o = n.done ? 4 : 2, h.arg === f) continue;
|
|
111
|
+
return {
|
|
112
|
+
value: h.arg,
|
|
113
|
+
done: n.done
|
|
114
|
+
};
|
|
108
115
|
}
|
|
116
|
+
"throw" === h.type && (o = 4, n.method = "throw", n.arg = h.arg);
|
|
109
117
|
}
|
|
110
|
-
return {
|
|
111
|
-
value: t,
|
|
112
|
-
done: y
|
|
113
|
-
};
|
|
114
118
|
};
|
|
115
|
-
}(r,
|
|
119
|
+
}(r, n, new Context(o || [])), !0), a;
|
|
116
120
|
}
|
|
117
|
-
|
|
121
|
+
function s(t, r, e) {
|
|
122
|
+
try {
|
|
123
|
+
return {
|
|
124
|
+
type: "normal",
|
|
125
|
+
arg: t.call(r, e)
|
|
126
|
+
};
|
|
127
|
+
} catch (t) {
|
|
128
|
+
return {
|
|
129
|
+
type: "throw",
|
|
130
|
+
arg: t
|
|
131
|
+
};
|
|
132
|
+
}
|
|
133
|
+
}
|
|
134
|
+
r.wrap = h;
|
|
135
|
+
var f = {};
|
|
118
136
|
function Generator() {}
|
|
119
137
|
function GeneratorFunction() {}
|
|
120
138
|
function GeneratorFunctionPrototype() {}
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
139
|
+
var l = {};
|
|
140
|
+
c(l, i, function () {
|
|
141
|
+
return this;
|
|
142
|
+
});
|
|
143
|
+
var p = Object.getPrototypeOf,
|
|
144
|
+
y = p && p(p(x([])));
|
|
145
|
+
y && y !== e && n.call(y, i) && (l = y);
|
|
146
|
+
var v = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(l);
|
|
147
|
+
function g(t) {
|
|
148
|
+
["next", "throw", "return"].forEach(function (r) {
|
|
149
|
+
c(t, r, function (t) {
|
|
150
|
+
return this._invoke(r, t);
|
|
151
|
+
});
|
|
152
|
+
});
|
|
153
|
+
}
|
|
154
|
+
function AsyncIterator(t, r) {
|
|
155
|
+
function e(o, i, a, u) {
|
|
156
|
+
var c = s(t[o], t, i);
|
|
157
|
+
if ("throw" !== c.type) {
|
|
158
|
+
var h = c.arg,
|
|
159
|
+
f = h.value;
|
|
160
|
+
return f && "object" == typeof f && n.call(f, "__await") ? r.resolve(f.__await).then(function (t) {
|
|
161
|
+
e("next", t, a, u);
|
|
162
|
+
}, function (t) {
|
|
163
|
+
e("throw", t, a, u);
|
|
164
|
+
}) : r.resolve(f).then(function (t) {
|
|
165
|
+
h.value = t, a(h);
|
|
166
|
+
}, function (t) {
|
|
167
|
+
return e("throw", t, a, u);
|
|
168
|
+
});
|
|
169
|
+
}
|
|
170
|
+
u(c.arg);
|
|
171
|
+
}
|
|
172
|
+
var o;
|
|
173
|
+
c(this, "_invoke", function (t, n) {
|
|
174
|
+
function i() {
|
|
175
|
+
return new r(function (r, o) {
|
|
176
|
+
e(t, n, r, o);
|
|
177
|
+
});
|
|
178
|
+
}
|
|
179
|
+
return o = o ? o.then(i, i) : i();
|
|
180
|
+
}, !0);
|
|
181
|
+
}
|
|
182
|
+
function d(r, e) {
|
|
183
|
+
var n = e.method,
|
|
184
|
+
o = r.i[n];
|
|
185
|
+
if (o === t) return e.delegate = null, "throw" === n && r.i.return && (e.method = "return", e.arg = t, d(r, e), "throw" === e.method) || "return" !== n && (e.method = "throw", e.arg = new TypeError("The iterator does not provide a '" + n + "' method")), f;
|
|
186
|
+
var i = s(o, r.i, e.arg);
|
|
187
|
+
if ("throw" === i.type) return e.method = "throw", e.arg = i.arg, e.delegate = null, f;
|
|
188
|
+
var a = i.arg;
|
|
189
|
+
return a ? a.done ? (e[r.r] = a.value, e.next = r.n, "return" !== e.method && (e.method = "next", e.arg = t), e.delegate = null, f) : a : (e.method = "throw", e.arg = new TypeError("iterator result is not an object"), e.delegate = null, f);
|
|
190
|
+
}
|
|
191
|
+
function w(t) {
|
|
192
|
+
this.tryEntries.push(t);
|
|
128
193
|
}
|
|
129
|
-
|
|
194
|
+
function m(r) {
|
|
195
|
+
var e = r[4] || {};
|
|
196
|
+
e.type = "normal", e.arg = t, r[4] = e;
|
|
197
|
+
}
|
|
198
|
+
function Context(t) {
|
|
199
|
+
this.tryEntries = [[-1]], t.forEach(w, this), this.reset(!0);
|
|
200
|
+
}
|
|
201
|
+
function x(r) {
|
|
202
|
+
if (null != r) {
|
|
203
|
+
var e = r[i];
|
|
204
|
+
if (e) return e.call(r);
|
|
205
|
+
if ("function" == typeof r.next) return r;
|
|
206
|
+
if (!isNaN(r.length)) {
|
|
207
|
+
var o = -1,
|
|
208
|
+
a = function e() {
|
|
209
|
+
for (; ++o < r.length;) if (n.call(r, o)) return e.value = r[o], e.done = !1, e;
|
|
210
|
+
return e.value = t, e.done = !0, e;
|
|
211
|
+
};
|
|
212
|
+
return a.next = a;
|
|
213
|
+
}
|
|
214
|
+
}
|
|
215
|
+
throw new TypeError(typeof r + " is not iterable");
|
|
216
|
+
}
|
|
217
|
+
return GeneratorFunction.prototype = GeneratorFunctionPrototype, c(v, "constructor", GeneratorFunctionPrototype), c(GeneratorFunctionPrototype, "constructor", GeneratorFunction), c(GeneratorFunctionPrototype, u, GeneratorFunction.displayName = "GeneratorFunction"), r.isGeneratorFunction = function (t) {
|
|
218
|
+
var r = "function" == typeof t && t.constructor;
|
|
219
|
+
return !!r && (r === GeneratorFunction || "GeneratorFunction" === (r.displayName || r.name));
|
|
220
|
+
}, r.mark = function (t) {
|
|
221
|
+
return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, c(t, u, "GeneratorFunction")), t.prototype = Object.create(v), t;
|
|
222
|
+
}, r.awrap = function (t) {
|
|
223
|
+
return {
|
|
224
|
+
__await: t
|
|
225
|
+
};
|
|
226
|
+
}, g(AsyncIterator.prototype), c(AsyncIterator.prototype, a, function () {
|
|
130
227
|
return this;
|
|
131
|
-
}),
|
|
228
|
+
}), r.AsyncIterator = AsyncIterator, r.async = function (t, e, n, o, i) {
|
|
229
|
+
void 0 === i && (i = Promise);
|
|
230
|
+
var a = new AsyncIterator(h(t, e, n, o), i);
|
|
231
|
+
return r.isGeneratorFunction(e) ? a : a.next().then(function (t) {
|
|
232
|
+
return t.done ? t.value : a.next();
|
|
233
|
+
});
|
|
234
|
+
}, g(v), c(v, u, "Generator"), c(v, i, function () {
|
|
235
|
+
return this;
|
|
236
|
+
}), c(v, "toString", function () {
|
|
132
237
|
return "[object Generator]";
|
|
133
|
-
}),
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
238
|
+
}), r.keys = function (t) {
|
|
239
|
+
var r = Object(t),
|
|
240
|
+
e = [];
|
|
241
|
+
for (var n in r) e.unshift(n);
|
|
242
|
+
return function t() {
|
|
243
|
+
for (; e.length;) if ((n = e.pop()) in r) return t.value = n, t.done = !1, t;
|
|
244
|
+
return t.done = !0, t;
|
|
137
245
|
};
|
|
138
|
-
}
|
|
139
|
-
|
|
140
|
-
function
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
246
|
+
}, r.values = x, Context.prototype = {
|
|
247
|
+
constructor: Context,
|
|
248
|
+
reset: function (r) {
|
|
249
|
+
if (this.prev = this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = "next", this.arg = t, this.tryEntries.forEach(m), !r) for (var e in this) "t" === e.charAt(0) && n.call(this, e) && !isNaN(+e.slice(1)) && (this[e] = t);
|
|
250
|
+
},
|
|
251
|
+
stop: function () {
|
|
252
|
+
this.done = !0;
|
|
253
|
+
var t = this.tryEntries[0][4];
|
|
254
|
+
if ("throw" === t.type) throw t.arg;
|
|
255
|
+
return this.rval;
|
|
256
|
+
},
|
|
257
|
+
dispatchException: function (r) {
|
|
258
|
+
if (this.done) throw r;
|
|
259
|
+
var e = this;
|
|
260
|
+
function n(t) {
|
|
261
|
+
a.type = "throw", a.arg = r, e.next = t;
|
|
262
|
+
}
|
|
263
|
+
for (var o = e.tryEntries.length - 1; o >= 0; --o) {
|
|
264
|
+
var i = this.tryEntries[o],
|
|
265
|
+
a = i[4],
|
|
266
|
+
u = this.prev,
|
|
267
|
+
c = i[1],
|
|
268
|
+
h = i[2];
|
|
269
|
+
if (-1 === i[0]) return n("end"), !1;
|
|
270
|
+
if (!c && !h) throw Error("try statement without catch or finally");
|
|
271
|
+
if (null != i[0] && i[0] <= u) {
|
|
272
|
+
if (u < c) return this.method = "next", this.arg = t, n(c), !0;
|
|
273
|
+
if (u < h) return n(h), !1;
|
|
274
|
+
}
|
|
275
|
+
}
|
|
276
|
+
},
|
|
277
|
+
abrupt: function (t, r) {
|
|
278
|
+
for (var e = this.tryEntries.length - 1; e >= 0; --e) {
|
|
279
|
+
var n = this.tryEntries[e];
|
|
280
|
+
if (n[0] > -1 && n[0] <= this.prev && this.prev < n[2]) {
|
|
281
|
+
var o = n;
|
|
282
|
+
break;
|
|
283
|
+
}
|
|
284
|
+
}
|
|
285
|
+
o && ("break" === t || "continue" === t) && o[0] <= r && r <= o[2] && (o = null);
|
|
286
|
+
var i = o ? o[4] : {};
|
|
287
|
+
return i.type = t, i.arg = r, o ? (this.method = "next", this.next = o[2], f) : this.complete(i);
|
|
288
|
+
},
|
|
289
|
+
complete: function (t, r) {
|
|
290
|
+
if ("throw" === t.type) throw t.arg;
|
|
291
|
+
return "break" === t.type || "continue" === t.type ? this.next = t.arg : "return" === t.type ? (this.rval = this.arg = t.arg, this.method = "return", this.next = "end") : "normal" === t.type && r && (this.next = r), f;
|
|
292
|
+
},
|
|
293
|
+
finish: function (t) {
|
|
294
|
+
for (var r = this.tryEntries.length - 1; r >= 0; --r) {
|
|
295
|
+
var e = this.tryEntries[r];
|
|
296
|
+
if (e[2] === t) return this.complete(e[4], e[3]), m(e), f;
|
|
297
|
+
}
|
|
298
|
+
},
|
|
299
|
+
catch: function (t) {
|
|
300
|
+
for (var r = this.tryEntries.length - 1; r >= 0; --r) {
|
|
301
|
+
var e = this.tryEntries[r];
|
|
302
|
+
if (e[0] === t) {
|
|
303
|
+
var n = e[4];
|
|
304
|
+
if ("throw" === n.type) {
|
|
305
|
+
var o = n.arg;
|
|
306
|
+
m(e);
|
|
307
|
+
}
|
|
308
|
+
return o;
|
|
309
|
+
}
|
|
310
|
+
}
|
|
311
|
+
throw Error("illegal catch attempt");
|
|
312
|
+
},
|
|
313
|
+
delegateYield: function (r, e, n) {
|
|
314
|
+
return this.delegate = {
|
|
315
|
+
i: x(r),
|
|
316
|
+
r: e,
|
|
317
|
+
n: n
|
|
318
|
+
}, "next" === this.method && (this.arg = t), f;
|
|
319
|
+
}
|
|
320
|
+
}, r;
|
|
160
321
|
}
|
|
161
322
|
function _taggedTemplateLiteralLoose(e, t) {
|
|
162
323
|
return t || (t = e.slice(0)), e.raw = t, e;
|
|
@@ -222,10 +383,10 @@ function styleInject(css, ref) {
|
|
|
222
383
|
}
|
|
223
384
|
|
|
224
385
|
var css_248z = "/* Base classes */\n.typography-module_display__ZHsz9 {\n margin: 0;\n font-family: var(--font-family-sans);\n line-height: 100%;\n}\n\n.typography-module_header__FVsLI {\n margin: 0;\n font-family: var(--font-family-sans);\n font-weight: 500;\n}\n\n.typography-module_subtitle__x3sSn {\n margin: 0;\n font-family: var(--font-family-sans);\n font-weight: 500;\n}\n\n.typography-module_bodycopy__-BY2U {\n margin: 0;\n font-family: var(--font-family-sans);\n font-weight: 400;\n}\n\n.typography-module_overline__y1yCC {\n margin: 0;\n font-family: var(--font-family-sans);\n font-weight: 500;\n text-transform: uppercase;\n}\n\n.typography-module_buttontext__Gp0W- {\n margin: 0;\n font-family: var(--font-family-sans);\n font-weight: 400;\n}\n\n.typography-module_captiontext__zyA-- {\n margin: 0;\n font-family: var(--font-family-sans);\n font-weight: 400;\n}\n\n.typography-module_navigationtext__Qj6Zw {\n margin: 0;\n font-family: var(--font-family-sans);\n font-weight: 500;\n}\n\n/* Size modifiers */\n.typography-module_display--large__RwPQD {\n font-size: 96px;\n font-weight: 700;\n letter-spacing: -5px;\n}\n\n.typography-module_display--small__XWUSJ {\n font-size: 68px;\n font-weight: 500;\n letter-spacing: -3px;\n}\n\n.typography-module_header--large__2vP3p {\n font-size: 44px;\n line-height: 48px;\n letter-spacing: -1.5px;\n}\n\n.typography-module_header--medium__OgzlB {\n font-size: 34px;\n line-height: 40px;\n letter-spacing: -1px;\n}\n\n.typography-module_header--small__zLuFf {\n font-size: 26px;\n line-height: 32px;\n letter-spacing: -0.5px;\n}\n\n.typography-module_subtitle--large__1Ep9J {\n font-size: 19px;\n line-height: 26px;\n letter-spacing: -0.5px;\n}\n\n.typography-module_subtitle--small__Vt9bZ {\n font-size: 17px;\n line-height: 24px;\n letter-spacing: -0.5px;\n}\n\n.typography-module_bodycopy--large__BNzf2 {\n font-size: 19px;\n line-height: 26px;\n letter-spacing: -0.5px;\n}\n\n.typography-module_bodycopy--medium__cwJEu {\n font-size: 17px;\n line-height: 24px;\n letter-spacing: -0.5px;\n}\n\n.typography-module_bodycopy--small__fTLSM {\n font-size: 14px;\n line-height: 20px;\n letter-spacing: -0.5px;\n}\n\n.typography-module_overline--large__79WUM {\n font-size: 14px;\n line-height: 18px;\n letter-spacing: 0.3px;\n}\n\n.typography-module_overline--small__MGEG6 {\n font-size: 12px;\n line-height: 14px;\n letter-spacing: 0.2px;\n}\n\n/* Button, Caption, Navigation text */\n.typography-module_buttontext__Gp0W- {\n font-size: 17px;\n line-height: 20px;\n letter-spacing: -0.5px;\n}\n\n.typography-module_captiontext__zyA-- {\n font-size: 17px;\n line-height: 24px;\n letter-spacing: -0.5px;\n}\n\n.typography-module_navigationtext__Qj6Zw {\n font-size: 19px;\n line-height: 19px;\n letter-spacing: 0.4px;\n}\n\n/* Color modifiers */\n.typography-module_display--primary__9sTwU,\n.typography-module_header--primary__KF0PJ,\n.typography-module_subtitle--primary__yL-hS,\n.typography-module_bodycopy--primary__5Uo2D,\n.typography-module_overline--primary__a2NSa,\n.typography-module_buttontext--primary__HnmE3,\n.typography-module_captiontext--primary__mmafI,\n.typography-module_navigationtext--primary__vIsUl {\n color: var(--color-primary);\n}\n\n\n.typography-module_display--black__8hmsx,\n.typography-module_header--black__M3I14,\n.typography-module_subtitle--black__IQRSo,\n.typography-module_bodycopy--black__J8BNP,\n.typography-module_overline--black__RUDoj,\n.typography-module_buttontext--black__irjmz,\n.typography-module_captiontext--black__7axhP,\n.typography-module_navigationtext--black__wDz-G {\n color: var(--color-base-black);\n}\n\n.typography-module_display--white__3QA6W,\n.typography-module_header--white__mm-ex,\n.typography-module_subtitle--white__VzQ3K,\n.typography-module_bodycopy--white__NJ8J8,\n.typography-module_overline--white__cV5QV,\n.typography-module_buttontext--white__rrr8U,\n.typography-module_captiontext--white__OMFwW,\n.typography-module_navigationtext--white__5YDdY {\n color: var(--color-base-white);\n}\n\n.typography-module_display--red__khdLJ,\n.typography-module_header--red__hxuj9,\n.typography-module_subtitle--red__gSK7d,\n.typography-module_bodycopy--red__P5Mau,\n.typography-module_overline--red__OW5dE,\n.typography-module_buttontext--red__mlRi2,\n.typography-module_captiontext--red__jMQIK,\n.typography-module_navigationtext--red__-QADV {\n color: var(--color-primary-red);\n}\n\n.typography-module_display--grey__RsgTf,\n.typography-module_header--grey__rC0vN,\n.typography-module_subtitle--grey__1nkEx,\n.typography-module_bodycopy--grey__SNnaU,\n.typography-module_overline--grey__lGOsK,\n.typography-module_buttontext--grey__1Y4oX,\n.typography-module_captiontext--grey__V0MLc,\n.typography-module_navigationtext--grey__xi3sz {\n color: var(--color-base-dark-grey);\n}\n\n.typography-module_display--inherit__ZNOHM,\n.typography-module_header--inherit__qmHQE,\n.typography-module_subtitle--inherit__mly-X,\n.typography-module_bodycopy--inherit__CoC-f,\n.typography-module_overline--inherit__Cq4ni,\n.typography-module_buttontext--inherit__vguWx,\n.typography-module_captiontext--inherit__ya6gm,\n.typography-module_navigationtext--inherit__cJLWf {\n color: inherit;\n}\n\n/* Typography variants */\n.typography-module_display--serif__C0-Ve,\n.typography-module_header--serif__uTGCc {\n font-family: var(--font-family-serif);\n}\n\n.typography-module_display--em__h2bPV,\n.typography-module_header--em__UFQIA {\n font-family: var(--font-family-serif);\n font-style: italic;\n}\n\n.typography-module_display--bold__PG-8g,\n.typography-module_header--bold__InvJk,\n.typography-module_subtitle--bold__Subov,\n.typography-module_bodycopy--bold__nZX3C,\n.typography-module_overline--bold__3mUXy,\n.typography-module_buttontext--bold__rBKIJ,\n.typography-module_captiontext--bold__ebTyV,\n.typography-module_navigationtext--bold__SRlV2 {\n font-weight: 700;\n}\n\n/* Media queries */\n@media (max-width: 699px) {\n .typography-module_display--large__RwPQD {\n font-size: 38px;\n letter-spacing: -1.5px;\n }\n\n .typography-module_display--small__XWUSJ {\n font-size: 32px;\n letter-spacing: -1.5px;\n }\n\n .typography-module_header--large__2vP3p {\n font-size: 28px;\n line-height: 34px;\n letter-spacing: -1.5px;\n }\n\n .typography-module_header--medium__OgzlB {\n font-size: 24px;\n line-height: 28px;\n letter-spacing: -1px;\n }\n\n .typography-module_header--small__zLuFf {\n font-size: 20px;\n line-height: 26px;\n letter-spacing: -0.75px;\n }\n\n .typography-module_subtitle--large__1Ep9J {\n font-size: 17px;\n line-height: 24px;\n letter-spacing: -0.5px;\n }\n\n .typography-module_subtitle--small__Vt9bZ {\n font-size: 14px;\n line-height: 20px;\n letter-spacing: -0.2px;\n }\n\n .typography-module_bodycopy--large__BNzf2 {\n font-size: 17px;\n line-height: 24px;\n letter-spacing: -0.5px;\n }\n\n .typography-module_bodycopy--medium__cwJEu {\n font-size: 14px;\n line-height: 20px;\n letter-spacing: -0.2px;\n }\n\n .typography-module_bodycopy--small__fTLSM {\n font-size: 11px;\n line-height: 16px;\n letter-spacing: -0.2px;\n }\n\n .typography-module_overline--large__79WUM {\n line-height: 17px;\n letter-spacing: 0.3px;\n }\n\n .typography-module_overline--small__MGEG6 {\n line-height: 14px;\n letter-spacing: 0.3px;\n }\n}";
|
|
225
|
-
var
|
|
386
|
+
var styles = {"display":"typography-module_display__ZHsz9","header":"typography-module_header__FVsLI","subtitle":"typography-module_subtitle__x3sSn","bodycopy":"typography-module_bodycopy__-BY2U","overline":"typography-module_overline__y1yCC","buttontext":"typography-module_buttontext__Gp0W-","captiontext":"typography-module_captiontext__zyA--","navigationtext":"typography-module_navigationtext__Qj6Zw","display--large":"typography-module_display--large__RwPQD","display--small":"typography-module_display--small__XWUSJ","header--large":"typography-module_header--large__2vP3p","header--medium":"typography-module_header--medium__OgzlB","header--small":"typography-module_header--small__zLuFf","subtitle--large":"typography-module_subtitle--large__1Ep9J","subtitle--small":"typography-module_subtitle--small__Vt9bZ","bodycopy--large":"typography-module_bodycopy--large__BNzf2","bodycopy--medium":"typography-module_bodycopy--medium__cwJEu","bodycopy--small":"typography-module_bodycopy--small__fTLSM","overline--large":"typography-module_overline--large__79WUM","overline--small":"typography-module_overline--small__MGEG6","display--primary":"typography-module_display--primary__9sTwU","header--primary":"typography-module_header--primary__KF0PJ","subtitle--primary":"typography-module_subtitle--primary__yL-hS","bodycopy--primary":"typography-module_bodycopy--primary__5Uo2D","overline--primary":"typography-module_overline--primary__a2NSa","buttontext--primary":"typography-module_buttontext--primary__HnmE3","captiontext--primary":"typography-module_captiontext--primary__mmafI","navigationtext--primary":"typography-module_navigationtext--primary__vIsUl","display--black":"typography-module_display--black__8hmsx","header--black":"typography-module_header--black__M3I14","subtitle--black":"typography-module_subtitle--black__IQRSo","bodycopy--black":"typography-module_bodycopy--black__J8BNP","overline--black":"typography-module_overline--black__RUDoj","buttontext--black":"typography-module_buttontext--black__irjmz","captiontext--black":"typography-module_captiontext--black__7axhP","navigationtext--black":"typography-module_navigationtext--black__wDz-G","display--white":"typography-module_display--white__3QA6W","header--white":"typography-module_header--white__mm-ex","subtitle--white":"typography-module_subtitle--white__VzQ3K","bodycopy--white":"typography-module_bodycopy--white__NJ8J8","overline--white":"typography-module_overline--white__cV5QV","buttontext--white":"typography-module_buttontext--white__rrr8U","captiontext--white":"typography-module_captiontext--white__OMFwW","navigationtext--white":"typography-module_navigationtext--white__5YDdY","display--red":"typography-module_display--red__khdLJ","header--red":"typography-module_header--red__hxuj9","subtitle--red":"typography-module_subtitle--red__gSK7d","bodycopy--red":"typography-module_bodycopy--red__P5Mau","overline--red":"typography-module_overline--red__OW5dE","buttontext--red":"typography-module_buttontext--red__mlRi2","captiontext--red":"typography-module_captiontext--red__jMQIK","navigationtext--red":"typography-module_navigationtext--red__-QADV","display--grey":"typography-module_display--grey__RsgTf","header--grey":"typography-module_header--grey__rC0vN","subtitle--grey":"typography-module_subtitle--grey__1nkEx","bodycopy--grey":"typography-module_bodycopy--grey__SNnaU","overline--grey":"typography-module_overline--grey__lGOsK","buttontext--grey":"typography-module_buttontext--grey__1Y4oX","captiontext--grey":"typography-module_captiontext--grey__V0MLc","navigationtext--grey":"typography-module_navigationtext--grey__xi3sz","display--inherit":"typography-module_display--inherit__ZNOHM","header--inherit":"typography-module_header--inherit__qmHQE","subtitle--inherit":"typography-module_subtitle--inherit__mly-X","bodycopy--inherit":"typography-module_bodycopy--inherit__CoC-f","overline--inherit":"typography-module_overline--inherit__Cq4ni","buttontext--inherit":"typography-module_buttontext--inherit__vguWx","captiontext--inherit":"typography-module_captiontext--inherit__ya6gm","navigationtext--inherit":"typography-module_navigationtext--inherit__cJLWf","display--serif":"typography-module_display--serif__C0-Ve","header--serif":"typography-module_header--serif__uTGCc","display--em":"typography-module_display--em__h2bPV","header--em":"typography-module_header--em__UFQIA","display--bold":"typography-module_display--bold__PG-8g","header--bold":"typography-module_header--bold__InvJk","subtitle--bold":"typography-module_subtitle--bold__Subov","bodycopy--bold":"typography-module_bodycopy--bold__nZX3C","overline--bold":"typography-module_overline--bold__3mUXy","buttontext--bold":"typography-module_buttontext--bold__rBKIJ","captiontext--bold":"typography-module_captiontext--bold__ebTyV","navigationtext--bold":"typography-module_navigationtext--bold__SRlV2"};
|
|
226
387
|
styleInject(css_248z);
|
|
227
388
|
|
|
228
|
-
var _excluded = ["children", "size", "color", "className", "bold"
|
|
389
|
+
var _excluded = ["children", "size", "color", "className", "bold"],
|
|
229
390
|
_excluded2 = ["children", "size", "color", "className"];
|
|
230
391
|
/* ~~~ Headers - size and hierarchy set separately ~~~ */
|
|
231
392
|
var HarmonicHeader = function HarmonicHeader(_ref2) {
|
|
@@ -243,7 +404,7 @@ var HarmonicHeader = function HarmonicHeader(_ref2) {
|
|
|
243
404
|
serif: serif,
|
|
244
405
|
em: em,
|
|
245
406
|
className: className
|
|
246
|
-
},
|
|
407
|
+
}, styles);
|
|
247
408
|
return /*#__PURE__*/React__default.createElement(Tag, {
|
|
248
409
|
className: classNames
|
|
249
410
|
}, children);
|
|
@@ -259,7 +420,7 @@ var HarmonicSubtitle = function HarmonicSubtitle(_ref3) {
|
|
|
259
420
|
size: size,
|
|
260
421
|
color: color,
|
|
261
422
|
className: className
|
|
262
|
-
},
|
|
423
|
+
}, styles);
|
|
263
424
|
return /*#__PURE__*/React__default.createElement("p", {
|
|
264
425
|
className: classNames
|
|
265
426
|
}, children);
|
|
@@ -273,16 +434,14 @@ var BodyCopyHarmonic = function BodyCopyHarmonic(_ref4) {
|
|
|
273
434
|
color = _ref4$color === void 0 ? 'inherit' : _ref4$color,
|
|
274
435
|
className = _ref4.className,
|
|
275
436
|
bold = _ref4.bold,
|
|
276
|
-
_ref4$tag = _ref4.tag,
|
|
277
|
-
Tag = _ref4$tag === void 0 ? 'p' : _ref4$tag,
|
|
278
437
|
props = _objectWithoutPropertiesLoose(_ref4, _excluded);
|
|
279
438
|
var classNames = createClassNames('bodycopy', {
|
|
280
439
|
size: size,
|
|
281
440
|
color: color,
|
|
282
441
|
bold: bold,
|
|
283
442
|
className: className
|
|
284
|
-
},
|
|
285
|
-
return /*#__PURE__*/React__default.createElement(
|
|
443
|
+
}, styles);
|
|
444
|
+
return /*#__PURE__*/React__default.createElement("p", Object.assign({
|
|
286
445
|
className: classNames
|
|
287
446
|
}, props), children);
|
|
288
447
|
};
|
|
@@ -298,7 +457,7 @@ var HarmonicOverline = function HarmonicOverline(_ref5) {
|
|
|
298
457
|
size: size,
|
|
299
458
|
color: color,
|
|
300
459
|
className: className
|
|
301
|
-
},
|
|
460
|
+
}, styles);
|
|
302
461
|
return /*#__PURE__*/React__default.createElement("p", Object.assign({
|
|
303
462
|
className: classNames
|
|
304
463
|
}, props), children);
|
|
@@ -312,7 +471,7 @@ var ButtonText = function ButtonText(_ref6) {
|
|
|
312
471
|
var classNames = createClassNames('buttontext', {
|
|
313
472
|
color: color,
|
|
314
473
|
className: className
|
|
315
|
-
},
|
|
474
|
+
}, styles);
|
|
316
475
|
return /*#__PURE__*/React__default.createElement("span", {
|
|
317
476
|
className: classNames
|
|
318
477
|
}, children);
|
|
@@ -325,7 +484,7 @@ var Caption = function Caption(_ref7) {
|
|
|
325
484
|
var classNames = createClassNames('captiontext', {
|
|
326
485
|
color: color,
|
|
327
486
|
className: className
|
|
328
|
-
},
|
|
487
|
+
}, styles);
|
|
329
488
|
return /*#__PURE__*/React__default.createElement("p", {
|
|
330
489
|
className: classNames
|
|
331
490
|
}, children);
|
|
@@ -334,14 +493,12 @@ var NavigationText = function NavigationText(_ref8) {
|
|
|
334
493
|
var children = _ref8.children,
|
|
335
494
|
_ref8$color = _ref8.color,
|
|
336
495
|
color = _ref8$color === void 0 ? 'inherit' : _ref8$color,
|
|
337
|
-
_ref8$tag = _ref8.tag,
|
|
338
|
-
Tag = _ref8$tag === void 0 ? 'p' : _ref8$tag,
|
|
339
496
|
className = _ref8.className;
|
|
340
497
|
var classNames = createClassNames('navigationtext', {
|
|
341
498
|
color: color,
|
|
342
499
|
className: className
|
|
343
|
-
},
|
|
344
|
-
return /*#__PURE__*/React__default.createElement(
|
|
500
|
+
}, styles);
|
|
501
|
+
return /*#__PURE__*/React__default.createElement("p", {
|
|
345
502
|
className: classNames
|
|
346
503
|
}, children);
|
|
347
504
|
};
|
|
@@ -2695,48 +2852,70 @@ var COLORS$1 = {
|
|
|
2695
2852
|
hover: 'var(--button-secondary-hover-color)',
|
|
2696
2853
|
pressed: 'var(--button-secondary-pressed-color)'
|
|
2697
2854
|
};
|
|
2855
|
+
var isObjectWithKey = function isObjectWithKey(object, key) {
|
|
2856
|
+
return typeof object === 'object' && object !== null && key in object;
|
|
2857
|
+
};
|
|
2858
|
+
var hasSecondaryButtonColor = function hasSecondaryButtonColor(theme) {
|
|
2859
|
+
return isObjectWithKey(theme, 'colors') && isObjectWithKey(theme.colors, 'secondaryButton') && typeof theme.colors.secondaryButton === 'string';
|
|
2860
|
+
};
|
|
2698
2861
|
var getTextColor$1 = function getTextColor(_ref) {
|
|
2699
2862
|
var disabled = _ref.disabled,
|
|
2700
|
-
textColor = _ref.textColor
|
|
2863
|
+
textColor = _ref.textColor,
|
|
2864
|
+
theme = _ref.theme;
|
|
2701
2865
|
if (disabled) {
|
|
2702
2866
|
return COLORS$1.darkGrey;
|
|
2703
2867
|
}
|
|
2704
2868
|
if (textColor) {
|
|
2705
2869
|
return "var(--color-" + textColor + ")";
|
|
2706
2870
|
}
|
|
2871
|
+
if (hasSecondaryButtonColor(theme)) {
|
|
2872
|
+
return theme.colors.secondaryButton;
|
|
2873
|
+
}
|
|
2707
2874
|
return COLORS$1["default"];
|
|
2708
2875
|
};
|
|
2709
2876
|
var getBorderColor = function getBorderColor(_ref2) {
|
|
2710
2877
|
var disabled = _ref2.disabled,
|
|
2711
|
-
borderColor = _ref2.borderColor
|
|
2878
|
+
borderColor = _ref2.borderColor,
|
|
2879
|
+
theme = _ref2.theme;
|
|
2712
2880
|
if (disabled) {
|
|
2713
2881
|
return COLORS$1.disabled;
|
|
2714
2882
|
}
|
|
2715
2883
|
if (borderColor) {
|
|
2716
2884
|
return "var(--color-" + borderColor + ")";
|
|
2717
2885
|
}
|
|
2886
|
+
if (hasSecondaryButtonColor(theme)) {
|
|
2887
|
+
return theme.colors.secondaryButton;
|
|
2888
|
+
}
|
|
2718
2889
|
return COLORS$1.border;
|
|
2719
2890
|
};
|
|
2720
2891
|
var getHoveredColor$1 = function getHoveredColor(_ref3) {
|
|
2721
2892
|
var disabled = _ref3.disabled,
|
|
2722
|
-
hoveredColor = _ref3.hoveredColor
|
|
2893
|
+
hoveredColor = _ref3.hoveredColor,
|
|
2894
|
+
theme = _ref3.theme;
|
|
2723
2895
|
if (disabled) {
|
|
2724
2896
|
return COLORS$1.disabled;
|
|
2725
2897
|
}
|
|
2726
2898
|
if (hoveredColor) {
|
|
2727
2899
|
return "var(--color-" + hoveredColor + ")";
|
|
2728
2900
|
}
|
|
2901
|
+
if (hasSecondaryButtonColor(theme)) {
|
|
2902
|
+
return theme.colors.secondaryButton;
|
|
2903
|
+
}
|
|
2729
2904
|
return COLORS$1.hover;
|
|
2730
2905
|
};
|
|
2731
2906
|
var getPressedColor$1 = function getPressedColor(_ref4) {
|
|
2732
2907
|
var disabled = _ref4.disabled,
|
|
2733
|
-
pressedColor = _ref4.pressedColor
|
|
2908
|
+
pressedColor = _ref4.pressedColor,
|
|
2909
|
+
theme = _ref4.theme;
|
|
2734
2910
|
if (disabled) {
|
|
2735
2911
|
return COLORS$1.disabled;
|
|
2736
2912
|
}
|
|
2737
2913
|
if (pressedColor) {
|
|
2738
2914
|
return "var(--color-" + pressedColor + ")";
|
|
2739
2915
|
}
|
|
2916
|
+
if (hasSecondaryButtonColor(theme)) {
|
|
2917
|
+
return theme.colors.secondaryButton;
|
|
2918
|
+
}
|
|
2740
2919
|
return COLORS$1.pressed;
|
|
2741
2920
|
};
|
|
2742
2921
|
|
|
@@ -3545,15 +3724,12 @@ var SecondaryLogo = function SecondaryLogo(_ref) {
|
|
|
3545
3724
|
|
|
3546
3725
|
var _templateObject$h, _templateObject2$a;
|
|
3547
3726
|
var SectionSplitterContainer = /*#__PURE__*/styled(Grid)(_templateObject$h || (_templateObject$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 4px;\n"])));
|
|
3548
|
-
var Splitter = /*#__PURE__*/styled.div(_templateObject2$a || (_templateObject2$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n height: 4px;\n background: var(--color-
|
|
3727
|
+
var Splitter = /*#__PURE__*/styled.div(_templateObject2$a || (_templateObject2$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n height: 4px;\n background: var(--base-color-light-grey);\n"])));
|
|
3549
3728
|
|
|
3550
3729
|
var SectionSplitter = function SectionSplitter(_ref) {
|
|
3551
3730
|
var _ref$fullWidth = _ref.fullWidth,
|
|
3552
|
-
fullWidth = _ref$fullWidth === void 0 ? true : _ref$fullWidth
|
|
3553
|
-
|
|
3554
|
-
return /*#__PURE__*/React__default.createElement(SectionSplitterContainer, {
|
|
3555
|
-
className: className
|
|
3556
|
-
}, fullWidth ? (/*#__PURE__*/React__default.createElement(GridItem, {
|
|
3731
|
+
fullWidth = _ref$fullWidth === void 0 ? true : _ref$fullWidth;
|
|
3732
|
+
return /*#__PURE__*/React__default.createElement(SectionSplitterContainer, null, fullWidth ? (/*#__PURE__*/React__default.createElement(GridItem, {
|
|
3557
3733
|
columnStartDesktop: 1,
|
|
3558
3734
|
columnSpanDesktop: 16,
|
|
3559
3735
|
columnStartDevice: 1,
|
|
@@ -3684,7 +3860,6 @@ var Tab = function Tab(_ref) {
|
|
|
3684
3860
|
className = _ref.className,
|
|
3685
3861
|
role = _ref.role,
|
|
3686
3862
|
ariaLabel = _ref.ariaLabel,
|
|
3687
|
-
tabLinkId = _ref.tabLinkId,
|
|
3688
3863
|
color = _ref.color;
|
|
3689
3864
|
var clickHandler = function clickHandler() {
|
|
3690
3865
|
if (onClick) {
|
|
@@ -3715,9 +3890,8 @@ var Tab = function Tab(_ref) {
|
|
|
3715
3890
|
tabIndex: 0,
|
|
3716
3891
|
className: className
|
|
3717
3892
|
}, /*#__PURE__*/React__default.createElement(TabText, {
|
|
3718
|
-
id: tabLinkId,
|
|
3719
|
-
trimText: trimText,
|
|
3720
3893
|
color: color,
|
|
3894
|
+
trimText: trimText,
|
|
3721
3895
|
withTextInMobile: withTextInMobile,
|
|
3722
3896
|
"aria-hidden": "true"
|
|
3723
3897
|
}, title), withIcon !== 'none' && /*#__PURE__*/React__default.createElement(Icon, {
|
|
@@ -3728,7 +3902,7 @@ var Tab = function Tab(_ref) {
|
|
|
3728
3902
|
};
|
|
3729
3903
|
|
|
3730
3904
|
var _templateObject$l, _templateObject2$d;
|
|
3731
|
-
var TabLinkWrapper = /*#__PURE__*/styled.a(_templateObject$l || (_templateObject$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: ", ";\n color: ", ";\n width: fit-content;\n display: flex;\n align-items: center;\n cursor: pointer;\n text-decoration: none;\n border-bottom: ", ";\n\n && svg path {\n fill: ", ";\n }\n\n @media ", ", ", " {\n &:hover {\n color: var(--color-", ");\n border-bottom: 1px solid var(--color-", ");\n\n && svg path {\n fill: var(--color-", ");\n }\n }\n }\n"])), function (_ref) {
|
|
3905
|
+
var TabLinkWrapper = /*#__PURE__*/styled.a(_templateObject$l || (_templateObject$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: ", ";\n font-size: var(--harmonic-font-size-navigation);\n font-family: var(--font-family-sans);\n font-weight: var(--font-weight-navigation);\n letter-spacing: var(--harmonic-letter-spacing-navigation);\n color: ", ";\n width: fit-content;\n display: flex;\n align-items: center;\n cursor: pointer;\n text-decoration: none;\n border-bottom: ", ";\n\n && svg path {\n fill: ", ";\n }\n\n @media ", ", ", " {\n &:hover {\n color: var(--color-", ");\n border-bottom: 1px solid var(--color-", ");\n\n && svg path {\n fill: var(--color-", ");\n }\n }\n }\n"])), function (_ref) {
|
|
3732
3906
|
var iconName = _ref.iconName;
|
|
3733
3907
|
return iconName ? 'calc(var(--text-link-underline-offset) - 4px) 0' : 'var(--text-link-underline-offset) 0';
|
|
3734
3908
|
}, function (_ref2) {
|
|
@@ -3757,7 +3931,7 @@ var TabLinkWrapper = /*#__PURE__*/styled.a(_templateObject$l || (_templateObject
|
|
|
3757
3931
|
});
|
|
3758
3932
|
var TabLinkIconWrapper = /*#__PURE__*/styled.span(_templateObject2$d || (_templateObject2$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: var(--button-icon-width);\n height: var(--button-icon-height);\n margin-right: var(--button-icon-margin);\n"])));
|
|
3759
3933
|
|
|
3760
|
-
var _excluded$8 = ["children", "iconName", "iconDirection", "color", "hoverColor"
|
|
3934
|
+
var _excluded$8 = ["children", "iconName", "iconDirection", "color", "hoverColor"];
|
|
3761
3935
|
var TabLink = function TabLink(_ref) {
|
|
3762
3936
|
var children = _ref.children,
|
|
3763
3937
|
iconName = _ref.iconName,
|
|
@@ -3766,13 +3940,11 @@ var TabLink = function TabLink(_ref) {
|
|
|
3766
3940
|
color = _ref$color === void 0 ? ThemeColor['base-dark-grey'] : _ref$color,
|
|
3767
3941
|
_ref$hoverColor = _ref.hoverColor,
|
|
3768
3942
|
hoverColor = _ref$hoverColor === void 0 ? ThemeColor['primary-red'] : _ref$hoverColor,
|
|
3769
|
-
className = _ref.className,
|
|
3770
3943
|
rest = _objectWithoutPropertiesLoose(_ref, _excluded$8);
|
|
3771
3944
|
return /*#__PURE__*/React__default.createElement(TabLinkWrapper, Object.assign({
|
|
3772
3945
|
color: color,
|
|
3773
3946
|
iconName: iconName,
|
|
3774
|
-
hoverColor: hoverColor
|
|
3775
|
-
className: "" + typographyStyles.navigationtext + (className ? " " + className : '')
|
|
3947
|
+
hoverColor: hoverColor
|
|
3776
3948
|
}, rest), iconName ? (/*#__PURE__*/React__default.createElement(TabLinkIconWrapper, {
|
|
3777
3949
|
"data-testid": "tab-link-icon"
|
|
3778
3950
|
}, /*#__PURE__*/React__default.createElement(Icon, {
|
|
@@ -4497,15 +4669,15 @@ var Timer = function Timer(_ref) {
|
|
|
4497
4669
|
};
|
|
4498
4670
|
|
|
4499
4671
|
var _templateObject$t;
|
|
4500
|
-
var TypeTagsContainer = /*#__PURE__*/styled.ul(_templateObject$t || (_templateObject$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n list-style-type: none;\n margin: 0;\n padding: 0;\n\n p,\n li {\n display: inline-block;\n margin: 0;\n }\n\n li:before {\n content: '\
|
|
4672
|
+
var TypeTagsContainer = /*#__PURE__*/styled.ul(_templateObject$t || (_templateObject$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n list-style-type: none;\n margin: 0;\n padding: 0;\n\n p,\n li {\n display: inline-block;\n margin: 0;\n }\n\n li:before {\n content: '\u2014';\n margin: 0 0.5em;\n }\n\n li:first-child:before {\n display: none;\n }\n"])));
|
|
4501
4673
|
|
|
4502
4674
|
var TypeTags = function TypeTags(_ref) {
|
|
4503
4675
|
var list = _ref.list;
|
|
4504
4676
|
return /*#__PURE__*/React__default.createElement(TypeTagsContainer, null, list.map(function (t) {
|
|
4505
4677
|
return /*#__PURE__*/React__default.createElement("li", {
|
|
4506
4678
|
key: t
|
|
4507
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
4508
|
-
size: "
|
|
4679
|
+
}, /*#__PURE__*/React__default.createElement(HarmonicOverline, {
|
|
4680
|
+
size: "large"
|
|
4509
4681
|
}, t));
|
|
4510
4682
|
}));
|
|
4511
4683
|
};
|
|
@@ -4584,43 +4756,45 @@ var VideoControls = function VideoControls(_ref2) {
|
|
|
4584
4756
|
document.removeEventListener('fullscreenchange', handleFullscreenChange);
|
|
4585
4757
|
};
|
|
4586
4758
|
}, []);
|
|
4587
|
-
var handleFullscreen = useCallback(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/
|
|
4759
|
+
var handleFullscreen = useCallback(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
|
|
4588
4760
|
var videoContainer;
|
|
4589
|
-
return
|
|
4590
|
-
while (1) switch (_context.
|
|
4761
|
+
return _regeneratorRuntime().wrap(function _callee$(_context) {
|
|
4762
|
+
while (1) switch (_context.prev = _context.next) {
|
|
4591
4763
|
case 0:
|
|
4592
4764
|
videoContainer = document.querySelector("#" + videoContainerId);
|
|
4593
4765
|
if (videoContainer != null && videoContainer.requestFullscreen) {
|
|
4594
|
-
_context.
|
|
4766
|
+
_context.next = 3;
|
|
4595
4767
|
break;
|
|
4596
4768
|
}
|
|
4597
|
-
return _context.
|
|
4598
|
-
case
|
|
4599
|
-
_context.
|
|
4769
|
+
return _context.abrupt("return");
|
|
4770
|
+
case 3:
|
|
4771
|
+
_context.next = 5;
|
|
4600
4772
|
return videoContainer.requestFullscreen();
|
|
4601
|
-
case
|
|
4773
|
+
case 5:
|
|
4602
4774
|
setIsFullscreen(true);
|
|
4603
|
-
case
|
|
4604
|
-
|
|
4775
|
+
case 6:
|
|
4776
|
+
case "end":
|
|
4777
|
+
return _context.stop();
|
|
4605
4778
|
}
|
|
4606
4779
|
}, _callee);
|
|
4607
4780
|
})), []);
|
|
4608
|
-
var handleMinimise = useCallback(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/
|
|
4609
|
-
return
|
|
4610
|
-
while (1) switch (_context2.
|
|
4781
|
+
var handleMinimise = useCallback(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
|
|
4782
|
+
return _regeneratorRuntime().wrap(function _callee2$(_context2) {
|
|
4783
|
+
while (1) switch (_context2.prev = _context2.next) {
|
|
4611
4784
|
case 0:
|
|
4612
4785
|
if (document.fullscreenElement) {
|
|
4613
|
-
_context2.
|
|
4786
|
+
_context2.next = 2;
|
|
4614
4787
|
break;
|
|
4615
4788
|
}
|
|
4616
|
-
return _context2.
|
|
4617
|
-
case 1:
|
|
4618
|
-
_context2.n = 2;
|
|
4619
|
-
return document.exitFullscreen();
|
|
4789
|
+
return _context2.abrupt("return");
|
|
4620
4790
|
case 2:
|
|
4791
|
+
_context2.next = 4;
|
|
4792
|
+
return document.exitFullscreen();
|
|
4793
|
+
case 4:
|
|
4621
4794
|
setIsFullscreen(false);
|
|
4622
|
-
case
|
|
4623
|
-
|
|
4795
|
+
case 5:
|
|
4796
|
+
case "end":
|
|
4797
|
+
return _context2.stop();
|
|
4624
4798
|
}
|
|
4625
4799
|
}, _callee2);
|
|
4626
4800
|
})), []);
|
|
@@ -5276,7 +5450,6 @@ var Dropdown = function Dropdown(_ref) {
|
|
|
5276
5450
|
className = _ref.className,
|
|
5277
5451
|
role = _ref.role,
|
|
5278
5452
|
ariaLabel = _ref.ariaLabel,
|
|
5279
|
-
tabLinkId = _ref.tabLinkId,
|
|
5280
5453
|
trimTabText = _ref.trimTabText;
|
|
5281
5454
|
var node = useRef();
|
|
5282
5455
|
var _useState = useState(false),
|
|
@@ -5373,7 +5546,6 @@ var Dropdown = function Dropdown(_ref) {
|
|
|
5373
5546
|
};
|
|
5374
5547
|
var renderTab = function renderTab() {
|
|
5375
5548
|
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Tab, {
|
|
5376
|
-
tabLinkId: tabLinkId,
|
|
5377
5549
|
trimText: trimTabText,
|
|
5378
5550
|
title: title,
|
|
5379
5551
|
titleLink: titleLink,
|
|
@@ -5453,8 +5625,7 @@ var Account = function Account(_ref) {
|
|
|
5453
5625
|
iconName: iconName,
|
|
5454
5626
|
withOptionsInMobile: false,
|
|
5455
5627
|
withIcon: "left",
|
|
5456
|
-
className: className
|
|
5457
|
-
tabLinkId: "account-link"
|
|
5628
|
+
className: className
|
|
5458
5629
|
});
|
|
5459
5630
|
};
|
|
5460
5631
|
|
|
@@ -6022,126 +6193,30 @@ var Footer = function Footer(_ref) {
|
|
|
6022
6193
|
}, additionalInfo))));
|
|
6023
6194
|
};
|
|
6024
6195
|
|
|
6025
|
-
var _templateObject$F, _templateObject2$u, _templateObject3$k, _templateObject4$g, _templateObject5$c,
|
|
6196
|
+
var _templateObject$F, _templateObject2$u, _templateObject3$k, _templateObject4$g, _templateObject5$c, _templateObject6$9;
|
|
6026
6197
|
var LIST_ITEM_GAP = 32;
|
|
6027
|
-
var AnchorTabbarWrapper = /*#__PURE__*/styled.div(_templateObject$F || (_templateObject$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: sticky;\n width: 100%;\n top: 0;\n border-bottom: ", ";\n background-color: var(--color-
|
|
6198
|
+
var AnchorTabbarWrapper = /*#__PURE__*/styled.div(_templateObject$F || (_templateObject$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: sticky;\n width: 100%;\n top: 0;\n border-bottom: ", ";\n background-color: var(--base-color-white);\n z-index: ", ";\n"])), function (_ref) {
|
|
6028
6199
|
var bottomBorder = _ref.bottomBorder;
|
|
6029
|
-
return bottomBorder ? '
|
|
6030
|
-
}, zIndexes.anchor
|
|
6031
|
-
|
|
6032
|
-
|
|
6033
|
-
})
|
|
6034
|
-
var
|
|
6035
|
-
var TabsWrapper = /*#__PURE__*/styled.div(_templateObject4$g || (_templateObject4$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n"])));
|
|
6036
|
-
var TabsList = /*#__PURE__*/styled.ul(_templateObject5$c || (_templateObject5$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: ", ";\n display: flex;\n gap: ", "px;\n justify-content: ", ";\n align-items: center;\n list-style: none;\n padding: 0;\n margin: 0;\n height: var(--anchor-tabs-height);\n white-space: nowrap;\n overflow: scroll;\n scrollbar-width: none;\n ::-webkit-scrollbar {\n display: none;\n }\n scroll-behavior: smooth;\n\n @media ", " {\n & {\n width: ", ";\n }\n }\n"])), function (_ref3) {
|
|
6037
|
-
var tabsOverflow = _ref3.tabsOverflow;
|
|
6200
|
+
return bottomBorder ? '2px solid var(--base-color-light-grey)' : 'none';
|
|
6201
|
+
}, zIndexes.anchor);
|
|
6202
|
+
var TabsGrid = /*#__PURE__*/styled(Grid)(_templateObject2$u || (_templateObject2$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--anchor-tabs-height);\n"])));
|
|
6203
|
+
var TabsWrapper = /*#__PURE__*/styled.div(_templateObject3$k || (_templateObject3$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n"])));
|
|
6204
|
+
var TabsList = /*#__PURE__*/styled.ul(_templateObject4$g || (_templateObject4$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: ", ";\n display: flex;\n gap: ", "px;\n justify-content: ", ";\n align-items: center;\n list-style: none;\n padding: 0;\n margin: 0;\n height: var(--anchor-tabs-height);\n white-space: nowrap;\n overflow: scroll;\n scrollbar-width: none;\n ::-webkit-scrollbar {\n display: none;\n }\n scroll-behavior: smooth;\n\n @media ", " {\n background: linear-gradient(\n 135deg,\n rgba(255, 255, 255, 1) 0%,\n rgba(255, 255, 255, 0.48) 85%,\n rgba(235, 235, 235, 0.4) 99%,\n rgba(255, 255, 255, 0.39) 100%\n );\n }\n\n @media ", " {\n & {\n width: ", ";\n }\n }\n"])), function (_ref2) {
|
|
6205
|
+
var tabsOverflow = _ref2.tabsOverflow;
|
|
6038
6206
|
return tabsOverflow ? 'calc(100% - 74px)' : '100%';
|
|
6039
|
-
}, LIST_ITEM_GAP, function (
|
|
6040
|
-
var tabsOverflow =
|
|
6207
|
+
}, LIST_ITEM_GAP, function (_ref3) {
|
|
6208
|
+
var tabsOverflow = _ref3.tabsOverflow;
|
|
6041
6209
|
return tabsOverflow ? 'start' : 'center';
|
|
6042
|
-
}, devices.mobile, function (
|
|
6043
|
-
var tabsOverflow =
|
|
6044
|
-
hasTwoArrows =
|
|
6210
|
+
}, devices.mobileAndTablet, devices.mobile, function (_ref4) {
|
|
6211
|
+
var tabsOverflow = _ref4.tabsOverflow,
|
|
6212
|
+
hasTwoArrows = _ref4.hasTwoArrows;
|
|
6045
6213
|
return tabsOverflow && hasTwoArrows ? 'calc(100% - 50px)' : '100%';
|
|
6046
6214
|
});
|
|
6047
|
-
var ArrowsContainer = /*#__PURE__*/styled.div(
|
|
6048
|
-
var
|
|
6049
|
-
return
|
|
6050
|
-
});
|
|
6051
|
-
var ArrowWrapper = /*#__PURE__*/styled.div(_templateObject0$2 || (_templateObject0$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 24px;\n height: 24px;\n cursor: ", ";\n pinter-events: ", ";\n display: flex;\n align-items: center;\n justify-content: flex-center;\n\n && svg path {\n fill: ", ";\n }\n"])), function (_ref8) {
|
|
6052
|
-
var disabled = _ref8.disabled;
|
|
6053
|
-
return disabled ? 'not-allowed' : 'pointer';
|
|
6054
|
-
}, function (_ref9) {
|
|
6055
|
-
var disabled = _ref9.disabled;
|
|
6056
|
-
return disabled ? 'none' : 'auto';
|
|
6057
|
-
}, function (_ref0) {
|
|
6058
|
-
var disabled = _ref0.disabled;
|
|
6059
|
-
return disabled ? 'var(--color-state-disabled)' : 'var(--button-anchor-tab-color)';
|
|
6215
|
+
var ArrowsContainer = /*#__PURE__*/styled.div(_templateObject5$c || (_templateObject5$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: ", ";\n height: var(--anchor-tabs-height);\n background-color: var(--base-color-white);\n display: flex;\n align-items: center;\n justify-content: flex-end;\n gap: 10px;\n"])), function (_ref5) {
|
|
6216
|
+
var fullWidth = _ref5.fullWidth;
|
|
6217
|
+
return fullWidth ? '74px' : '46px';
|
|
6060
6218
|
});
|
|
6061
|
-
|
|
6062
|
-
/* eslint-disable no-shadow */
|
|
6063
|
-
var CarouselType;
|
|
6064
|
-
(function (CarouselType) {
|
|
6065
|
-
CarouselType["Image"] = "image";
|
|
6066
|
-
CarouselType["SmallCard"] = "SmallCard";
|
|
6067
|
-
CarouselType["LargeCard"] = "LargeCard";
|
|
6068
|
-
})(CarouselType || (CarouselType = {}));
|
|
6069
|
-
|
|
6070
|
-
// eslint-disable-next-line no-shadow
|
|
6071
|
-
var ButtonType;
|
|
6072
|
-
(function (ButtonType) {
|
|
6073
|
-
ButtonType["Primary"] = "Primary";
|
|
6074
|
-
ButtonType["Secondary"] = "Secondary";
|
|
6075
|
-
ButtonType["Tertiary"] = "Tertiary";
|
|
6076
|
-
})(ButtonType || (ButtonType = {}));
|
|
6077
|
-
|
|
6078
|
-
var css_248z$1 = "@font-face {\n font-family: 'GreyLLTT';\n src: url('https://static.roh.org.uk/fonts/harmonic/GreyLLTT-Regular.woff2') format('woff2');\n font-weight: 400;\n font-style: normal;\n font-display: swap;\n}\n\n@font-face {\n font-family: 'GreyLLTT';\n src: url('https://static.roh.org.uk/fonts/harmonic/GreyLLTT-Medium.woff2') format('woff2');\n font-weight: 500;\n font-style: normal;\n font-display: swap;\n}\n\n@font-face {\n font-family: 'GreyLLTT';\n src: url('https://static.roh.org.uk/fonts/harmonic/GreyLLTT-Bold.woff2') format('woff2');\n font-weight: 700;\n font-style: normal;\n font-display: swap;\n}\n\n@font-face {\n font-family: 'VictorSerif';\n src: url('https://static.roh.org.uk/fonts/harmonic/VictorSerif-Medium.woff2')\n format('woff2');\n font-weight: 500;\n font-style: normal;\n font-display: swap;\n}\n\n@font-face {\n font-family: 'VictorSerif';\n src: url('https://static.roh.org.uk/fonts/harmonic/VictorSerif-MediumItalic.woff2')\n format('woff2');\n font-weight: 500;\n font-style: italic;\n font-display: swap;\n}\n";
|
|
6079
|
-
styleInject(css_248z$1);
|
|
6080
|
-
|
|
6081
|
-
var css_248z$2 = "/* ~~~~~ General Styling Classes ~~~~~ */\n.typography_color-primary__LOfDi {\n color: var(--color-primary);\n}\n\n.typography_color-black__6MHRL {\n color: var(--color-base-black);\n}\n\n.typography_color-white__PfW5s {\n color: var(--color-base-white);\n}\n\n.typography_color-red__iPlbG {\n color: var(--color-primary-red);\n}\n\n.typography_color-grey__GA1c2 {\n color: var(--color-base-dark-grey);\n}\n\n.typography_color-inherit__RDd0Y {\n color: inherit;\n}\n\n.typography_em__E6tX- {\n font-style: italic;\n}\n/* ~~~ */\n\n/* Display Headers */\n.typography_display__-F3p4 {\n margin: 0;\n font-family: var(--font-family-sans);\n line-height: 100%;\n\n &.typography_large__uq0zC {\n font-size: 96px;\n font-weight: 700;\n letter-spacing: -5px;\n }\n\n &.typography_small__wfQ0K {\n font-size: 68px;\n font-weight: 500;\n letter-spacing: -3px;\n }\n\n /* Serif and Italic styles */\n &.typography_serif__VSO38,\n &.typography_em__E6tX- {\n font-family: var(--font-family-serif);\n font-weight: 500;\n }\n\n /* Serif and Italic adjustments */\n &.typography_large__uq0zC.typography_serif__VSO38,\n &.typography_large__uq0zC.typography_em__E6tX- {\n letter-spacing: -3px;\n }\n\n &.typography_small__wfQ0K.typography_serif__VSO38,\n &.typography_small__wfQ0K.typography_em__E6tX- {\n letter-spacing: -2px;\n }\n\n @media (max-width: 699px) {\n &.typography_large__uq0zC {\n font-size: 38px;\n letter-spacing: -1.5px;\n }\n\n &.typography_small__wfQ0K {\n font-size: 32px;\n letter-spacing: -1.5px;\n }\n\n &.typography_large__uq0zC.typography_serif__VSO38,\n &.typography_large__uq0zC.typography_em__E6tX-,\n &.typography_small__wfQ0K.typography_serif__VSO38,\n &.typography_small__wfQ0K.typography_em__E6tX- {\n letter-spacing: -0.5px;\n }\n }\n}\n\n/* Headers */\n.typography_header__BexiD {\n margin: 0;\n font-family: var(--font-family-sans);\n font-weight: 500;\n\n &.typography_large__uq0zC {\n font-size: 44px;\n line-height: 48px;\n letter-spacing: -1.5px;\n }\n\n &.typography_medium__K0uZD {\n font-size: 34px;\n line-height: 40px;\n letter-spacing: -1px;\n }\n\n &.typography_small__wfQ0K {\n font-size: 26px;\n line-height: 32px;\n letter-spacing: -0.5px;\n }\n\n /* Serif and Italic styles */\n &.typography_serif__VSO38,\n &.typography_em__E6tX- {\n font-family: var(--font-family-serif);\n }\n\n /* Serif and Italic letter-spacing overrides */\n &.typography_large__uq0zC.typography_serif__VSO38,\n &.typography_large__uq0zC.typography_em__E6tX- {\n letter-spacing: -0.5px;\n }\n\n &.typography_medium__K0uZD.typography_serif__VSO38,\n &.typography_medium__K0uZD.typography_em__E6tX- {\n letter-spacing: -0.5px;\n }\n\n &.typography_small__wfQ0K.typography_serif__VSO38,\n &.typography_small__wfQ0K.typography_em__E6tX- {\n letter-spacing: -0.5px;\n }\n\n @media (max-width: 699px) {\n &.typography_large__uq0zC {\n font-size: 28px;\n line-height: 34px;\n letter-spacing: -1.5px;\n }\n\n &.typography_medium__K0uZD {\n font-size: 24px;\n line-height: 28px;\n letter-spacing: -1px;\n }\n\n &.typography_small__wfQ0K {\n font-size: 20px;\n line-height: 26px;\n letter-spacing: -0.75px;\n }\n\n /* Mobile overrides for serif/italic letter-spacing */\n &.typography_large__uq0zC.typography_serif__VSO38,\n &.typography_large__uq0zC.typography_em__E6tX-,\n &.typography_medium__K0uZD.typography_serif__VSO38,\n &.typography_medium__K0uZD.typography_em__E6tX-,\n &.typography_small__wfQ0K.typography_serif__VSO38,\n &.typography_small__wfQ0K.typography_em__E6tX- {\n letter-spacing: -0.5px;\n }\n }\n}\n\n/* Subtitle */\n.typography_subtitle__aoFTV {\n margin: 0;\n font-family: var(--font-family-sans);\n font-weight: 500;\n\n &.typography_large__uq0zC {\n font-size: 19px;\n line-height: 26px;\n letter-spacing: -0.5px;\n }\n\n &.typography_small__wfQ0K {\n font-size: 17px;\n line-height: 24px;\n letter-spacing: -0.5px;\n }\n\n @media (max-width: 699px) {\n &.typography_large__uq0zC {\n font-size: 17px;\n line-height: 24px;\n letter-spacing: -0.5px;\n }\n\n &.typography_small__wfQ0K {\n font-size: 14px;\n line-height: 20px;\n letter-spacing: -0.2px;\n }\n }\n}\n\n/* Body Copy */\n.typography_bodycopy__vYtQ8 {\n margin: 0;\n font-family: var(--font-family-sans);\n font-weight: 400;\n\n &.typography_large__uq0zC {\n font-size: 19px;\n line-height: 26px;\n letter-spacing: -0.5px;\n }\n\n &.typography_medium__K0uZD {\n font-size: 17px;\n line-height: 24px;\n letter-spacing: -0.5px;\n }\n\n &.typography_small__wfQ0K {\n font-size: 14px;\n line-height: 20px;\n letter-spacing: -0.5px;\n }\n\n @media (max-width: 699px) {\n &.typography_large__uq0zC {\n font-size: 17px;\n line-height: 24px;\n letter-spacing: -0.5px;\n }\n\n &.typography_medium__K0uZD {\n font-size: 14px;\n line-height: 20px;\n letter-spacing: -0.2px;\n }\n\n &.typography_small__wfQ0K {\n font-size: 11px;\n line-height: 16px;\n letter-spacing: -0.2px;\n }\n }\n}\n\n/* Overline */\n.typography_overline__EnUK3 {\n margin: 0;\n font-family: var(--font-family-sans);\n font-weight: 500;\n text-transform: uppercase;\n\n &.typography_large__uq0zC {\n font-size: 14px;\n line-height: 18px;\n letter-spacing: 0.3px;\n }\n\n &.typography_small__wfQ0K {\n font-size: 12px;\n line-height: 14px;\n letter-spacing: 0.2px;\n }\n\n @media (max-width: 699px) {\n &.typography_large__uq0zC {\n line-height: 17px;\n letter-spacing: 0.3px; /* Added to ensure it stays */\n }\n\n &.typography_small__wfQ0K {\n line-height: 14px;\n letter-spacing: 0.3px;\n }\n }\n}\n\n/* Button Text */\n.typography_buttontext__vcxNi {\n margin: 0;\n font-family: var(--font-family-sans);\n font-size: 17px;\n line-height: 20px;\n letter-spacing: -0.5px;\n font-weight: 400;\n\n @media (max-width: 699px) {\n font-weight: 500;\n line-height: 17px;\n }\n}\n\n/* Caption Text */\n.typography_captiontext__91UFb {\n margin: 0;\n font-family: var(--font-family-sans);\n font-weight: 400;\n font-size: 17px;\n line-height: 24px;\n letter-spacing: -0.5px;\n\n @media (max-width: 699px) {\n font-size: 14px;\n line-height: 20px;\n letter-spacing: -0.2px;\n }\n}\n\n/* Navigation Text */\n.typography_navigationtext__YfGf7 {\n margin: 0;\n font-family: var(--font-family-sans);\n font-size: 19px;\n line-height: 19px;\n letter-spacing: 0.4px;\n font-weight: 500;\n\n @media (max-width: 699px) {\n font-size: 17px;\n line-height: 17px;\n }\n}\n";
|
|
6082
|
-
styleInject(css_248z$2);
|
|
6083
|
-
|
|
6084
|
-
var css_248z$3 = ".core-theme-module_coreTheme__pWxYB {\n /* RBO Red */\n /* Primary Palette */\n --color-primary: #1a1a1a;\n --color-primary-background: #eb0a0a;\n --color-primary-red: #eb0a0a;\n --color-primary-black: #1a1a1a;\n\n /* Base Colours */\n --color-base-white: #ffffff;\n --color-base-black: #000000;\n --color-base-dark-grey: #4c4f53;\n --color-base-mid-grey: #72767c;\n --color-base-light-grey: #e9e9e9;\n --color-base-transparent: transparent;\n\n /* States */\n --color-state-error: #cc071e;\n --color-state-medium: #ffce45;\n --color-state-good: #2a874a;\n --color-state-focused: #1e1da0;\n --color-state-disabled: #b3b3b3;\n\n /* RBO Red (Core) */\n --color-rbo-red-hovered: #c40808;\n --color-rbo-red-pressed: #9d0707;\n\n /* RBO Black */\n --color-rbo-black-hovered: #575757;\n --color-rbo-black-pressed: #353535;\n\n /* Black */\n --color-black-hovered: #575757;\n --color-black-pressed: #353535;\n\n /* White */\n --color-white-hovered: #fafafa;\n --color-white-pressed: #f2f2f2;\n\n /* Secondary Palette */\n --color-secondary-yellow: #ffce45;\n --color-secondary-pink: #ff36d0;\n --color-secondary-orange: #ff6700;\n --color-secondary-blue: #5f9cff;\n\n /* Shadows */\n --shadow-floating: 0px 4px 38px 0px #0000000a;\n\n /* Core theme colors */\n --base-color-primary: #c8102e;\n --base-color-core: #c8102e;\n --base-color-stream: #1866dc;\n --base-color-cinema: #1a1a1a;\n --base-color-white: #ffffff;\n --base-color-black: #000000;\n --base-color-dark-grey: #4c4f53;\n --base-color-mid-grey: #72767c;\n --base-color-light-grey: #e9e9e9;\n --base-color-transparent: transparent;\n --base-color-errorstate: #eb0a0a;\n --base-color-mediumstate: #ffce45;\n --base-color-goodstate: #2a874a;\n --base-color-progress: #1866dc;\n --base-color-navigation: #c8102e;\n --base-color-lapislazuli: #0060a0;\n --base-color-lemonchiffon: #fffbbe;\n\n --button-height: 48px;\n --button-line-height: 20px;\n --button-padding-x: 20px;\n --button-padding-y: 14px;\n --button-padding-y-icon: 12px;\n --button-icon-margin: 12px;\n --button-icon-width: 20px;\n --button-icon-height: 20px;\n --button-font-size: 14px;\n --button-font-weight: 400;\n --button-color: var(--color-base-white);\n --button-bg-color: var(--color-primary-red);\n --button-hover-color: var(--color-rbo-red-hovered);\n --button-pressed-color: var(--color-rbo-red-pressed);\n --button-secondary-color: var(--color-primary-red);\n --button-secondary-hover-color: var(--color-rbo-red-hovered);\n --button-secondary-pressed-color: var(--color-rbo-red-pressed);\n --button-tertiary-color: var(--color-primary-black);\n --button-tertiary-hover-color: var(--color-rbo-black-hovered);\n --button-tertiary-pressed-color: var(--color-rbo-black-pressed);\n --button-auxiliary-color: var(--color-primary-black);\n --button-auxiliary-bg-color: var(--color-base-transparent);\n --button-anchor-tab-color: var(--color-primary-red);\n\n /* ----- Variables already used in Harmonic START ----- */\n --grid-column-gap: 36px;\n --grid-margin: 10%;\n\n --rotator-button-width: 60px;\n --rotator-button-icon-width: 36px;\n --rotator-button-color: var(--color-primary-black);\n --rotator-button-bg-color: var(--color-base-light-grey);\n --rotator-button-hover-color: var(--color-base-white);\n --rotator-button-hover-bg-color: var(--color-primary-red);\n\n --carousel-image-caption-height: 17px;\n\n --line-height-listing: 36px;\n\n --font-feature-settings-body: 'pnum' on, 'onum' on, 'liga' off;\n --font-feature-settings-header: 'tnum' on, 'lnum' on;\n --font-feature-settings-subtitle: 'tnum' on, 'lnum' on;\n\n --text-transform-body: none;\n --text-transform-header: uppercase;\n --text-transform-subtitle: uppercase;\n\n @media (max-width: 699px) {\n --grid-column-gap: 12px;\n --grid-margin: 20px;\n --rotator-button-width: 40px;\n --rotator-button-icon-width: 24px;\n --carousel-image-caption-height: 14px;\n\n --line-height-listing: 34px;\n\n --font-feature-settings-body: 'pnum' on, 'onum' on, 'liga' off;\n --font-feature-settings-header: 'tnum' on, 'lnum' on;\n --font-feature-settings-subtitle: 'tnum' on, 'lnum' on;\n\n --text-transform-body: none;\n --text-transform-header: uppercase;\n --text-transform-subtitle: uppercase;\n }\n\n @media (min-width: 700px) and (max-width: 1139px) {\n --grid-column-gap: 20px;\n --grid-margin: 32px;\n --rotator-button-width: 44px;\n --rotator-button-icon-width: 24px;\n --carousel-image-caption-height: 14px;\n }\n\n /* ----- Variables already used in Harmonic END ----- */\n\n --font-size-header-1: 96px;\n --font-weight-header-1: 500;\n --letter-spacing-header-1: 2px;\n --line-height-header-1: 110px;\n --margin-header-1: 0.67em 0;\n\n --font-size-header-2: 68px;\n --font-weight-header-2: 500;\n --letter-spacing-header-2: 1px;\n --line-height-header-2: 72px;\n --margin-header-2: 0.83em 0;\n\n --font-size-header-3: 44px;\n --font-weight-header-3: 500;\n --letter-spacing-header-3: 1px;\n --line-height-header-3: 48px;\n --margin-header-3: 1em 0;\n\n --font-size-header-4: 34px;\n --font-weight-header-4: 500;\n --letter-spacing-header-4: 1px;\n --line-height-header-4: 40px;\n --margin-header-4: 1.33em 0;\n\n --font-size-header-5: 24px;\n --font-weight-header-5: 500;\n --letter-spacing-header-5: 1px;\n --line-height-header-5: 30px;\n --margin-header-5: 1.67em 0;\n\n --font-size-header-6: 20px;\n --font-weight-header-6: 500;\n --letter-spacing-header-6: 1px;\n --line-height-header-6: 28px;\n --margin-header-6: 2.33em 0;\n\n --font-size-altHeader-3: 44px;\n --font-weight-altHeader-3: normal;\n --letter-spacing-altHeader-3: normal;\n --line-height-altHeader-3: 48px;\n\n --font-size-altHeader-4: 34px;\n --font-weight-altHeader-4: normal;\n --letter-spacing-altHeader-4: normal;\n --line-height-altHeader-4: 44px;\n\n --font-size-altHeader-5: 24px;\n --font-weight-altHeader-5: normal;\n --letter-spacing-altHeader-5: normal;\n --line-height-altHeader-5: 30px;\n\n --font-size-altHeader-6: 20px;\n --font-weight-altHeader-6: normal;\n --letter-spacing-altHeader-6: normal;\n --line-height-altHeader-6: 28px;\n\n --font-size-overline-1: 14px;\n --font-weight-overline-1: 500;\n --letter-spacing-overline-1: 1px;\n --line-height-overline-1: 16px;\n\n --font-size-overline-2: 12px;\n --font-weight-overline-2: 500;\n --letter-spacing-overline-2: 1px;\n --line-height-overline-2: 14px;\n\n --font-size-overline-3: 10px;\n --font-weight-overline-3: 500;\n --letter-spacing-overline-3: 1px;\n --line-height-overline-3: 12px;\n\n --font-size-overline-4: 8px;\n --font-weight-overline-4: 500;\n --letter-spacing-overline-4: 1px;\n --line-height-overline-4: 10px;\n\n --font-size-body-1: 19px;\n --font-weight-body-1: 400;\n --letter-spacing-body-1: normal;\n --line-height-body-1: 26px;\n\n --font-size-body-2: 16px;\n --font-weight-body-2: 400;\n --letter-spacing-body-2: normal;\n --line-height-body-2: 22px;\n\n --font-size-body-3: 14px;\n --font-weight-body-3: 400;\n --letter-spacing-body-3: normal;\n --line-height-body-3: 20px;\n\n --font-size-subtitle-1: 18px;\n --font-weight-subtitle-1: 500;\n --letter-spacing-subtitle-1: 1px;\n --line-height-subtitle-1: 22px;\n\n --font-size-subtitle-2: 14px;\n --font-weight-subtitle-2: 500;\n --letter-spacing-subtitle-2: 1px;\n --line-height-subtitle-2: 22px;\n\n --font-size-title-description: 20px;\n --line-height-title-description: 28px;\n\n --font-size-individual-listing-name: 19px;\n --line-height-individual-listing-name: 24px;\n --line-height-people-listing-gap: 24px;\n\n --font-family-header: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-altHeader: 'adobe-garamond-pro';\n --font-family-body: 'adobe-garamond-pro';\n --font-family-body-italics: 'adobe-garamond-pro';\n --font-family-buttons: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-overline: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-subtitle: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-people-listing-role: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-people-listing-name: 'adobe-garamond-pro';\n\n --font-feature-settings-altHeader: 'pnum' on, 'onum' on;\n --font-feature-settings-overline: 'tnum' on, 'lnum' on, 'liga' off, 'calt' off;\n --font-feature-settings-navigation: 'tnum' on, 'lnum' on, 'liga' off, 'calt' off;\n\n --text-transform-altHeader: none;\n --text-transform-overline: uppercase;\n\n --word-break-header: break-word;\n --word-break-altHeader: break-word;\n --word-break-body: break-word;\n --word-break-overline: break-word;\n --word-break-subtitle: break-word;\n\n --font-family-navigation: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-size-navigation: 13px;\n --font-weight-navigation: 500;\n --line-height-navigation: 16px;\n --text-transform-navigation: uppercase;\n --letter-spacing-navigation: 1px;\n\n --navigation-small-gap: 16px;\n --navigation-middle-gap: 20px;\n --navigation-large-gap: 24px;\n --navigation-xlarge-gap: 36px;\n --navigation-large-margin: 60px;\n\n --font-size-search: 24px;\n --font-family-search: 'adobe-garamond-pro';\n\n --grid-outer-margin: 50px;\n --grid-template-columns: 14px calc(10% - 86px) repeat(12, minmax(0, 1fr)) calc(10% - 86px) 14px;\n\n --footer-height: 380px;\n --footer-padding-top: 44px;\n --footer-padding-bottom: 44px;\n --footer-items-gap: 32px;\n --footer-media-gap: 32px;\n --footer-media-icon-width: 24px;\n --footer-media-icon-height: 24px;\n --footer-vertical-spacing-lg: 58px;\n --footer-vertical-spacing-sm: 16px;\n\n --text-link-underline-offset: 8px;\n --cards-spacing-stack: 40px;\n\n --editorial-subtitle-margin-bottom: 16px;\n --editorial-margin-between: 24px;\n --editorial-spacing-hover: 4px;\n --anchor-tabs-height: 70px;\n\n --font-family-sans: 'GreyLLTT', 'Roboto', sans-serif;\n --font-family-serif: 'VictorSerif', 'Inria Serif Regular', serif;\n\n --harmonic-text-link-underline-offset: 6px;\n --harmonic-font-size-navigation: 19px;\n\n --announcement-banner-color: var(--color-base-white);\n --announcement-banner-bg-color: var(--color-primary-red);\n --announcement-banner-hover-color: var(--color-white-hovered);\n --announcement-banner-pressed-color: var(--color-white-pressed);\n\n --information-panel-color: var(--color-base-white);\n --information-panel-bg-color: var(--color-primary-red);\n --information-panel-button-color: var(--color-primary-black);\n --information-panel-button-bg-color: var(--color-base-white);\n --information-panel-button-hover-color: var(--color-white-hovered);\n --information-panel-button-pressed-color: var(--color-white-pressed);\n\n --heading-promo-bg-color: var(--color-primary-red);\n --page-header-bg-color: var(--color-primary-red);\n\n @media (max-width: 699px) {\n --font-size-header-1: 38px;\n --font-weight-header-1: 500;\n --letter-spacing-header-1: 1px;\n --line-height-header-1: 42px;\n\n --font-size-header-2: 30px;\n --font-weight-header-2: 500;\n --letter-spacing-header-2: 1px;\n --line-height-header-2: 34px;\n\n --font-size-header-3: 26px;\n --font-weight-header-3: 500;\n --letter-spacing-header-3: 1px;\n --line-height-header-3: 30px;\n\n --font-size-header-4: 24px;\n --font-weight-header-4: 500;\n --letter-spacing-header-4: 1px;\n --line-height-header-4: 28px;\n\n --font-size-header-5: 20px;\n --font-weight-header-5: 500;\n --letter-spacing-header-5: 1px;\n --line-height-header-5: 28px;\n\n --font-size-header-6: 17px;\n --font-weight-header-6: 500;\n --letter-spacing-header-6: 1px;\n --line-height-header-6: 24px;\n\n --font-size-altHeader-3: 26px;\n --font-weight-altHeader-3: normal;\n --letter-spacing-altHeader-3: normal;\n --line-height-altHeader-3: 30px;\n\n --font-size-altHeader-4: 24px;\n --font-weight-altHeader-4: normal;\n --letter-spacing-altHeader-4: normal;\n --line-height-altHeader-4: 28px;\n\n --font-size-altHeader-5: 20px;\n --font-weight-altHeader-5: normal;\n --letter-spacing-altHeader-5: normal;\n --line-height-altHeader-5: 28px;\n\n --font-size-altHeader-6: 17px;\n --font-weight-altHeader-6: normal;\n --letter-spacing-altHeader-6: normal;\n --line-height-altHeader-6: 24px;\n\n --font-size-overline-1: 14px;\n --font-weight-overline-1: 500;\n --letter-spacing-overline-1: 1px;\n --line-height-overline-1: 16px;\n\n --font-size-overline-2: 12px;\n --font-weight-overline-2: 500;\n --letter-spacing-overline-2: 1px;\n --line-height-overline-2: 14px;\n\n --font-size-body-1: 17px;\n --font-weight-body-1: 400;\n --letter-spacing-body-1: normal;\n --line-height-body-1: 24px;\n\n --font-size-body-2: 12px;\n --font-weight-body-2: 400;\n --letter-spacing-body-2: normal;\n --line-height-body-2: 18px;\n\n --font-size-body-3: 11px;\n --font-weight-body-3: 400;\n --letter-spacing-body-3: normal;\n --line-height-body-3: 16px;\n\n --font-size-subtitle-1: 16px;\n --font-weight-subtitle-1: 500;\n --letter-spacing-subtitle-1: 1px;\n --line-height-subtitle-1: 24px;\n\n --font-size-subtitle-2: 14px;\n --font-weight-subtitle-2: 500;\n --letter-spacing-subtitle-2: 1px;\n --line-height-subtitle-2: 18px;\n\n --font-size-title-description: 17px;\n --line-height-title-description: 24px;\n --line-height-people-listing-gap: 16px;\n\n --font-size-search: 20px;\n --font-family-search: 'adobe-garamond-pro';\n\n --font-family-header: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-altHeader: 'adobe-garamond-pro';\n --font-family-body: 'adobe-garamond-pro';\n --font-family-body-italics: 'adobe-garamond-pro';\n --font-family-buttons: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-overline: 'Gotham SSm Medium', sans-serif;\n --font-family-subtitle: 'Gotham SSm Medium', 'Montserrat', sans-serif;\n --font-family-people-listing-role: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-people-listing-name: 'adobe-garamond-pro';\n\n --font-feature-settings-altHeader: 'pnum' on, 'onum' on;\n --font-feature-settings-overline: 'tnum' on, 'lnum' on, 'liga' off, 'calt' off;\n --font-feature-settings-navigation: 'tnum' on, 'lnum' on, 'liga' off, 'calt' off;\n\n --text-transform-altHeader: none;\n --text-transform-overline: uppercase;\n\n --word-break-header: break-word;\n --word-break-altHeader: break-word;\n --word-break-body: break-word;\n --word-break-overline: break-word;\n --word-break-subtitle: break-word;\n\n --grid-template-columns: calc(20px - 12px) repeat(12, minmax(0, 1fr)) calc(20px - 12px);\n\n --footer-height: auto;\n --footer-padding-top: 20px;\n --footer-padding-bottom: 20px;\n --footer-items-gap: 12px;\n --footer-media-icon-width: 28px;\n --footer-media-icon-height: 28px;\n --footer-vertical-spacing-lg: 24px;\n --footer-vertical-spacing-sm: 24px;\n\n --anchor-tabs-height: 60px;\n }\n\n @media (min-width: 700px) and (max-width: 1139px) {\n --grid-template-columns: calc(32px - 20px) repeat(12, minmax(0, 1fr)) calc(32px - 20px);\n --font-size-header-6: 17px;\n --font-size-altHeader-4: 24px;\n --font-size-body-1: 17px;\n\n --footer-media-gap: 24px;\n --footer-padding-top: 40px;\n --footer-padding-bottom: 40px;\n }\n}\n";
|
|
6085
|
-
var coreThemeStyles = {"coreTheme":"core-theme-module_coreTheme__pWxYB"};
|
|
6086
|
-
styleInject(css_248z$3);
|
|
6087
|
-
|
|
6088
|
-
var css_248z$4 = ".stream-theme-module_streamTheme__lTfqQ {\n /* Stream theme overrides */\n --base-color-primary: #1a1a1a;\n --color-primary: #1a1a1a;\n --color-primary-background: #1a1a1a;\n --color-primary-button: #1a1a1a;\n --color-secondary-button: #ffffff;\n --color-tertiary-button: transparent;\n --color-auxiliary-button: transparent;\n --color-primary-button-reverse-bg: #1a1a1a;\n --color-primary-button-reverse: #ffffff;\n\n --button-color: var(--color-base-white);\n --button-bg-color: var(--color-primary-black);\n --button-hover-color: var(--color-black-hovered);\n --button-pressed-color: var(--color-black-pressed);\n --button-secondary-color: var(--color-primary-black);\n --button-secondary-hover-color: var(--color-black-hovered);\n --button-secondary-pressed-color: var(--color-black-pressed);\n --button-tertiary-color: var(--color-primary-black);\n --button-tertiary-hover-color: var(--color-rbo-black-hovered);\n --button-tertiary-pressed-color: var(--color-rbo-black-pressed);\n --button-anchor-tab-color: var(--color-primary-black);\n\n --rotator-button-color: var(--color-base-black);\n --rotator-button-bg-color: var(--color-base-light-grey);\n --rotator-button-hover-color: var(--color-base-white);\n --rotator-button-hover-bg-color: var(--color-primary-black);\n\n --announcement-banner-color: var(--color-base-white);\n --announcement-banner-bg-color: var(--color-primary-black);\n --announcement-banner-hover-color: var(--color-white-hovered);\n --announcement-banner-pressed-color: var(--color-white-pressed);\n\n --information-panel-color: var(--color-base-white);\n --information-panel-bg-color: var(--color-primary-black);\n\n --heading-promo-bg-color: var(--color-base-black);\n --page-header-bg-color: var(--color-primary-black);\n}\n";
|
|
6089
|
-
var streamThemeStyles = {"streamTheme":"stream-theme-module_streamTheme__lTfqQ"};
|
|
6090
|
-
styleInject(css_248z$4);
|
|
6091
|
-
|
|
6092
|
-
var css_248z$5 = ".cinema-theme-module_cinemaTheme__f5QFs {\n /* White */\n --base-color-primary: #1a1a1a;\n --color-primary: #1a1a1a;\n --color-primary-button: #ffffff;\n --color-primary-background: #1a1a1a;\n --color-primary-button-reverse-bg: #ffffff;\n --color-primary-button-reverse: #1a1a1a;\n --color-secondary-button: #ffffff;\n --color-tertiary-button: transparent;\n --color-auxiliary-button: transparent;\n --color-white-hovered: #fafafa;\n --color-white-pressed: #f2f2f2;\n\n --button-color: var(--color-primary-black);\n --button-bg-color: var(--color-base-white);\n --button-hover-color: var(--color-white-hovered);\n --button-pressed-color: var(--color-white-pressed);\n --button-secondary-color: var(--color-base-white);\n --button-secondary-hover-color: var(--color-white-hovered);\n --button-secondary-pressed-color: var(--color-white-pressed);\n --button-tertiary-color: var(--color-base-white);\n --button-tertiary-hover-color: var(--color-white-hovered);\n --button-tertiary-pressed-color: var(--color-white-pressed);\n --button-anchor-tab-color: var(--color-primary-black);\n\n --rotator-button-color: var(--color-primary-black);\n --rotator-button-bg-color: var(--color-base-light-grey);\n --rotator-button-hover-color: var(--color-base-white);\n --rotator-button-hover-bg-color: var(--color-primary-black);\n\n --announcement-banner-color: var(--color-primary-red);\n --announcement-banner-bg-color: var(--color-base-white);\n --announcement-banner-hover-color: var(--color-rbo-red-hovered);\n --announcement-banner-pressed-color: var(--color-rbo-red-pressed);\n\n --information-panel-color: var(--color-primary-black);\n --information-panel-bg-color: var(--color-base-white);\n --information-panel-button-color: var(--color-base-white);\n --information-panel-button-bg-color: var(--color-primary-red);\n --information-panel-button-hover-color: var(--color-rbo-red-hovered);\n --information-panel-button-pressed-color: var(--color-rbo-red-pressed);\n\n --heading-promo-bg-color: var(--color-base-white); \n --page-header-bg-color: var(--color-primary-black);\n};";
|
|
6093
|
-
var cinemaThemeStyles = {"cinemaTheme":"cinema-theme-module_cinemaTheme__f5QFs"};
|
|
6094
|
-
styleInject(css_248z$5);
|
|
6095
|
-
|
|
6096
|
-
var css_248z$6 = ".schools-theme-module_schoolsTheme__CWHba {\n /* Schools theme overrides */\n --base-color-primary: #c8102e;\n --color-primary: #c8102e;\n --color-primary-button: #c8102e;\n --color-primary-button-reverse-bg: #1a1a1a;\n --color-primary-button-reverse: #ffffff;\n --color-secondary-button: #ffffff;\n --color-tertiary-button: transparent;\n --color-auxiliary-button: transparent;\n\n --text-transform-header: none;\n --text-transform-altHeader: none;\n --text-transform-body: none;\n --text-transform-overline: none;\n --text-transform-subtitle: none;\n --text-transform-navigation: uppercase;\n\n @media only screen and (max-width: calc(var(--breakpoint-sm) - 1px)) {\n --text-transform-header: none;\n --text-transform-altHeader: none;\n --text-transform-body: none;\n --text-transform-overline: none;\n --text-transform-subtitle: none;\n --text-transform-navigation: uppercase;\n }\n}\n";
|
|
6097
|
-
var schoolsThemeStyles = {"schoolsTheme":"schools-theme-module_schoolsTheme__CWHba"};
|
|
6098
|
-
styleInject(css_248z$6);
|
|
6099
|
-
|
|
6100
|
-
/* eslint-disable react/jsx-no-useless-fragment */
|
|
6101
|
-
var DEFAULT_THEME = ThemeType.Core;
|
|
6102
|
-
var getThemeClass = function getThemeClass(theme) {
|
|
6103
|
-
// Always include the base (core) theme class
|
|
6104
|
-
var baseThemeClass = coreThemeStyles.coreTheme;
|
|
6105
|
-
var overrideClass = '';
|
|
6106
|
-
switch (theme) {
|
|
6107
|
-
case ThemeType.Core:
|
|
6108
|
-
overrideClass = '';
|
|
6109
|
-
break;
|
|
6110
|
-
case ThemeType.Stream:
|
|
6111
|
-
overrideClass = streamThemeStyles.streamTheme;
|
|
6112
|
-
break;
|
|
6113
|
-
case ThemeType.Cinema:
|
|
6114
|
-
overrideClass = cinemaThemeStyles.cinemaTheme;
|
|
6115
|
-
break;
|
|
6116
|
-
case ThemeType.Schools:
|
|
6117
|
-
overrideClass = schoolsThemeStyles.schoolsTheme;
|
|
6118
|
-
break;
|
|
6119
|
-
default:
|
|
6120
|
-
overrideClass = '';
|
|
6121
|
-
}
|
|
6122
|
-
// Return the combined classes
|
|
6123
|
-
return [baseThemeClass, overrideClass].filter(Boolean).join(' ');
|
|
6124
|
-
};
|
|
6125
|
-
var HarmonicThemeContext = /*#__PURE__*/React__default.createContext(DEFAULT_THEME);
|
|
6126
|
-
var useHarmonicTheme = function useHarmonicTheme() {
|
|
6127
|
-
return React__default.useContext(HarmonicThemeContext);
|
|
6128
|
-
};
|
|
6129
|
-
var HarmonicThemeProvider = function HarmonicThemeProvider(_ref) {
|
|
6130
|
-
var _ref$theme = _ref.theme,
|
|
6131
|
-
theme = _ref$theme === void 0 ? DEFAULT_THEME : _ref$theme,
|
|
6132
|
-
children = _ref.children;
|
|
6133
|
-
var themeClass = getThemeClass(theme);
|
|
6134
|
-
// Convert children to an array (assuming they accept a className prop)
|
|
6135
|
-
var childrenArray = React__default.Children.toArray(children);
|
|
6136
|
-
var themedChildren = childrenArray.map(function (child) {
|
|
6137
|
-
return /*#__PURE__*/React__default.cloneElement(child, {
|
|
6138
|
-
className: ((child.props.className || '') + " " + themeClass).trim()
|
|
6139
|
-
});
|
|
6140
|
-
});
|
|
6141
|
-
return /*#__PURE__*/React__default.createElement(HarmonicThemeContext.Provider, {
|
|
6142
|
-
value: theme
|
|
6143
|
-
}, themedChildren.length === 1 ? themedChildren[0] : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, themedChildren));
|
|
6144
|
-
};
|
|
6219
|
+
var ArrowWrapper = /*#__PURE__*/styled.div(_templateObject6$9 || (_templateObject6$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 24px;\n height: 24px;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: flex-center;\n\n :hover {\n && svg path {\n fill: var(--base-color-primary);\n }\n }\n"])));
|
|
6145
6220
|
|
|
6146
6221
|
var _excluded$e = ["id", "text"];
|
|
6147
6222
|
var AnchorTabBar = function AnchorTabBar(_ref) {
|
|
@@ -6150,12 +6225,7 @@ var AnchorTabBar = function AnchorTabBar(_ref) {
|
|
|
6150
6225
|
activeTab = _ref.activeTab,
|
|
6151
6226
|
absolutePositionParams = _ref.absolutePositionParams,
|
|
6152
6227
|
_ref$bottomBorder = _ref.bottomBorder,
|
|
6153
|
-
bottomBorder = _ref$bottomBorder === void 0 ? false : _ref$bottomBorder
|
|
6154
|
-
_ref$withShadow = _ref.withShadow,
|
|
6155
|
-
withShadow = _ref$withShadow === void 0 ? false : _ref$withShadow,
|
|
6156
|
-
_ref$offsetHeight = _ref.offsetHeight,
|
|
6157
|
-
offsetHeight = _ref$offsetHeight === void 0 ? 0 : _ref$offsetHeight,
|
|
6158
|
-
className = _ref.className;
|
|
6228
|
+
bottomBorder = _ref$bottomBorder === void 0 ? false : _ref$bottomBorder;
|
|
6159
6229
|
var tabListRef = useRef(null);
|
|
6160
6230
|
var wrapperRef = useRef(null);
|
|
6161
6231
|
var _useState = useState(activeTab || ''),
|
|
@@ -6175,27 +6245,12 @@ var AnchorTabBar = function AnchorTabBar(_ref) {
|
|
|
6175
6245
|
var isSelectedItem = function isSelectedItem(id) {
|
|
6176
6246
|
return id === selectedItem;
|
|
6177
6247
|
};
|
|
6178
|
-
var
|
|
6179
|
-
e.preventDefault();
|
|
6248
|
+
var onClicktab = function onClicktab(e, id) {
|
|
6180
6249
|
if (onTabClick) {
|
|
6181
6250
|
onTabClick(e, id);
|
|
6182
6251
|
}
|
|
6183
6252
|
setSelectedItem(id);
|
|
6184
6253
|
};
|
|
6185
|
-
useEffect(function () {
|
|
6186
|
-
if (!selectedItem) return;
|
|
6187
|
-
var targetSectionElement = document.getElementById(selectedItem);
|
|
6188
|
-
if (targetSectionElement) {
|
|
6189
|
-
var sectionTop = targetSectionElement.getBoundingClientRect().top;
|
|
6190
|
-
var scrollPosition = window.scrollY + sectionTop - offsetHeight;
|
|
6191
|
-
// Instant scroll
|
|
6192
|
-
window.scrollTo(0, scrollPosition);
|
|
6193
|
-
}
|
|
6194
|
-
var clickedTab = document.getElementById("tablink-" + selectedItem);
|
|
6195
|
-
if (clickedTab) {
|
|
6196
|
-
clickedTab.focus();
|
|
6197
|
-
}
|
|
6198
|
-
}, [selectedItem, offsetHeight]);
|
|
6199
6254
|
var getScrollWidth = function getScrollWidth() {
|
|
6200
6255
|
var width = 0;
|
|
6201
6256
|
var selectedItemIndex = tabs.findIndex(function (el) {
|
|
@@ -6252,19 +6307,11 @@ var AnchorTabBar = function AnchorTabBar(_ref) {
|
|
|
6252
6307
|
}, 500);
|
|
6253
6308
|
}, []);
|
|
6254
6309
|
useEffect(function () {
|
|
6255
|
-
|
|
6256
|
-
var
|
|
6257
|
-
|
|
6258
|
-
|
|
6259
|
-
|
|
6260
|
-
setCanScrollToRight(tabsIsOverflowed);
|
|
6261
|
-
};
|
|
6262
|
-
window.addEventListener('resize', handleResize);
|
|
6263
|
-
handleResize(); // Initial check
|
|
6264
|
-
return function () {
|
|
6265
|
-
window.removeEventListener('resize', handleResize);
|
|
6266
|
-
};
|
|
6267
|
-
}, []);
|
|
6310
|
+
var _tabListRef$current, _tabListRef$current2;
|
|
6311
|
+
var tabsIsOverflowed = (((_tabListRef$current = tabListRef.current) == null ? void 0 : _tabListRef$current.scrollWidth) || 0) > (((_tabListRef$current2 = tabListRef.current) == null ? void 0 : _tabListRef$current2.clientWidth) || 0);
|
|
6312
|
+
setTabsOverflow(tabsIsOverflowed);
|
|
6313
|
+
setCanScrollToRight(tabsIsOverflowed);
|
|
6314
|
+
}, [tabListRef]);
|
|
6268
6315
|
useEffect(function () {
|
|
6269
6316
|
var scrollTriggerCheck = function scrollTriggerCheck() {
|
|
6270
6317
|
var elementGap = 100;
|
|
@@ -6345,13 +6392,10 @@ var AnchorTabBar = function AnchorTabBar(_ref) {
|
|
|
6345
6392
|
setCanScrollToLeft(scrollLeft > LIST_ITEM_GAP);
|
|
6346
6393
|
setCanScrollToRight(scrollLeft + clientWidth + LIST_ITEM_GAP < scrollWidth);
|
|
6347
6394
|
};
|
|
6348
|
-
var theme = useHarmonicTheme();
|
|
6349
6395
|
return /*#__PURE__*/React__default.createElement(AnchorTabbarWrapper, {
|
|
6350
6396
|
bottomBorder: bottomBorder,
|
|
6351
|
-
withShadow: withShadow,
|
|
6352
6397
|
ref: wrapperRef,
|
|
6353
|
-
id: "AnchorTabbarWrapper"
|
|
6354
|
-
className: className
|
|
6398
|
+
id: "AnchorTabbarWrapper"
|
|
6355
6399
|
}, /*#__PURE__*/React__default.createElement(TabsGrid, null, /*#__PURE__*/React__default.createElement(GridItem, {
|
|
6356
6400
|
columnStartDesktop: tabsColumnStart,
|
|
6357
6401
|
columnSpanDesktop: tabsColumnSpan,
|
|
@@ -6375,32 +6419,25 @@ var AnchorTabBar = function AnchorTabBar(_ref) {
|
|
|
6375
6419
|
className: "anchor-tab-bar-tablink",
|
|
6376
6420
|
id: "tablink-" + id,
|
|
6377
6421
|
onClick: function onClick(e) {
|
|
6378
|
-
return
|
|
6422
|
+
return onClicktab(e, id);
|
|
6379
6423
|
},
|
|
6380
|
-
tabIndex: 0
|
|
6381
|
-
hoverColor: theme === ThemeType.Core ? ThemeColor['primary-red'] : ThemeColor['primary-black']
|
|
6424
|
+
tabIndex: 0
|
|
6382
6425
|
}, rest), text));
|
|
6383
6426
|
})), tabsOverflow ? (/*#__PURE__*/React__default.createElement(ArrowsContainer, {
|
|
6384
|
-
|
|
6385
|
-
}, /*#__PURE__*/React__default.createElement(ArrowWrapper, {
|
|
6386
|
-
onClick: scrollToLeft
|
|
6387
|
-
disabled: !canScrollToLeft,
|
|
6388
|
-
"aria-label": "Previous section",
|
|
6389
|
-
role: "button"
|
|
6427
|
+
fullWidth: hasTwoArrows
|
|
6428
|
+
}, canScrollToLeft ? (/*#__PURE__*/React__default.createElement(ArrowWrapper, {
|
|
6429
|
+
onClick: scrollToLeft
|
|
6390
6430
|
}, /*#__PURE__*/React__default.createElement(Icon, {
|
|
6391
6431
|
iconName: "Arrow",
|
|
6392
6432
|
direction: "reverse"
|
|
6393
|
-
})), /*#__PURE__*/React__default.createElement(ArrowWrapper, {
|
|
6394
|
-
onClick: scrollToRight
|
|
6395
|
-
disabled: !canScrollToRight,
|
|
6396
|
-
"aria-label": "Next section",
|
|
6397
|
-
role: "button"
|
|
6433
|
+
}))) : null, canScrollToRight ? (/*#__PURE__*/React__default.createElement(ArrowWrapper, {
|
|
6434
|
+
onClick: scrollToRight
|
|
6398
6435
|
}, /*#__PURE__*/React__default.createElement(Icon, {
|
|
6399
6436
|
iconName: "Arrow"
|
|
6400
|
-
})))) : null))));
|
|
6437
|
+
}))) : null)) : null))));
|
|
6401
6438
|
};
|
|
6402
6439
|
|
|
6403
|
-
var _templateObject$G, _templateObject2$v, _templateObject3$l, _templateObject4$h, _templateObject6$
|
|
6440
|
+
var _templateObject$G, _templateObject2$v, _templateObject3$l, _templateObject4$h, _templateObject6$a, _templateObject7$6, _templateObject8$3, _templateObject9$2, _templateObject0$2;
|
|
6404
6441
|
var TitleCTAGridWrapper = /*#__PURE__*/styled.div(_templateObject$G || (_templateObject$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: ", ";\n top: -1px;\n background-color: var(--base-color-white);\n z-index: ", ";\n"])), function (_ref) {
|
|
6405
6442
|
var sticky = _ref.sticky;
|
|
6406
6443
|
return sticky ? 'sticky' : 'initial';
|
|
@@ -6411,9 +6448,9 @@ var TitleCTAGridItem = /*#__PURE__*/styled.div(_templateObject3$l || (_templateO
|
|
|
6411
6448
|
return title ? 'row' : 'row-reverse';
|
|
6412
6449
|
}, devices.tablet, devices.mobile);
|
|
6413
6450
|
var AnchorTitle = /*#__PURE__*/styled.div(_templateObject4$h || (_templateObject4$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n min-height: var(--button-height);\n\n h5 {\n padding: 0;\n margin: 0;\n }\n\n @media ", " {\n & {\n min-height: 50px;\n }\n }\n"])), devices.mobile);
|
|
6414
|
-
var ButtonsDesktopWrapper = /*#__PURE__*/styled.div(_templateObject6$
|
|
6451
|
+
var ButtonsDesktopWrapper = /*#__PURE__*/styled.div(_templateObject6$a || (_templateObject6$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: flex-end;\n\n @media ", " {\n display: none;\n }\n\n a {\n width: max-content;\n }\n"])), devices.mobile);
|
|
6415
6452
|
var ButtonsMobileWrapper = /*#__PURE__*/styled.div(_templateObject7$6 || (_templateObject7$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n\n @media ", " {\n & {\n display: block;\n }\n }\n"])), devices.mobile);
|
|
6416
|
-
var PrimaryButtonReverse = /*#__PURE__*/styled(PrimaryButton)(_templateObject8$
|
|
6453
|
+
var PrimaryButtonReverse = /*#__PURE__*/styled(PrimaryButton)(_templateObject8$3 || (_templateObject8$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n svg path {\n fill: ", ";\n }\n }\n"])), function (_ref3) {
|
|
6417
6454
|
var theme = _ref3.theme;
|
|
6418
6455
|
return theme.colors.primaryButtonReverseBg;
|
|
6419
6456
|
}, function (_ref4) {
|
|
@@ -6426,8 +6463,8 @@ var PrimaryButtonReverse = /*#__PURE__*/styled(PrimaryButton)(_templateObject8$4
|
|
|
6426
6463
|
var theme = _ref6.theme;
|
|
6427
6464
|
return theme.colors.primaryButtonReverse;
|
|
6428
6465
|
});
|
|
6429
|
-
var MessageWrapper = /*#__PURE__*/styled.div(_templateObject9$
|
|
6430
|
-
var MessageWrapperMobile = /*#__PURE__*/styled.div(_templateObject0$
|
|
6466
|
+
var MessageWrapper = /*#__PURE__*/styled.div(_templateObject9$2 || (_templateObject9$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n margin-right: var(--grid-outer-margin);\n height: var(--button-height);\n\n h6 {\n margin: 0;\n padding: 0;\n }\n\n @media ", " {\n & {\n margin-right: var(--grid-margin);\n }\n }\n\n @media ", " {\n & {\n display: none;\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
6467
|
+
var MessageWrapperMobile = /*#__PURE__*/styled.div(_templateObject0$2 || (_templateObject0$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h6 {\n margin: 0;\n padding: 0;\n }\n display: none;\n\n @media ", " {\n & {\n display: flex;\n align-items: center;\n margin-left: var(--grid-margin);\n padding: 12px 0;\n }\n }\n"])), devices.mobile);
|
|
6431
6468
|
|
|
6432
6469
|
var _excluded$f = ["text"],
|
|
6433
6470
|
_excluded2$1 = ["text"];
|
|
@@ -7029,12 +7066,12 @@ var Theme = function Theme(_ref) {
|
|
|
7029
7066
|
};
|
|
7030
7067
|
|
|
7031
7068
|
var _templateObject$I;
|
|
7032
|
-
var TextContainer$1 = /*#__PURE__*/styled.div(_templateObject$I || (_templateObject$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n
|
|
7069
|
+
var TextContainer$1 = /*#__PURE__*/styled.div(_templateObject$I || (_templateObject$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n\n & h1,\n h2,\n h3,\n h4 {\n font-size: var(--font-size-header-4);\n font-family: var(--font-family-header);\n font-feature-settings: var(--font-feature-settings-header);\n font-weight: var(--font-weight-header-4);\n letter-spacing: var(--letter-spacing-header-4);\n line-height: var(--line-height-header-4);\n text-transform: var(--text-transform-header);\n white-space: break-spaces;\n overflow-wrap: break-word;\n margin: 80px 0 16px;\n\n @media ", " {\n margin-top: 60px;\n }\n\n + p {\n margin-top: 0px;\n }\n }\n\n & h5,\n h6 {\n font-size: var(--font-size-subtitle-1);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n white-space: break-spaces;\n overflow-wrap: break-word;\n margin: 80px 0 16px;\n\n @media ", " {\n margin-top: 60px;\n }\n\n + p {\n margin-top: 10px;\n }\n }\n\n & a {\n color: ", ";\n text-decoration: underline;\n cursor: pointer;\n }\n\n p {\n margin: 30px 0;\n }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & strong {\n font-weight: bold;\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n\n & ul {\n padding: 0;\n list-style: none;\n margin: 0 0 0 30px;\n\n li {\n text-indent: -20px;\n line-height: var(--line-height-listing);\n }\n }\n\n & ol {\n padding: 0;\n margin: 0 0 0 20px;\n\n li {\n line-height: var(--line-height-listing);\n }\n }\n\n & ul > li:before {\n display: inline-block;\n content: '\u2014';\n width: 0px;\n margin-left: 12px;\n margin-right: 8px;\n }\n"])), devices.mobileAndTablet, devices.mobileAndTablet, function (_ref) {
|
|
7070
|
+
var theme = _ref.theme;
|
|
7071
|
+
return theme.colors.primary;
|
|
7072
|
+
});
|
|
7033
7073
|
|
|
7034
|
-
var
|
|
7035
|
-
return html.replace(/<h1>/g, "<h1 class=\"" + typographyStyles.header + " " + typographyStyles['header--large'] + "\">").replace(/<h2>/g, "<h2 class=\"" + typographyStyles.header + " " + typographyStyles['header--large'] + "\">").replace(/<h3>/g, "<h3 class=\"" + typographyStyles.header + " " + typographyStyles['header--medium'] + "\">").replace(/<h4>/g, "<h4 class=\"" + typographyStyles.header + " " + typographyStyles['header--medium'] + "\">").replace(/<h5>/g, "<h5 class=\"" + typographyStyles.header + " " + typographyStyles['header--small'] + "\">").replace(/<h6>/g, "<h6 class=\"" + typographyStyles.header + " " + typographyStyles['header--small'] + "\">");
|
|
7036
|
-
};
|
|
7037
|
-
var BodyContent = function BodyContent(_ref) {
|
|
7074
|
+
var TextOnly = function TextOnly(_ref) {
|
|
7038
7075
|
var _ref$text = _ref.text,
|
|
7039
7076
|
text = _ref$text === void 0 ? '' : _ref$text,
|
|
7040
7077
|
_ref$columnStartDeskt = _ref.columnStartDesktop,
|
|
@@ -7044,25 +7081,36 @@ var BodyContent = function BodyContent(_ref) {
|
|
|
7044
7081
|
_ref$columnStartDevic = _ref.columnStartDevice,
|
|
7045
7082
|
columnStartDevice = _ref$columnStartDevic === void 0 ? 2 : _ref$columnStartDevic,
|
|
7046
7083
|
_ref$columnSpanDevice = _ref.columnSpanDevice,
|
|
7047
|
-
columnSpanDevice = _ref$columnSpanDevice === void 0 ? 12 : _ref$columnSpanDevice
|
|
7048
|
-
|
|
7049
|
-
return /*#__PURE__*/React__default.createElement(Grid, {
|
|
7050
|
-
className: className
|
|
7051
|
-
}, /*#__PURE__*/React__default.createElement(GridItem, {
|
|
7084
|
+
columnSpanDevice = _ref$columnSpanDevice === void 0 ? 12 : _ref$columnSpanDevice;
|
|
7085
|
+
return /*#__PURE__*/React__default.createElement(Grid, null, /*#__PURE__*/React__default.createElement(GridItem, {
|
|
7052
7086
|
columnStartDesktop: columnStartDesktop,
|
|
7053
7087
|
columnSpanDesktop: columnSpanDesktop,
|
|
7054
7088
|
columnStartDevice: columnStartDevice,
|
|
7055
7089
|
columnSpanDevice: columnSpanDevice
|
|
7056
7090
|
}, /*#__PURE__*/React__default.createElement(TextContainer$1, {
|
|
7057
|
-
"data-testid": "text-container",
|
|
7058
|
-
className: typographyStyles.bodycopy + " " + typographyStyles['bodycopy--large'],
|
|
7059
7091
|
dangerouslySetInnerHTML: {
|
|
7060
|
-
__html:
|
|
7092
|
+
__html: text
|
|
7061
7093
|
}
|
|
7062
7094
|
})));
|
|
7063
7095
|
};
|
|
7064
7096
|
|
|
7065
|
-
|
|
7097
|
+
/* eslint-disable no-shadow */
|
|
7098
|
+
var CarouselType;
|
|
7099
|
+
(function (CarouselType) {
|
|
7100
|
+
CarouselType["Image"] = "image";
|
|
7101
|
+
CarouselType["SmallCard"] = "SmallCard";
|
|
7102
|
+
CarouselType["LargeCard"] = "LargeCard";
|
|
7103
|
+
})(CarouselType || (CarouselType = {}));
|
|
7104
|
+
|
|
7105
|
+
// eslint-disable-next-line no-shadow
|
|
7106
|
+
var ButtonType;
|
|
7107
|
+
(function (ButtonType) {
|
|
7108
|
+
ButtonType["Primary"] = "Primary";
|
|
7109
|
+
ButtonType["Secondary"] = "Secondary";
|
|
7110
|
+
ButtonType["Tertiary"] = "Tertiary";
|
|
7111
|
+
})(ButtonType || (ButtonType = {}));
|
|
7112
|
+
|
|
7113
|
+
var _templateObject$J, _templateObject2$x, _templateObject3$n, _templateObject4$i, _templateObject5$d, _templateObject6$b, _templateObject7$7, _templateObject8$4;
|
|
7066
7114
|
var Wrapper$2 = /*#__PURE__*/styled.div(_templateObject$J || (_templateObject$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--base-color-lightgrey);\n padding: 40px;\n\n display: block;\n position: relative;\n\n @media ", " {\n margin-top: 0;\n padding: 40px 20px;\n }\n"])), devices.tablet);
|
|
7067
7115
|
var PromoLabelWrapper = /*#__PURE__*/styled.div(_templateObject2$x || (_templateObject2$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: flex-end;\n align-self: flex-end;\n height: 15px;\n"])));
|
|
7068
7116
|
var PromoLabel = /*#__PURE__*/styled.div(_templateObject3$n || (_templateObject3$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background: ", ";\n color: ", ";\n padding: 6px 8px;\n width: fit-content;\n display: flex;\n justify-content: center;\n align-items: center;\n position: absolute;\n right: 20px;\n top: 0;\n width: auto;\n margin: auto;\n font-family: var(--font-family-header);\n font-feature-settings:\n 'tnum' on,\n 'lnum' on,\n 'liga' off,\n 'calt' off;\n font-size: var(--font-size-overline-2);\n line-height: 12px;\n text-align: center;\n letter-spacing: 1px;\n text-transform: uppercase;\n"])), function (_ref) {
|
|
@@ -7077,9 +7125,9 @@ var ButtonContainer = /*#__PURE__*/styled.div(_templateObject4$i || (_templateOb
|
|
|
7077
7125
|
return stackCtasEarly && "\n @media " + devices.smallDesktop + ", " + devices.mobileAndTablet + " {\n * {\n width: 100%;\n }\n }\n ";
|
|
7078
7126
|
});
|
|
7079
7127
|
var TitleContainer$2 = /*#__PURE__*/styled.div(_templateObject5$d || (_templateObject5$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n & > * {\n margin-top: 0;\n margin-bottom: 0.5em;\n }\n"])));
|
|
7080
|
-
var OfferTextWrapper = /*#__PURE__*/styled.div(_templateObject6$
|
|
7128
|
+
var OfferTextWrapper = /*#__PURE__*/styled.div(_templateObject6$b || (_templateObject6$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n & > * {\n margin-bottom: 0.5em;\n }\n margin-bottom: 1em;\n"])));
|
|
7081
7129
|
var PriceRow = /*#__PURE__*/styled.div(_templateObject7$7 || (_templateObject7$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-wrap: wrap;\n gap: 6px 12px;\n padding: 5px 0 8px 0;\n"])));
|
|
7082
|
-
var LineThrough = /*#__PURE__*/styled.div(_templateObject8$
|
|
7130
|
+
var LineThrough = /*#__PURE__*/styled.div(_templateObject8$4 || (_templateObject8$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-decoration-line: line-through;\n color: var(--base-color-darkgrey);\n"])));
|
|
7083
7131
|
|
|
7084
7132
|
// Set max. character length
|
|
7085
7133
|
var setMaxCharLength = function setMaxCharLength(value, maxLength) {
|
|
@@ -7207,7 +7255,7 @@ var UpsellSection = function UpsellSection(_ref) {
|
|
|
7207
7255
|
columnSpanSmallDevice: 14
|
|
7208
7256
|
}, /*#__PURE__*/React__default.createElement(UpsellBorderBox, null, /*#__PURE__*/React__default.createElement(TitleContainer$1, null, /*#__PURE__*/React__default.createElement(AltHeader, {
|
|
7209
7257
|
level: 4
|
|
7210
|
-
}, title)), /*#__PURE__*/React__default.createElement(TextContainer, null, /*#__PURE__*/React__default.createElement(
|
|
7258
|
+
}, title)), /*#__PURE__*/React__default.createElement(TextContainer, null, /*#__PURE__*/React__default.createElement(TextOnly, {
|
|
7211
7259
|
text: richText != null ? richText : '',
|
|
7212
7260
|
columnStartDesktop: 1,
|
|
7213
7261
|
columnSpanDesktop: 14,
|
|
@@ -7221,10 +7269,10 @@ var UpsellSection = function UpsellSection(_ref) {
|
|
|
7221
7269
|
};
|
|
7222
7270
|
|
|
7223
7271
|
var _templateObject$L, _templateObject2$y;
|
|
7224
|
-
var StickyBarWrapper = /*#__PURE__*/styled.div(_templateObject$L || (_templateObject$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n top: 0;\n position: sticky;\n z-index: ", ";\n background-color: var(--color-
|
|
7272
|
+
var StickyBarWrapper = /*#__PURE__*/styled.div(_templateObject$L || (_templateObject$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n top: 0;\n position: sticky;\n z-index: ", ";\n background-color: var(--base-color-white);\n"])), zIndexes.anchor);
|
|
7225
7273
|
var StickyBarGrid = /*#__PURE__*/styled(Grid)(_templateObject2$y || (_templateObject2$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n padding: 28px 0 26px;\n\n @media ", " {\n padding: 24px 0 28px;\n }\n\n @media ", " {\n border-bottom: none;\n }\n"])), function (_ref) {
|
|
7226
|
-
var
|
|
7227
|
-
return
|
|
7274
|
+
var hideBottomBorder = _ref.hideBottomBorder;
|
|
7275
|
+
return !hideBottomBorder && 'border-bottom: 2px solid var(--base-color-light-grey);';
|
|
7228
7276
|
}, devices.mobileAndTablet, devices.mobile);
|
|
7229
7277
|
|
|
7230
7278
|
var StickyBar = function StickyBar(_ref) {
|
|
@@ -7236,15 +7284,12 @@ var StickyBar = function StickyBar(_ref) {
|
|
|
7236
7284
|
columnStartDevice = _ref$columnStartDevic === void 0 ? 2 : _ref$columnStartDevic,
|
|
7237
7285
|
_ref$columnSpanDevice = _ref.columnSpanDevice,
|
|
7238
7286
|
columnSpanDevice = _ref$columnSpanDevice === void 0 ? 12 : _ref$columnSpanDevice,
|
|
7239
|
-
|
|
7240
|
-
|
|
7241
|
-
children = _ref.children,
|
|
7242
|
-
className = _ref.className;
|
|
7287
|
+
hideBottomBorder = _ref.hideBottomBorder,
|
|
7288
|
+
children = _ref.children;
|
|
7243
7289
|
return /*#__PURE__*/React__default.createElement(StickyBarWrapper, {
|
|
7244
|
-
"data-testid": "sticky-bar-block"
|
|
7245
|
-
className: className
|
|
7290
|
+
"data-testid": "sticky-bar-block"
|
|
7246
7291
|
}, /*#__PURE__*/React__default.createElement(StickyBarGrid, {
|
|
7247
|
-
|
|
7292
|
+
hideBottomBorder: hideBottomBorder != null ? hideBottomBorder : false
|
|
7248
7293
|
}, /*#__PURE__*/React__default.createElement(GridItem, {
|
|
7249
7294
|
columnStartDesktop: columnStartDesktop,
|
|
7250
7295
|
columnSpanDesktop: columnSpanDesktop,
|
|
@@ -7434,7 +7479,7 @@ var getImageSlideStyles = function getImageSlideStyles(imageHeight) {
|
|
|
7434
7479
|
return "height: calc(" + imageHeight + "px + var(--carousel-image-caption-height) + 12px);";
|
|
7435
7480
|
};
|
|
7436
7481
|
|
|
7437
|
-
var _templateObject$N, _templateObject2$A, _templateObject3$p, _templateObject4$k, _templateObject5$e, _templateObject6$
|
|
7482
|
+
var _templateObject$N, _templateObject2$A, _templateObject3$p, _templateObject4$k, _templateObject5$e, _templateObject6$c, _templateObject7$8, _templateObject8$5;
|
|
7438
7483
|
var ImageCarouselWrapper = /*#__PURE__*/styled.div(_templateObject$N || (_templateObject$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n\n @media ", " {\n ", "\n }}\n"])), function (_ref) {
|
|
7439
7484
|
var imagesHeightDesktop = _ref.imagesHeightDesktop;
|
|
7440
7485
|
return "& {\n .swipe-slide {\n height: fit-content;\n width: auto;\n margin-right: var(--grid-column-gap);\n\n > figure {\n margin: 0px;\n " + getImageSlideStyles(imagesHeightDesktop) + "\n }\n }\n }";
|
|
@@ -7453,9 +7498,9 @@ var TitleWrapper$1 = /*#__PURE__*/styled.div(_templateObject5$e || (_templateObj
|
|
|
7453
7498
|
var isDescriptionPresent = _ref4.isDescriptionPresent;
|
|
7454
7499
|
return isDescriptionPresent && 'margin: 20px 0';
|
|
7455
7500
|
});
|
|
7456
|
-
var ButtonsWrapper = /*#__PURE__*/styled.div(_templateObject6$
|
|
7501
|
+
var ButtonsWrapper = /*#__PURE__*/styled.div(_templateObject6$c || (_templateObject6$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: flex-end;\n align-items: start;\n\n @media ", " {\n display: none;\n }\n"])), devices.mobile);
|
|
7457
7502
|
var TitleGridItem = /*#__PURE__*/styled(GridItem)(_templateObject7$8 || (_templateObject7$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n grid-column: 2 / span 10;\n }\n"])), devices.tablet);
|
|
7458
|
-
var SwipeGridWrapper = /*#__PURE__*/styled(GridItem)(_templateObject8$
|
|
7503
|
+
var SwipeGridWrapper = /*#__PURE__*/styled(GridItem)(_templateObject8$5 || (_templateObject8$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", ";\n\n @media ", " {\n grid-column: ", ";\n }\n\n @media ", " {\n grid-column: 2 / span 13;\n }\n"])), function (_ref5) {
|
|
7459
7504
|
var active = _ref5.active;
|
|
7460
7505
|
return active ? 'grid-column: 1 / span 16' : '';
|
|
7461
7506
|
}, devices.tablet, function (_ref6) {
|
|
@@ -7910,17 +7955,17 @@ var Carousel = function Carousel(_ref) {
|
|
|
7910
7955
|
}, children))));
|
|
7911
7956
|
};
|
|
7912
7957
|
|
|
7913
|
-
var _templateObject$P, _templateObject2$C, _templateObject3$q, _templateObject4$l, _templateObject5$f, _templateObject6$
|
|
7958
|
+
var _templateObject$P, _templateObject2$C, _templateObject3$q, _templateObject4$l, _templateObject5$f, _templateObject6$d, _templateObject7$9, _templateObject8$6, _templateObject9$3, _templateObject0$3, _templateObject1$1, _templateObject10$1, _templateObject11$1, _templateObject12$1, _templateObject13$1, _templateObject14, _templateObject15;
|
|
7914
7959
|
var HighlightsGrid = /*#__PURE__*/styled(Grid)(_templateObject$P || (_templateObject$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n grid-template-rows: max-content minmax(0, 1fr);\n gap: 0 var(--grid-column-gap);\n background-color: var(--color-base-black);\n user-select: none;\n\n .highlight-carousel-text {\n color: var(--color-base-white);\n }\n\n @media ", " {\n & {\n grid-template-rows: min-content max-content max-content;\n }\n }\n"])), devices.mobile);
|
|
7915
7960
|
var CarouselTitleWrapper = /*#__PURE__*/styled.div(_templateObject2$C || (_templateObject2$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 1 / 1 / 1 / 7;\n box-sizing: border-box;\n width: calc(100% + var(--grid-column-gap));\n padding-top: 40px;\n padding-left: 50px;\n padding-right: 36px;\n user-select: text;\n\n @media ", " {\n & {\n grid-area: 1 / 1 / 2 / 12;\n padding: 12px 0 12px var(--grid-margin);\n min-height: 64px;\n box-sizing: border-box;\n width: 100%;\n }\n }\n\n @media ", " {\n & {\n grid-area: 1 / 1 / 2 / 11;\n width: 100%;\n padding: 8px 0 8px 20px;\n min-height: 28px;\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
7916
7961
|
var HeaderWrapper = /*#__PURE__*/styled.div(_templateObject3$q || (_templateObject3$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n padding: 0;\n"])));
|
|
7917
7962
|
var InfoWrapper = /*#__PURE__*/styled.div(_templateObject4$l || (_templateObject4$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 2 / 1 / 2 / 7;\n box-sizing: border-box;\n width: calc(100% + var(--grid-column-gap));\n align-self: center;\n padding: 36px 36px 36px 50px;\n\n @media ", " {\n & {\n grid-area: 2 / 1 / 2 / 7;\n padding: 0 12px 12px var(--grid-margin);\n }\n }\n\n @media ", " {\n & {\n grid-area: 3 / 1 / 4 / 15;\n width: 100%;\n padding: 0 20px;\n margin: 24px 0;\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
7918
7963
|
var InfoLogoWrapper = /*#__PURE__*/styled.div(_templateObject5$f || (_templateObject5$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 32px;\n width: 132px;\n height: 36px;\n\n @media ", " {\n & {\n margin-bottom: 16px;\n width: 102px;\n height: 28px;\n }\n }\n\n @media ", " {\n & {\n margin-bottom: 20px;\n width: 102px;\n height: 28px;\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
7919
|
-
var InfoTitleWrapper = /*#__PURE__*/styled.div(_templateObject6$
|
|
7964
|
+
var InfoTitleWrapper = /*#__PURE__*/styled.div(_templateObject6$d || (_templateObject6$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n user-select: text;\n\n h1,\n h2,\n h3 {\n margin-bottom: 8px;\n }\n"])));
|
|
7920
7965
|
var InfoTextWrapper = /*#__PURE__*/styled.div(_templateObject7$9 || (_templateObject7$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 24px;\n user-select: text;\n\n @media ", " {\n & {\n margin-top: 20px;\n }\n }\n"])), devices.mobileAndTablet);
|
|
7921
|
-
var InfoLinkWrapper = /*#__PURE__*/styled.div(_templateObject8$
|
|
7922
|
-
var CarouselWrapper = /*#__PURE__*/styled.div(_templateObject9$
|
|
7923
|
-
var RotatorButtonsWrapper = /*#__PURE__*/styled.div(_templateObject0$
|
|
7966
|
+
var InfoLinkWrapper = /*#__PURE__*/styled.div(_templateObject8$6 || (_templateObject8$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 32px;\n display: flex;\n flex-direction: row;\n\n @media ", " {\n & {\n margin-top: 16px;\n }\n }\n\n @media ", " {\n & {\n margin-top: 20px;\n }\n display: flex;\n flex-direction: column;\n }\n"])), devices.tablet, devices.mobile);
|
|
7967
|
+
var CarouselWrapper = /*#__PURE__*/styled.div(_templateObject9$3 || (_templateObject9$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 1 / 7 / 3 / 17;\n position: relative;\n height: 100%;\n width: 100%;\n\n .swipe-slide {\n width: calc(100% - 50px - var(--rotator-button-width));\n -webkit-transform: translate3d(0, 0, 0);\n }\n\n @media ", " {\n & {\n grid-area: 2 / 7 / 3 / 15;\n\n .swipe-slide {\n width: 100%;\n -webkit-transform: translate3d(0, 0, 0);\n }\n }\n }\n\n @media ", " {\n & {\n grid-area: 2 / 1 / 3 / 15;\n\n .swipe-slide {\n width: 100%;\n -webkit-transform: translate3d(0, 0, 0);\n }\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
7968
|
+
var RotatorButtonsWrapper = /*#__PURE__*/styled.div(_templateObject0$3 || (_templateObject0$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n right: 50px;\n top: calc(50% - calc(var(--rotator-button-width) / 2));\n z-index: 2;\n\n @media ", " {\n & {\n display: none;\n }\n }\n"])), devices.mobileAndTablet);
|
|
7924
7969
|
var RotatorButtonsWrapperMobile = /*#__PURE__*/styled.div(_templateObject1$1 || (_templateObject1$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n\n @media ", " {\n div {\n background-color: var(--color-base-black);\n }\n svg path {\n fill: var(--color-base-white);\n }\n\n & {\n display: flex;\n grid-area: 1 / 12 / 2 / 14;\n align-self: center;\n justify-content: flex-end;\n }\n }\n\n @media ", " {\n div {\n background-color: var(--color-base-black);\n }\n svg path {\n fill: var(--color-base-white);\n }\n\n & {\n display: flex;\n grid-area: 1 / 11 / 2 / 14;\n align-self: center;\n justify-content: flex-end;\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
7925
7970
|
var HtmlBodyText = /*#__PURE__*/styled.p(_templateObject10$1 || (_templateObject10$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n"])));
|
|
7926
7971
|
var FirstButtonComponentWrapper = /*#__PURE__*/styled.div(_templateObject11$1 || (_templateObject11$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-right: 16px;\n\n @media ", " {\n & {\n display: flex;\n flex-direction: column;\n margin-right: 0;\n margin-bottom: 10px;\n }\n }\n"])), devices.mobile);
|
|
@@ -8092,7 +8137,7 @@ var InfoSection = function InfoSection(_ref) {
|
|
|
8092
8137
|
}, additionalInfo)))));
|
|
8093
8138
|
};
|
|
8094
8139
|
|
|
8095
|
-
var _templateObject$R, _templateObject2$D, _templateObject3$r, _templateObject4$m, _templateObject5$g, _templateObject6$
|
|
8140
|
+
var _templateObject$R, _templateObject2$D, _templateObject3$r, _templateObject4$m, _templateObject5$g, _templateObject6$e;
|
|
8096
8141
|
var AccordionContainer = /*#__PURE__*/styled.div(_templateObject$R || (_templateObject$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n div {\n overflow: hidden;\n }\n"])));
|
|
8097
8142
|
var LineContainer = /*#__PURE__*/styled.div(_templateObject2$D || (_templateObject2$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 2px;\n background-color: var(--base-color-light-grey);\n width: 100%;\n"])));
|
|
8098
8143
|
var ChildrenContainer = /*#__PURE__*/styled.div(_templateObject3$r || (_templateObject3$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0px 20px 28px 20px;\n\n visibility: ", ";\n\n @media ", " {\n margin: 12px 0px 24px 0px;\n }\n \n @media print { \n visibility: visible;\n }\n}\n"])), function (_ref) {
|
|
@@ -8104,7 +8149,7 @@ var ContentContainer = /*#__PURE__*/styled.div(_templateObject5$g || (_templateO
|
|
|
8104
8149
|
var textHeight = _ref2.textHeight;
|
|
8105
8150
|
return textHeight;
|
|
8106
8151
|
}, devices.mobile);
|
|
8107
|
-
var PrintHideWrapper = /*#__PURE__*/styled.div(_templateObject6$
|
|
8152
|
+
var PrintHideWrapper = /*#__PURE__*/styled.div(_templateObject6$e || (_templateObject6$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media print {\n display: none;\n }\n"])));
|
|
8108
8153
|
|
|
8109
8154
|
/* eslint-disable react/no-unstable-nested-components */
|
|
8110
8155
|
var Accordion = function Accordion(_ref) {
|
|
@@ -8314,7 +8359,7 @@ var AnnouncementBanner = function AnnouncementBanner(_ref) {
|
|
|
8314
8359
|
}))))));
|
|
8315
8360
|
};
|
|
8316
8361
|
|
|
8317
|
-
var _templateObject$U, _templateObject2$F, _templateObject3$t, _templateObject4$o, _templateObject5$i, _templateObject6$
|
|
8362
|
+
var _templateObject$U, _templateObject2$F, _templateObject3$t, _templateObject4$o, _templateObject5$i, _templateObject6$f, _templateObject7$a, _templateObject8$7, _templateObject9$4, _templateObject0$4, _templateObject1$2, _templateObject10$2, _templateObject11$2, _templateObject12$2;
|
|
8318
8363
|
var LENGTH_LARGE_TEXT = 28;
|
|
8319
8364
|
var LENGTH_SMALL_TEXT$1 = 19;
|
|
8320
8365
|
var LENGTH_TEXT_TABLET = 10;
|
|
@@ -8338,11 +8383,11 @@ var ContentContainer$2 = /*#__PURE__*/styled.div(_templateObject4$o || (_templat
|
|
|
8338
8383
|
return fullWidth ? '0' : '20px';
|
|
8339
8384
|
});
|
|
8340
8385
|
var TitleContainer$4 = /*#__PURE__*/styled.div(_templateObject5$i || (_templateObject5$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 12px 0;\n\n @media ", " {\n display: none;\n }\n"])), devices.mobile);
|
|
8341
|
-
var TitleContainerMobile = /*#__PURE__*/styled.div(_templateObject6$
|
|
8386
|
+
var TitleContainerMobile = /*#__PURE__*/styled.div(_templateObject6$f || (_templateObject6$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 12px 0;\n display: none;\n\n @media ", " {\n display: block;\n }\n"])), devices.mobile);
|
|
8342
8387
|
var TextContainer$2 = /*#__PURE__*/styled.div(_templateObject7$a || (_templateObject7$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n white-space: break-spaces;\n overflow-wrap: break-word;\n"])));
|
|
8343
|
-
var HighlightTextContainer = /*#__PURE__*/styled.div(_templateObject8$
|
|
8344
|
-
var SubtitleContainer = /*#__PURE__*/styled.span(_templateObject9$
|
|
8345
|
-
var LabelContainer = /*#__PURE__*/styled.div(_templateObject0$
|
|
8388
|
+
var HighlightTextContainer = /*#__PURE__*/styled.div(_templateObject8$7 || (_templateObject8$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 24px;\n"])));
|
|
8389
|
+
var SubtitleContainer = /*#__PURE__*/styled.span(_templateObject9$4 || (_templateObject9$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 4px;\n overflow-wrap: break-word;\n"])));
|
|
8390
|
+
var LabelContainer = /*#__PURE__*/styled.div(_templateObject0$4 || (_templateObject0$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n visibility: ", ";\n width: fit-content;\n height: 25px;\n\n @media ", " {\n margin-left: ", ";\n }\n"])), function (_ref6) {
|
|
8346
8391
|
var isVisible = _ref6.isVisible;
|
|
8347
8392
|
return isVisible ? "visible" : 'hidden';
|
|
8348
8393
|
}, devices.mobile, function (_ref7) {
|
|
@@ -8597,44 +8642,54 @@ var Cards = function Cards(_ref) {
|
|
|
8597
8642
|
}));
|
|
8598
8643
|
};
|
|
8599
8644
|
|
|
8600
|
-
var _templateObject$W, _templateObject2$H, _templateObject3$u, _templateObject4$p, _templateObject5$j
|
|
8601
|
-
var ContentWrapper$1 = /*#__PURE__*/styled.div(_templateObject$W || (_templateObject$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n grid-column: 2 / span 12;\n }\n"])), devices.mobileAndTablet);
|
|
8602
|
-
var Wrapper$4 = /*#__PURE__*/styled.div(_templateObject2$H || (_templateObject2$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n display: grid;\n grid-template-columns: var(--grid-template-columns);\n grid-template-rows: max-content;\n gap: var(--grid-column-gap);\n margin: 0;\n }\n"])),
|
|
8603
|
-
var
|
|
8604
|
-
|
|
8605
|
-
|
|
8606
|
-
var
|
|
8607
|
-
|
|
8645
|
+
var _templateObject$W, _templateObject2$H, _templateObject3$u, _templateObject4$p, _templateObject5$j;
|
|
8646
|
+
var ContentWrapper$1 = /*#__PURE__*/styled.div(_templateObject$W || (_templateObject$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n & > div {\n margin-bottom: 2px;\n\n &:first-child {\n margin-bottom: 4px;\n\n @media ", " {\n margin-bottom: 6px;\n }\n }\n }\n\n @media ", " {\n grid-column: 2 / span 12;\n }\n"])), devices.mobile, devices.mobileAndTablet);
|
|
8647
|
+
var Wrapper$4 = /*#__PURE__*/styled.div(_templateObject2$H || (_templateObject2$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n ", "\n padding: 30px 0;\n\n @media ", " {\n display: grid;\n grid-template-columns: var(--grid-template-columns);\n grid-template-rows: max-content;\n gap: var(--grid-column-gap);\n margin: 0;\n }\n"])), function (_ref) {
|
|
8648
|
+
var hideBottomBorder = _ref.hideBottomBorder;
|
|
8649
|
+
return "border-bottom: " + (hideBottomBorder ? 'none' : '2px solid var(--base-color-mid-grey)') + ";";
|
|
8650
|
+
}, function (_ref2) {
|
|
8651
|
+
var hideTopBorder = _ref2.hideTopBorder;
|
|
8652
|
+
return "border-top: " + (hideTopBorder ? 'none' : '2px solid var(--base-color-mid-grey)') + ";";
|
|
8653
|
+
}, devices.mobileAndTablet);
|
|
8654
|
+
var AddressWrapperDesktop = /*#__PURE__*/styled.div(_templateObject3$u || (_templateObject3$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n display: none;\n }\n"])), devices.mobile);
|
|
8655
|
+
var AddressWrapperMobile = /*#__PURE__*/styled.div(_templateObject4$p || (_templateObject4$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n\n & > div {\n margin-bottom: 2px;\n }\n\n @media ", " {\n display: block;\n }\n"])), devices.mobile);
|
|
8656
|
+
var DetailsWrapper = /*#__PURE__*/styled.div(_templateObject5$j || (_templateObject5$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n\n @media ", " {\n flex-direction: column;\n margin: 4px 0;\n }\n\n a {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n color: var(--base-color-black);\n text-decoration: underline;\n\n &:before {\n display: inline-block;\n content: '';\n background-color: var(--base-color-black);\n width: 1px;\n height: 18px;\n margin: 0 8px -4px;\n\n @media ", " {\n display: none;\n }\n }\n\n &:first-child:before {\n display: none;\n }\n }\n"])), devices.mobile, devices.mobile);
|
|
8608
8657
|
|
|
8658
|
+
var divideAddressString = function divideAddressString(address) {
|
|
8659
|
+
return address.split(',').map(function (chunk, i) {
|
|
8660
|
+
return /*#__PURE__*/React__default.createElement(BodyText, {
|
|
8661
|
+
level: 1,
|
|
8662
|
+
key: i
|
|
8663
|
+
}, chunk.trim());
|
|
8664
|
+
});
|
|
8665
|
+
};
|
|
8609
8666
|
var ContactCard = function ContactCard(_ref) {
|
|
8610
|
-
var
|
|
8611
|
-
titleSuffix = _ref.titleSuffix,
|
|
8667
|
+
var name = _ref.name,
|
|
8612
8668
|
description = _ref.description,
|
|
8613
8669
|
email = _ref.email,
|
|
8614
8670
|
phone = _ref.phone,
|
|
8615
8671
|
website = _ref.website,
|
|
8616
8672
|
address = _ref.address,
|
|
8617
|
-
|
|
8673
|
+
_ref$hideBottomBorder = _ref.hideBottomBorder,
|
|
8674
|
+
hideBottomBorder = _ref$hideBottomBorder === void 0 ? false : _ref$hideBottomBorder,
|
|
8675
|
+
_ref$hideTopBorder = _ref.hideTopBorder,
|
|
8676
|
+
hideTopBorder = _ref$hideTopBorder === void 0 ? false : _ref$hideTopBorder;
|
|
8618
8677
|
var hasDetails = email || phone || website;
|
|
8619
8678
|
var addressString = address == null ? void 0 : address.substring(0, 110);
|
|
8620
8679
|
var descriptionText = description == null ? void 0 : description.substring(0, 110);
|
|
8621
|
-
return /*#__PURE__*/React__default.createElement(
|
|
8622
|
-
className: className
|
|
8623
|
-
}, /*#__PURE__*/React__default.createElement(Grid, null, /*#__PURE__*/React__default.createElement(GridItem, {
|
|
8680
|
+
return /*#__PURE__*/React__default.createElement(Grid, null, /*#__PURE__*/React__default.createElement(GridItem, {
|
|
8624
8681
|
columnStartDesktop: 3,
|
|
8625
|
-
columnSpanDesktop:
|
|
8682
|
+
columnSpanDesktop: 8,
|
|
8626
8683
|
columnStartDevice: 1,
|
|
8627
8684
|
columnSpanDevice: 14
|
|
8628
8685
|
}, /*#__PURE__*/React__default.createElement(Wrapper$4, {
|
|
8629
|
-
"data-testid": "contact-card-wrapper"
|
|
8630
|
-
|
|
8631
|
-
|
|
8632
|
-
},
|
|
8633
|
-
|
|
8634
|
-
},
|
|
8635
|
-
|
|
8636
|
-
}, titleSuffix))), descriptionText && /*#__PURE__*/React__default.createElement(HarmonicSubtitle, {
|
|
8637
|
-
size: "large"
|
|
8686
|
+
"data-testid": "contact-card-wrapper",
|
|
8687
|
+
hideBottomBorder: hideBottomBorder,
|
|
8688
|
+
hideTopBorder: hideTopBorder
|
|
8689
|
+
}, /*#__PURE__*/React__default.createElement(ContentWrapper$1, null, /*#__PURE__*/React__default.createElement(BodyText, {
|
|
8690
|
+
level: 1
|
|
8691
|
+
}, name), descriptionText && /*#__PURE__*/React__default.createElement(Subtitle, {
|
|
8692
|
+
level: 2
|
|
8638
8693
|
}, descriptionText), hasDetails && (/*#__PURE__*/React__default.createElement(DetailsWrapper, {
|
|
8639
8694
|
"data-testid": "contact-card-details-block"
|
|
8640
8695
|
}, email && (/*#__PURE__*/React__default.createElement("a", {
|
|
@@ -8650,9 +8705,9 @@ var ContactCard = function ContactCard(_ref) {
|
|
|
8650
8705
|
rel: "noreferrer"
|
|
8651
8706
|
}, website)))), addressString && (/*#__PURE__*/React__default.createElement("div", {
|
|
8652
8707
|
"data-testid": "contact-card-address-block"
|
|
8653
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
8654
|
-
|
|
8655
|
-
}, addressString)))))))));
|
|
8708
|
+
}, /*#__PURE__*/React__default.createElement(AddressWrapperDesktop, null, /*#__PURE__*/React__default.createElement(BodyText, {
|
|
8709
|
+
level: 1
|
|
8710
|
+
}, addressString)), /*#__PURE__*/React__default.createElement(AddressWrapperMobile, null, divideAddressString(addressString))))))));
|
|
8656
8711
|
};
|
|
8657
8712
|
|
|
8658
8713
|
var _templateObject$X, _templateObject2$I, _templateObject3$v, _templateObject4$q, _templateObject5$k, _templateObject6$g;
|
|
@@ -8948,8 +9003,8 @@ var InfoCta = function InfoCta(_ref2) {
|
|
|
8948
9003
|
iconName = _ref2.iconName,
|
|
8949
9004
|
iconDirection = _ref2.iconDirection,
|
|
8950
9005
|
_ref2$target = _ref2.target,
|
|
8951
|
-
target = _ref2$target === void 0 ? LinkTarget.Self : _ref2$target
|
|
8952
|
-
|
|
9006
|
+
target = _ref2$target === void 0 ? LinkTarget.Self : _ref2$target,
|
|
9007
|
+
theme = _ref2.theme;
|
|
8953
9008
|
return /*#__PURE__*/React__default.createElement(InfoCTAWrapper, {
|
|
8954
9009
|
variant: variant,
|
|
8955
9010
|
theme: theme
|
|
@@ -8963,7 +9018,6 @@ var InfoCta = function InfoCta(_ref2) {
|
|
|
8963
9018
|
}));
|
|
8964
9019
|
};
|
|
8965
9020
|
|
|
8966
|
-
/* eslint-disable react/no-danger */
|
|
8967
9021
|
var defaultColumnSpan = 6;
|
|
8968
9022
|
var smallColumnSpan = 4;
|
|
8969
9023
|
var largeColumnSpan = 9;
|
|
@@ -8978,7 +9032,8 @@ var Information = function Information(_ref) {
|
|
|
8978
9032
|
var body = _ref.body,
|
|
8979
9033
|
title = _ref.title,
|
|
8980
9034
|
cta = _ref.cta,
|
|
8981
|
-
className = _ref.className
|
|
9035
|
+
className = _ref.className,
|
|
9036
|
+
theme = _ref.theme;
|
|
8982
9037
|
var _useViewport = useViewport(),
|
|
8983
9038
|
hydrated = _useViewport.hydrated;
|
|
8984
9039
|
var safeTitle = title || {
|
|
@@ -9019,11 +9074,12 @@ var Information = function Information(_ref) {
|
|
|
9019
9074
|
text: cta.text,
|
|
9020
9075
|
iconName: cta.iconName,
|
|
9021
9076
|
iconDirection: cta.iconDirection,
|
|
9022
|
-
target: cta.target
|
|
9077
|
+
target: cta.target,
|
|
9078
|
+
theme: theme
|
|
9023
9079
|
})))));
|
|
9024
9080
|
};
|
|
9025
9081
|
|
|
9026
|
-
var _templateObject$$, _templateObject2$M, _templateObject3$z, _templateObject4$t, _templateObject5$m, _templateObject6$h, _templateObject7$
|
|
9082
|
+
var _templateObject$$, _templateObject2$M, _templateObject3$z, _templateObject4$t, _templateObject5$m, _templateObject6$h, _templateObject7$b, _templateObject8$8;
|
|
9027
9083
|
var PageHeadingWrapper = /*#__PURE__*/styled('div')(_templateObject$$ || (_templateObject$$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-bottom: 80px;\n background-color: var(--page-header-bg-color);\n color: var(--color-base-white);\n\n ", ";\n\n h1,\n h2,\n h3 {\n margin: 0;\n padding: 0;\n }\n\n @media ", " {\n padding-bottom: 0;\n }\n"])), function (_ref) {
|
|
9028
9084
|
var isPageHeadingWithoutTitle = _ref.isPageHeadingWithoutTitle;
|
|
9029
9085
|
return isPageHeadingWithoutTitle && "\n padding-bottom: 42px;\n ";
|
|
@@ -9033,7 +9089,7 @@ var BadgeWrapper$1 = /*#__PURE__*/styled.div(_templateObject3$z || (_templateObj
|
|
|
9033
9089
|
var isPageHeadingWithoutTitle = _ref2.isPageHeadingWithoutTitle;
|
|
9034
9090
|
return isPageHeadingWithoutTitle && "\n height: 50px;\n padding-bottom: 0;\n margin: 10px 0;\n ";
|
|
9035
9091
|
});
|
|
9036
|
-
var TitleWrapper$
|
|
9092
|
+
var TitleWrapper$2 = /*#__PURE__*/styled.div(_templateObject4$t || (_templateObject4$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: title;\n margin-top: 80px;\n\n ", ";\n\n @media ", " {\n & {\n margin-top: 0;\n }\n }\n"])), function (_ref3) {
|
|
9037
9093
|
var isPageHeadingWithoutTitle = _ref3.isPageHeadingWithoutTitle;
|
|
9038
9094
|
return isPageHeadingWithoutTitle && "\n margin-top: 42px;\n ";
|
|
9039
9095
|
}, devices.mobile);
|
|
@@ -9042,14 +9098,14 @@ var ChildrenWrapper = /*#__PURE__*/styled.div(_templateObject5$m || (_templateOb
|
|
|
9042
9098
|
return isPageHeadingWithoutTitle && "\n margin: 10px 0;\n ";
|
|
9043
9099
|
}, devices.mobile);
|
|
9044
9100
|
var TextWrapper = /*#__PURE__*/styled.div(_templateObject6$h || (_templateObject6$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--color-base-white);\n grid-area: text;\n align-self: end;\n margin-top: 12px;\n\n h6 {\n margin: 0;\n padding: 0;\n }\n"])));
|
|
9045
|
-
var LogoWrapper = /*#__PURE__*/styled.div(_templateObject7$
|
|
9101
|
+
var LogoWrapper = /*#__PURE__*/styled.div(_templateObject7$b || (_templateObject7$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: logo;\n justify-self: end;\n margin-top: 20px;\n position: relative;\n\n > div {\n position: absolute;\n top: 0;\n right: 0;\n }\n\n ", ";\n\n @media ", " {\n & {\n align-self: start;\n margin-top: 0;\n\n ", ";\n }\n }\n"])), function (_ref5) {
|
|
9046
9102
|
var isPageHeadingWithoutTitle = _ref5.isPageHeadingWithoutTitle;
|
|
9047
9103
|
return isPageHeadingWithoutTitle && "\n margin-top: 40px;\n ";
|
|
9048
9104
|
}, devices.mobile, function (_ref6) {
|
|
9049
9105
|
var isPageHeadingWithoutTitle = _ref6.isPageHeadingWithoutTitle;
|
|
9050
9106
|
return isPageHeadingWithoutTitle && "\n margin-top: 15px;\n ";
|
|
9051
9107
|
});
|
|
9052
|
-
var ButtonWrapper$1 = /*#__PURE__*/styled.div(_templateObject8$
|
|
9108
|
+
var ButtonWrapper$1 = /*#__PURE__*/styled.div(_templateObject8$8 || (_templateObject8$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: button;\n justify-self: end;\n align-self: end;\n\n @media ", " {\n & {\n justify-self: center;\n align-self: center;\n width: 100%;\n margin-top: 16px;\n }\n }\n"])), devices.mobile);
|
|
9053
9109
|
|
|
9054
9110
|
var PageHeading = function PageHeading(_ref) {
|
|
9055
9111
|
var title = _ref.title,
|
|
@@ -9099,7 +9155,7 @@ var PageHeading = function PageHeading(_ref) {
|
|
|
9099
9155
|
className: className,
|
|
9100
9156
|
"data-testid": "page-heading-wrapper",
|
|
9101
9157
|
isPageHeadingWithoutTitle: isTitleUnAvailable
|
|
9102
|
-
}, /*#__PURE__*/React__default.createElement(PageHeadingGrid, null, /*#__PURE__*/React__default.createElement(TitleWrapper$
|
|
9158
|
+
}, /*#__PURE__*/React__default.createElement(PageHeadingGrid, null, /*#__PURE__*/React__default.createElement(TitleWrapper$2, {
|
|
9103
9159
|
"data-testid": "page-heading-title",
|
|
9104
9160
|
isPageHeadingWithoutTitle: isTitleUnAvailable
|
|
9105
9161
|
}, renderBadge(theme), children ? (/*#__PURE__*/React__default.createElement(ChildrenWrapper, {
|
|
@@ -9124,15 +9180,15 @@ var PageHeading = function PageHeading(_ref) {
|
|
|
9124
9180
|
}, /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, themedLink), linkText))) : null));
|
|
9125
9181
|
};
|
|
9126
9182
|
|
|
9127
|
-
var _templateObject$10, _templateObject2$N, _templateObject3$A, _templateObject4$u, _templateObject5$n, _templateObject6$i, _templateObject7$
|
|
9183
|
+
var _templateObject$10, _templateObject2$N, _templateObject3$A, _templateObject4$u, _templateObject5$n, _templateObject6$i, _templateObject7$c, _templateObject8$9;
|
|
9128
9184
|
var ImpactWrapper = /*#__PURE__*/styled.div(_templateObject$10 || (_templateObject$10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n aspect-ratio: 16 / 9;\n @supports not (aspect-ratio: 16 / 9) {\n height: 56.25vw;\n }\n\n position: relative;\n display: flex;\n background: var(--base-color-black);\n\n @media ", " {\n aspect-ratio: 1 / 1;\n @supports not (aspect-ratio: 1 / 1) {\n height: 100vw;\n }\n }\n"])), devices.mobile);
|
|
9129
9185
|
var ImpactHeaderImageWrapper = /*#__PURE__*/styled.div(_templateObject2$N || (_templateObject2$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n overflow: hidden;\n aspect-ratio: 16 / 9;\n @supports not (aspect-ratio: 16 / 9) {\n height: 56.25vw;\n }\n\n img {\n width: 100%;\n filter: brightness(0.7);\n opacity: 0.95;\n }\n\n @media ", " {\n height: fit-content;\n aspect-ratio: 1 / 1;\n @supports not (aspect-ratio: 1 / 1) {\n height: 100vw;\n }\n\n img {\n height: 100%;\n object-fit: cover;\n }\n }\n"])), devices.mobile);
|
|
9130
9186
|
var ImpactGrid = /*#__PURE__*/styled(Grid)(_templateObject3$A || (_templateObject3$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n align-self: center;\n width: 100%;\n z-index: ", ";\n gap: 0 var(--grid-column-gap);\n grid-template-rows: min-content min-content min-content;\n grid-template-areas:\n '. . . . . logo logo logo logo logo logo . . . . .'\n '. . . text text text text text text text text text text . . .'\n '. . . button button button button button button button button button button . . .';\n\n @media ", " {\n & {\n height: 100%;\n grid-template-rows: 1fr max-content 1fr;\n grid-template-areas:\n '. . . logo logo logo logo logo logo logo logo . . .'\n '. text text text text text text text text text text text text .'\n '. button button button button button button button button button button button button .';\n }\n }\n\n @media ", " {\n align-content: center;\n\n & {\n grid-template-areas:\n '. . . logo logo logo logo logo logo logo logo . . .'\n '. . text text text text text text text text text text . .'\n '. . button button button button button button button button button button . .';\n }\n }\n"])), zIndexes.contentOverlay, devices.mobile, devices.tablet);
|
|
9131
9187
|
var SponsorWrapper = /*#__PURE__*/styled.div(_templateObject4$u || (_templateObject4$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 20px;\n right: var(--grid-outer-margin);\n width: fit-content;\n z-index: ", ";\n\n @media ", " {\n & {\n right: var(--grid-margin);\n }\n }\n"])), zIndexes.sponsorship, devices.mobileAndTablet);
|
|
9132
9188
|
var LogoWrapper$1 = /*#__PURE__*/styled.div(_templateObject5$n || (_templateObject5$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: logo;\n align-self: end;\n"])));
|
|
9133
9189
|
var TextWrapper$1 = /*#__PURE__*/styled.div(_templateObject6$i || (_templateObject6$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: text;\n color: var(--base-color-white);\n text-align: center;\n margin-top: 40px;\n max-height: calc(2 * var(--line-height-header-3));\n overflow: hidden;\n\n h3 {\n margin: 0;\n padding: 0;\n }\n\n @media ", " {\n & {\n max-height: calc(4 * var(--line-height-header-3));\n }\n }\n\n @media ", " {\n & {\n margin-top: 12px;\n max-height: calc(4 * var(--line-height-header-3));\n }\n\n h3 {\n font-size: var(--font-size-header-3);\n letter-spacing: var(--letter-spacing-header-5);\n line-height: var(--line-height-header-5);\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
9134
|
-
var ButtonWrapper$2 = /*#__PURE__*/styled.div(_templateObject7$
|
|
9135
|
-
var ScrollDownWrapper = /*#__PURE__*/styled.div(_templateObject8$
|
|
9190
|
+
var ButtonWrapper$2 = /*#__PURE__*/styled.div(_templateObject7$c || (_templateObject7$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: button;\n align-self: end;\n display: flex;\n justify-content: center;\n margin-top: 40px;\n\n @media ", " {\n & {\n margin-top: 0px;\n margin-bottom: 20px;\n }\n }\n"])), devices.mobile);
|
|
9191
|
+
var ScrollDownWrapper = /*#__PURE__*/styled.div(_templateObject8$9 || (_templateObject8$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: 20px;\n left: var(--grid-outer-margin);\n width: fit-content;\n z-index: ", ";\n\n @keyframes UpDown {\n 0%,\n 100% {\n transform: translateY(0);\n }\n 50% {\n transform: translateY(8px);\n }\n }\n\n a {\n font-size: var(--font-size-overline-1);\n font-weight: var(--font-weight-overline-1);\n letter-spacing: var(--letter-spacing-overline-1);\n border: none;\n padding: 0;\n :hover {\n border: none;\n\n > span {\n animation: UpDown 1500ms linear infinite;\n }\n }\n }\n\n @media ", " {\n & {\n display: none;\n }\n }\n\n @media ", " {\n & {\n display: none;\n }\n }\n"])), zIndexes.contentOverlay, devices.mobile, devices.tablet);
|
|
9136
9192
|
|
|
9137
9193
|
var _excluded$m = ["text"];
|
|
9138
9194
|
var PageHeadingImpact = function PageHeadingImpact(_ref) {
|
|
@@ -9239,7 +9295,7 @@ var PageHeadingPanel = function PageHeadingPanel(_ref) {
|
|
|
9239
9295
|
})))));
|
|
9240
9296
|
};
|
|
9241
9297
|
|
|
9242
|
-
var _templateObject$12, _templateObject2$P, _templateObject3$C, _templateObject4$w, _templateObject5$p, _templateObject6$j, _templateObject7$
|
|
9298
|
+
var _templateObject$12, _templateObject2$P, _templateObject3$C, _templateObject4$w, _templateObject5$p, _templateObject6$j, _templateObject7$d, _templateObject8$a, _templateObject9$5, _templateObject0$5, _templateObject1$3;
|
|
9243
9299
|
var Wrapper$5 = /*#__PURE__*/styled.section(_templateObject$12 || (_templateObject$12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n"])));
|
|
9244
9300
|
var ImageWrapper = /*#__PURE__*/styled.div(_templateObject2$P || (_templateObject2$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n\n picture,\n img {\n width: 100%;\n height: 100%;\n }\n"])));
|
|
9245
9301
|
var SponsorWrapper$1 = /*#__PURE__*/styled.div(_templateObject3$C || (_templateObject3$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 20px;\n right: var(--grid-outer-margin);\n width: fit-content;\n z-index: ", ";\n\n @media ", " {\n & {\n right: var(--grid-margin);\n }\n }\n"])), zIndexes.sponsorship, devices.mobileAndTablet);
|
|
@@ -9252,16 +9308,16 @@ var ContentSection = /*#__PURE__*/styled.div(_templateObject5$p || (_templateObj
|
|
|
9252
9308
|
return showBlock ? 'block' : 'none';
|
|
9253
9309
|
}, devices.mobile);
|
|
9254
9310
|
var BadgeWrapper$2 = /*#__PURE__*/styled.div(_templateObject6$j || (_templateObject6$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n svg {\n height: 32px;\n }\n\n @media ", " {\n margin-bottom: 12px;\n }\n"])), devices.mobile);
|
|
9255
|
-
var AdditionalContentWrapper = /*#__PURE__*/styled.div(_templateObject7$
|
|
9311
|
+
var AdditionalContentWrapper = /*#__PURE__*/styled.div(_templateObject7$d || (_templateObject7$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: start;\n align-items: center;\n width: 200px;\n\n @media ", " {\n order: ", ";\n width: 100%;\n justify-content: center;\n }\n"])), devices.mobile, function (_ref3) {
|
|
9256
9312
|
var isBadgePresent = _ref3.isBadgePresent;
|
|
9257
9313
|
return isBadgePresent ? '1' : '4';
|
|
9258
9314
|
});
|
|
9259
|
-
var MainButtonWrapper = /*#__PURE__*/styled.div(_templateObject8$
|
|
9315
|
+
var MainButtonWrapper = /*#__PURE__*/styled.div(_templateObject8$a || (_templateObject8$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: end;\n width: 200px;\n\n @media ", " {\n margin-bottom: ", ";\n width: 100%;\n order: 3;\n }\n"])), devices.mobile, function (_ref4) {
|
|
9260
9316
|
var isAdditionalButtonPresent = _ref4.isAdditionalButtonPresent;
|
|
9261
9317
|
return isAdditionalButtonPresent ? '20px' : '0';
|
|
9262
9318
|
});
|
|
9263
|
-
var AdditionalButtonWrapper = /*#__PURE__*/styled.div(_templateObject9$
|
|
9264
|
-
var TitleWrapper$
|
|
9319
|
+
var AdditionalButtonWrapper = /*#__PURE__*/styled.div(_templateObject9$5 || (_templateObject9$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n width: 100%;\n display: flex;\n justify-content: center;\n }\n"])), devices.mobile);
|
|
9320
|
+
var TitleWrapper$3 = /*#__PURE__*/styled.div(_templateObject0$5 || (_templateObject0$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-align: center;\n padding: 10px 0;\n\n h1,\n h2,\n h3 {\n color: ", ";\n }\n\n @media ", " {\n padding: 0;\n order: 2;\n margin-bottom: ", ";\n }\n"])), function (_ref5) {
|
|
9265
9321
|
var theme = _ref5.theme;
|
|
9266
9322
|
return theme == ThemeType.Cinema ? 'var(--color-base-black)' : 'var(--color-base-white)';
|
|
9267
9323
|
}, devices.mobile, function (_ref6) {
|
|
@@ -9365,17 +9421,17 @@ var TITLE_MAX_LENGTH = 40;
|
|
|
9365
9421
|
var PageHeadingPromo = function PageHeadingPromo(_ref) {
|
|
9366
9422
|
var _ref$sponsor = _ref.sponsor,
|
|
9367
9423
|
sponsor = _ref$sponsor === void 0 ? true : _ref$sponsor,
|
|
9424
|
+
className = _ref.className,
|
|
9425
|
+
theme = _ref.theme,
|
|
9368
9426
|
badge = _ref.badge,
|
|
9369
9427
|
mainLink = _ref.mainLink,
|
|
9370
9428
|
title = _ref.title,
|
|
9371
9429
|
titleSemanticLevel = _ref.titleSemanticLevel,
|
|
9372
9430
|
additionalLink = _ref.additionalLink,
|
|
9373
|
-
image = _ref.image
|
|
9374
|
-
className = _ref.className;
|
|
9431
|
+
image = _ref.image;
|
|
9375
9432
|
var _useViewport = useViewport(),
|
|
9376
9433
|
isMobile = _useViewport.isMobile,
|
|
9377
9434
|
hydrated = _useViewport.hydrated;
|
|
9378
|
-
var theme = useHarmonicTheme();
|
|
9379
9435
|
var showImageButton = !title && !badge && !additionalLink && !isMobile;
|
|
9380
9436
|
var showContentBlock = !!title || !!additionalLink || !!mainLink && isMobile;
|
|
9381
9437
|
var truncatedTitle = title ? truncate(title, TITLE_MAX_LENGTH) : null;
|
|
@@ -9415,7 +9471,7 @@ var PageHeadingPromo = function PageHeadingPromo(_ref) {
|
|
|
9415
9471
|
}), !badge && (/*#__PURE__*/React__default.createElement(AdditionalButtonWrapper, null, /*#__PURE__*/React__default.createElement(Button$1, {
|
|
9416
9472
|
theme: theme,
|
|
9417
9473
|
link: additionalLink
|
|
9418
|
-
}))))), title && (/*#__PURE__*/React__default.createElement(TitleWrapper$
|
|
9474
|
+
}))))), title && (/*#__PURE__*/React__default.createElement(TitleWrapper$3, {
|
|
9419
9475
|
theme: theme,
|
|
9420
9476
|
isButtonPresent: !!mainLink || !!additionalLink
|
|
9421
9477
|
}, /*#__PURE__*/React__default.createElement(HarmonicHeader, {
|
|
@@ -9433,7 +9489,7 @@ var PageHeadingPromo = function PageHeadingPromo(_ref) {
|
|
|
9433
9489
|
theme: theme,
|
|
9434
9490
|
badge: badge,
|
|
9435
9491
|
isMobile: isMobile
|
|
9436
|
-
}))), title && (/*#__PURE__*/React__default.createElement(TitleWrapper$
|
|
9492
|
+
}))), title && (/*#__PURE__*/React__default.createElement(TitleWrapper$3, {
|
|
9437
9493
|
theme: theme,
|
|
9438
9494
|
isButtonPresent: !!mainLink || !!additionalLink
|
|
9439
9495
|
}, /*#__PURE__*/React__default.createElement(HarmonicHeader, {
|
|
@@ -9453,7 +9509,7 @@ var PageHeadingPromo = function PageHeadingPromo(_ref) {
|
|
|
9453
9509
|
})))))))))));
|
|
9454
9510
|
};
|
|
9455
9511
|
|
|
9456
|
-
var _templateObject$13, _templateObject2$Q, _templateObject3$D, _templateObject5$q, _templateObject6$k, _templateObject7$
|
|
9512
|
+
var _templateObject$13, _templateObject2$Q, _templateObject3$D, _templateObject5$q, _templateObject6$k, _templateObject7$e, _templateObject8$b, _templateObject9$6, _templateObject0$6;
|
|
9457
9513
|
var BrandingTextBlock = /*#__PURE__*/styled.div(_templateObject$13 || (_templateObject$13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-body-2);\n font-family: var(--font-family-header);\n text-transform: uppercase;\n margin: 0;\n white-space: nowrap;\n @media screen and (max-width: 920px) {\n white-space: normal;\n }\n @media ", " {\n white-space: nowrap;\n }\n"])), devices.mobile);
|
|
9458
9514
|
var BrandingTextBody = /*#__PURE__*/styled.div(_templateObject2$Q || (_templateObject2$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-size: var(--font-size-heading-6);\n line-height: var(--line-height-heading-6);\n"])));
|
|
9459
9515
|
var ComapctHeaderWrapper = /*#__PURE__*/styled.div(_templateObject3$D || (_templateObject3$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n display: block;\n"])));
|
|
@@ -9474,10 +9530,10 @@ var CompactHeaderCopyWrapper = /*#__PURE__*/styled(Grid)(_templateObject6$k || (
|
|
|
9474
9530
|
var theme = _ref4.theme;
|
|
9475
9531
|
return theme.colors.primary === theme.colors.stream && "\n color: " + theme.colors.stream + ";\n background-color: " + theme.colors.white + ";\n ";
|
|
9476
9532
|
}, devices.tablet, devices.mobile);
|
|
9477
|
-
var CompactHeaderLogoWrapper = /*#__PURE__*/styled.div(_templateObject7$
|
|
9478
|
-
var CompactHeaderTitleWrapper = /*#__PURE__*/styled.div(_templateObject8$
|
|
9479
|
-
var CompactHeaderCTAWrapper = /*#__PURE__*/styled.div(_templateObject9$
|
|
9480
|
-
var PrimaryButtonWithInversion = /*#__PURE__*/styled(PrimaryButton)(_templateObject0$
|
|
9533
|
+
var CompactHeaderLogoWrapper = /*#__PURE__*/styled.div(_templateObject7$e || (_templateObject7$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n grid-area: logo;\n padding-left: 50px;\n justify-content: left;\n align-items: center;\n width: 100%;\n @media ", " {\n padding-left: 0px;\n justify-content: center;\n }\n @media ", " {\n width: fit-content;\n }\n"])), devices.mobile, devices.tablet);
|
|
9534
|
+
var CompactHeaderTitleWrapper = /*#__PURE__*/styled.div(_templateObject8$b || (_templateObject8$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n grid-area: title;\n align-items: center;\n justify-content: center;\n font-family: var(--font-family-header);\n text-transform: uppercase;\n text-align: center;\n padding: 0 2em;\n @media ", " {\n justify-content: center;\n }\n"])), devices.mobile);
|
|
9535
|
+
var CompactHeaderCTAWrapper = /*#__PURE__*/styled.div(_templateObject9$6 || (_templateObject9$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n grid-area: cta;\n justify-content: right;\n align-items: center;\n padding-right: 50px;\n @media ", " {\n padding-right: 0px;\n justify-content: center;\n }\n"])), devices.mobile);
|
|
9536
|
+
var PrimaryButtonWithInversion = /*#__PURE__*/styled(PrimaryButton)(_templateObject0$6 || (_templateObject0$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: ", ";\n color: ", ";\n svg {\n fill: ", ";\n path {\n fill: ", ";\n }\n }\n min-width: 145px;\n"])), function (_ref5) {
|
|
9481
9537
|
var invert = _ref5.invert,
|
|
9482
9538
|
theme = _ref5.theme;
|
|
9483
9539
|
return invert ? theme.colors.primary : theme.colors.white;
|
|
@@ -9707,14 +9763,14 @@ var PageHeadingCompact = function PageHeadingCompact(_ref4) {
|
|
|
9707
9763
|
}), linkText))))));
|
|
9708
9764
|
};
|
|
9709
9765
|
|
|
9710
|
-
var _templateObject$14, _templateObject2$R, _templateObject3$E, _templateObject5$r, _templateObject6$l, _templateObject7$
|
|
9766
|
+
var _templateObject$14, _templateObject2$R, _templateObject3$E, _templateObject5$r, _templateObject6$l, _templateObject7$f, _templateObject8$c;
|
|
9711
9767
|
var linkButtonStyles = /*#__PURE__*/css(_templateObject$14 || (_templateObject$14 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n align-items: center;\n justify-content: center;\n margin-left: 0;\n background: none;\n border: none;\n color: inherit;\n text-decoration: none;\n cursor: pointer;\n font: inherit;\n padding: 0;\n\n span {\n height: 1.5em;\n width: 1.5em;\n\n svg > path {\n fill: var(--color-base-black);\n }\n }\n\n &:hover {\n outline: none;\n }\n"])));
|
|
9712
9768
|
var PageNav = /*#__PURE__*/styled.a(_templateObject2$R || (_templateObject2$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n"])), linkButtonStyles);
|
|
9713
9769
|
var PaginationLink = /*#__PURE__*/styled.a(_templateObject3$E || (_templateObject3$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n"])), linkButtonStyles);
|
|
9714
9770
|
var PageNumberWrapper = /*#__PURE__*/styled.ol(_templateObject5$r || (_templateObject5$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n min-width: fit-content;\n align-items: center;\n justify-content: center;\n flex-wrap: nowrap;\n flex-direction: row;\n list-style: none;\n padding: 0;\n max-width: fit-content;\n margin: 0 auto;\n\n li {\n margin-left: 24px;\n color: var(--color-base-black);\n display: flex;\n justify-content: flex-start;\n align-items: center;\n }\n\n li:first-child {\n margin-left: 0px;\n }\n"])));
|
|
9715
9771
|
var LastPageItem = /*#__PURE__*/styled.li(_templateObject6$l || (_templateObject6$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n margin-left: 12px;\n }\n"])));
|
|
9716
|
-
var PreviousPageItem = /*#__PURE__*/styled.li(_templateObject7$
|
|
9717
|
-
var TextLinkPagination = /*#__PURE__*/styled(BodyCopyHarmonic)(_templateObject8$
|
|
9772
|
+
var PreviousPageItem = /*#__PURE__*/styled.li(_templateObject7$f || (_templateObject7$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n margin-left: 12px;\n }\n"])));
|
|
9773
|
+
var TextLinkPagination = /*#__PURE__*/styled(BodyCopyHarmonic)(_templateObject8$c || (_templateObject8$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n color: ", ";\n border-bottom: ", ";\n }\n\n :hover {\n cursor: pointer;\n color: var(--color-primary-red);\n border-bottom: 1px solid var(--color-primary-red);\n svg > path {\n fill: var(--color-base-black);\n }\n }\n"])), function (_ref) {
|
|
9718
9774
|
var active = _ref.active;
|
|
9719
9775
|
return active ? "var(--color-primary-red)" : 'inherit';
|
|
9720
9776
|
}, function (_ref2) {
|
|
@@ -9862,14 +9918,14 @@ var Pagination = function Pagination(_ref) {
|
|
|
9862
9918
|
}))))));
|
|
9863
9919
|
};
|
|
9864
9920
|
|
|
9865
|
-
var _templateObject$15, _templateObject2$S, _templateObject3$F, _templateObject4$x, _templateObject5$s, _templateObject6$m, _templateObject7$
|
|
9921
|
+
var _templateObject$15, _templateObject2$S, _templateObject3$F, _templateObject4$x, _templateObject5$s, _templateObject6$m, _templateObject7$g;
|
|
9866
9922
|
var PeopleListingGrid = /*#__PURE__*/styled(Grid)(_templateObject$15 || (_templateObject$15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: var(--line-height-people-listing-gap) var(--grid-column-gap);\n\n p {\n margin: 0;\n }\n\n grid-template-columns: 1fr 1fr 1fr;\n\n @media ", " {\n grid-template-columns: 1fr;\n }\n\n @media ", " {\n grid-template-columns: 1fr 1fr;\n }\n\n @media ", " {\n grid-template-columns: 1fr 1fr 1fr 1fr;\n }\n"])), devices.mobile, devices.tablet, devices.largeDesktop);
|
|
9867
9923
|
var PersonWrapper = /*#__PURE__*/styled.div(_templateObject2$S || (_templateObject2$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: 60px 1fr;\n grid-template-areas: 'headshot role-person';\n grid-column-gap: 10px;\n"])));
|
|
9868
9924
|
var HeadshotWrapper = /*#__PURE__*/styled.div(_templateObject3$F || (_templateObject3$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n grid-area: headshot;\n img {\n width: 60px;\n height: 60px;\n }\n"])));
|
|
9869
9925
|
var RoleWrapper = /*#__PURE__*/styled.div(_templateObject4$x || (_templateObject4$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-dark-grey);\n overflow-wrap: break-word;\n margin-bottom: 4px;\n"])));
|
|
9870
9926
|
var TextWrapper$2 = /*#__PURE__*/styled.div(_templateObject5$s || (_templateObject5$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: role-person;\n break-inside: avoid;\n"])));
|
|
9871
9927
|
var PersonLink = /*#__PURE__*/styled.a(_templateObject6$m || (_templateObject6$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-black);\n text-decoration: underline;\n\n :hover {\n color: var(--base-color-primary);\n :after {\n color: var(--base-color-black);\n }\n }\n\n :visited {\n color: var(--base-color-black);\n }\n"])));
|
|
9872
|
-
var ReplacementWrapper = /*#__PURE__*/styled.span(_templateObject7$
|
|
9928
|
+
var ReplacementWrapper = /*#__PURE__*/styled.span(_templateObject7$g || (_templateObject7$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-dark-grey);\n"])));
|
|
9873
9929
|
|
|
9874
9930
|
var Person = function Person(_ref) {
|
|
9875
9931
|
var person = _ref.person,
|
|
@@ -10060,7 +10116,7 @@ var CreditListing = function CreditListing(_ref) {
|
|
|
10060
10116
|
}, creditEntries);
|
|
10061
10117
|
};
|
|
10062
10118
|
|
|
10063
|
-
var _templateObject$17, _templateObject3$H, _templateObject4$z, _templateObject5$t, _templateObject6$n, _templateObject7$
|
|
10119
|
+
var _templateObject$17, _templateObject2$U, _templateObject3$H, _templateObject4$z, _templateObject5$t, _templateObject6$n, _templateObject7$h, _templateObject8$d, _templateObject9$7, _templateObject0$7, _templateObject1$4, _templateObject10$3, _templateObject11$3, _templateObject12$3, _templateObject13$2, _templateObject14$1, _templateObject15$1, _templateObject16, _templateObject17, _templateObject18, _templateObject19;
|
|
10064
10120
|
var LENGTH_TEXT = 28;
|
|
10065
10121
|
var LENGTH_TEXT_TABLET$1 = 12;
|
|
10066
10122
|
var GridTemplateImageToLeft = "'left left left left left left left left . right right right right right . .'";
|
|
@@ -10077,7 +10133,9 @@ var PromoWithTagsGrid = /*#__PURE__*/styled(Grid)(_templateObject$17 || (_templa
|
|
|
10077
10133
|
var asCard = _ref3.asCard;
|
|
10078
10134
|
return asCard ? "\n grid-template-areas: " + GridTemplateAsCard + ";\n @media " + devices.tablet + " {\n grid-template-areas: " + GridTemplateAsCardTablet + ";\n }\n " : "";
|
|
10079
10135
|
});
|
|
10080
|
-
var
|
|
10136
|
+
var PromoWithTagsSubtitle = /*#__PURE__*/styled.span(_templateObject2$U || (_templateObject2$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-size: var(--font-size-subtitle-1);\n font-weight: var(--font-weight-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n margin-bottom: var(--editorial-subtitle-margin-bottom);\n display: block;\n overflow-wrap: break-word;\n"])));
|
|
10137
|
+
var PromoWithTagsText = /*#__PURE__*/styled.div(_templateObject3$H || (_templateObject3$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-size: var(--font-size-body-1);\n font-weight: var(--font-weight-body-1);\n line-height: var(--line-height-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n text-transform: var(--text-transform-body);\n margin: 0;\n padding: 0;\n white-space: break-spaces;\n overflow-wrap: break-word;\n\n h5,\n h6 {\n margin: 0 0 4px 0;\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-size: var(--font-size-subtitle-2);\n font-weight: var(--font-weight-subtitle-2);\n line-height: var(--line-height-subtitle-2);\n letter-spacing: var(--letter-spacing-subtitle-2);\n text-transform: var(--text-transform-subtitle);\n overflow-wrap: break-word;\n }\n\n em {\n font-family: var(--font-family-body-italics);\n }\n\n a {\n text-decoration: underline;\n cursor: pointer;\n\n &[href^='tel:'] {\n text-decoration: none;\n }\n\n &:link {\n color: var(--color-primary-black);\n }\n\n &:visited {\n color: var(--color-base-dark-grey);\n }\n\n &:hover {\n color: var(--color-primary-red);\n }\n }\n"])));
|
|
10138
|
+
var ButtonsContainer$2 = /*#__PURE__*/styled.div(_templateObject4$z || (_templateObject4$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n gap: 16px;\n margin-top: 24px;\n\n ", ";\n\n ", "\n\n @media ", " {\n gap: 24px;\n flex-direction: column;\n align-items: center;\n }\n\n @media ", " {\n gap: 24px;\n align-items: flex-start;\n\n ", "\n }\n"])), function (_ref4) {
|
|
10081
10139
|
var hasTextLinks = _ref4.hasTextLinks;
|
|
10082
10140
|
return "margin-top: " + (hasTextLinks ? '0' : '24px') + ";";
|
|
10083
10141
|
}, function (_ref5) {
|
|
@@ -10101,39 +10159,38 @@ var ButtonsContainer$2 = /*#__PURE__*/styled.div(_templateObject3$H || (_templat
|
|
|
10101
10159
|
}
|
|
10102
10160
|
return '';
|
|
10103
10161
|
});
|
|
10104
|
-
var PromoWithTagsTagWrapper = /*#__PURE__*/styled.div(
|
|
10162
|
+
var PromoWithTagsTagWrapper = /*#__PURE__*/styled.div(_templateObject5$t || (_templateObject5$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: ", ";\n"])), function (_ref7) {
|
|
10105
10163
|
var marginBottom = _ref7.marginBottom;
|
|
10106
10164
|
return marginBottom + "px";
|
|
10107
|
-
}
|
|
10108
|
-
|
|
10109
|
-
|
|
10110
|
-
});
|
|
10111
|
-
var
|
|
10112
|
-
var
|
|
10113
|
-
var
|
|
10114
|
-
var
|
|
10115
|
-
var
|
|
10116
|
-
var
|
|
10117
|
-
var
|
|
10118
|
-
var
|
|
10119
|
-
|
|
10165
|
+
});
|
|
10166
|
+
var PromoWithTagsAdditionalText = /*#__PURE__*/styled(PromoWithTagsText)(_templateObject6$n || (_templateObject6$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 24px 0;\n"])));
|
|
10167
|
+
var TextLinksContainer = /*#__PURE__*/styled.div(_templateObject7$h || (_templateObject7$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-wrap: wrap;\n margin: 24px 0 4px 0;\n"])));
|
|
10168
|
+
var TextLinkWrapper$3 = /*#__PURE__*/styled.div(_templateObject8$d || (_templateObject8$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-right: 24px;\n margin-bottom: 20px;\n\n &:last-child {\n margin-right: 0;\n }\n"])));
|
|
10169
|
+
var ExtraContentWrapper = /*#__PURE__*/styled.div(_templateObject9$7 || (_templateObject9$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding-right: 68px;\n\n iframe {\n height: 800px;\n }\n\n @media ", " {\n padding: 30px 0 0;\n }\n\n @media ", " {\n padding: 0;\n position: initial;\n }\n"])), devices.tablet, devices.mobile);
|
|
10170
|
+
var IconWrapper$2 = /*#__PURE__*/styled.div(_templateObject0$7 || (_templateObject0$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: pointer;\n position: absolute;\n top: 25px;\n right: 35px;\n width: 24px;\n height: 24px;\n\n @media ", " {\n top: 30px;\n right: 30px;\n }\n\n @media ", " {\n top: 3px;\n right: 20px;\n }\n"])), devices.tablet, devices.mobile);
|
|
10171
|
+
var PrimaryButtonWrapper$1 = /*#__PURE__*/styled.div(_templateObject1$4 || (_templateObject1$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--button-height);\n\n @media ", " {\n width: 100%;\n }\n"])), devices.mobile);
|
|
10172
|
+
var MobileTitleWrapper = /*#__PURE__*/styled.div(_templateObject10$3 || (_templateObject10$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n margin: 0 50px 0 20px;\n\n h2,\n h3 {\n margin: 0;\n }\n\n @media ", " {\n display: block;\n }\n"])), devices.mobile);
|
|
10173
|
+
var PromoWithTagsTypeTags = /*#__PURE__*/styled(TypeTags)(_templateObject11$3 || (_templateObject11$3 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
10174
|
+
var PromoWithTagsHeader = /*#__PURE__*/styled(Header)(_templateObject12$3 || (_templateObject12$3 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
10175
|
+
var PromoWithTagsTextLink = /*#__PURE__*/styled(TextLink)(_templateObject13$2 || (_templateObject13$2 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
10176
|
+
var asCardOverrides = /*#__PURE__*/css(_templateObject14$1 || (_templateObject14$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", " {\n font-size: var(--font-size-subtitle-2);\n }\n\n ", " {\n font-size: var(--font-size-overline-1);\n }\n\n ", " {\n flex-direction: row;\n @media ", " {\n flex-direction: row;\n }\n }\n\n ", " {\n font-size: var(--font-size-overline-2);\n font-weight: var(--font-weight-overline-2);\n line-height: var(--line-height-overline-2);\n letter-spacing: var(--letter-spacing-overline-2);\n }\n"])), PromoWithTagsSubtitle, PromoWithTagsTypeTags, ButtonsContainer$2, devices.tablet, PromoWithTagsTextLink);
|
|
10177
|
+
var PromoWithTagsExtraContentWrapper = /*#__PURE__*/styled.div(_templateObject15$1 || (_templateObject15$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n grid-area: left;\n grid-area: ", ";\n align-self: center;\n @media ", " {\n & {\n grid-area: row1;\n }\n }\n"])), function (_ref8) {
|
|
10178
|
+
var imageToLeft = _ref8.imageToLeft;
|
|
10120
10179
|
return imageToLeft ? 'left' : 'right';
|
|
10121
10180
|
}, devices.mobile);
|
|
10122
|
-
var PromoWithTagsContentWrapper = /*#__PURE__*/styled.div(
|
|
10123
|
-
var imageToLeft =
|
|
10181
|
+
var PromoWithTagsContentWrapper = /*#__PURE__*/styled.div(_templateObject16 || (_templateObject16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n align-self: center;\n @media ", " {\n & {\n display: ", ";\n grid-area: row2;\n align-self: start;\n }\n }\n\n ", "\n"])), function (_ref9) {
|
|
10182
|
+
var imageToLeft = _ref9.imageToLeft;
|
|
10124
10183
|
return imageToLeft ? 'right' : 'left';
|
|
10125
|
-
}, devices.mobile, function (
|
|
10126
|
-
var hideSection =
|
|
10184
|
+
}, devices.mobile, function (_ref0) {
|
|
10185
|
+
var hideSection = _ref0.hideSection;
|
|
10127
10186
|
return hideSection ? 'none' : 'block';
|
|
10128
|
-
}, function (
|
|
10129
|
-
var asCard =
|
|
10187
|
+
}, function (_ref1) {
|
|
10188
|
+
var asCard = _ref1.asCard;
|
|
10130
10189
|
return asCard && asCardOverrides;
|
|
10131
10190
|
});
|
|
10132
|
-
var
|
|
10133
|
-
var
|
|
10134
|
-
var
|
|
10135
|
-
var BodyCopyHarmonicWithWrapper$1 = /*#__PURE__*/styled(BodyCopyHarmonic)(_templateObject15$1 || (_templateObject15$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n margin-bottom: 32px;\n whiete-space: break-spaces;\n overflow-wrap: break-word;\n\n a {\n text-decoration: underline;\n cursor: pointer;\n\n &[href^='tel:'] {\n text-decoration: none;\n }\n\n &:link {\n color: var(--color-primary-black);\n }\n\n &:visited {\n color: var(--color-base-dark-grey);\n }\n\n &:hover {\n color: var(--color-primary-red);\n }\n }\n @media ", " {\n margin-bottom: 24px;\n }\n"])), devices.mobile);
|
|
10136
|
-
var HarmonicSubtitleWithWrapper = /*#__PURE__*/styled(HarmonicSubtitle)(_templateObject16 || (_templateObject16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-wrap: break-word;\n margin-bottom: 16px;\n"])));
|
|
10191
|
+
var PromoWithTagsContainer = /*#__PURE__*/styled.div(_templateObject17 || (_templateObject17 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h2,\n h3 {\n margin: 0 0 16px;\n }\n"])));
|
|
10192
|
+
var TimerWrapper$2 = /*#__PURE__*/styled.div(_templateObject18 || (_templateObject18 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 32px;\n"])));
|
|
10193
|
+
var EndDateText = /*#__PURE__*/styled.div(_templateObject19 || (_templateObject19 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-bottom: 1px solid var(--base-color-black);\n padding-bottom: 32px;\n margin-bottom: 32px;\n\n @media ", " {\n padding-bottom: 20px;\n margin-bottom: 20px;\n }\n"])), devices.mobile);
|
|
10137
10194
|
|
|
10138
10195
|
var _excluded$o = ["text"],
|
|
10139
10196
|
_excluded2$4 = ["text"],
|
|
@@ -10149,7 +10206,6 @@ var PromoWithTags = function PromoWithTags(_ref) {
|
|
|
10149
10206
|
title = _ref$title === void 0 ? '' : _ref$title,
|
|
10150
10207
|
_ref$titleSize = _ref.titleSize,
|
|
10151
10208
|
titleSize = _ref$titleSize === void 0 ? 'large' : _ref$titleSize,
|
|
10152
|
-
titleHierarchy = _ref.titleHierarchy,
|
|
10153
10209
|
subtitle = _ref.subtitle,
|
|
10154
10210
|
text = _ref.text,
|
|
10155
10211
|
textLinks = _ref.textLinks,
|
|
@@ -10176,12 +10232,15 @@ var PromoWithTags = function PromoWithTags(_ref) {
|
|
|
10176
10232
|
setIsTimerActive = _useState2[1];
|
|
10177
10233
|
var getTitleLevel = function getTitleLevel(size, isCard) {
|
|
10178
10234
|
if (isCard) {
|
|
10179
|
-
return
|
|
10235
|
+
return 5;
|
|
10236
|
+
}
|
|
10237
|
+
if (size === 'large') {
|
|
10238
|
+
return 2;
|
|
10180
10239
|
}
|
|
10181
|
-
return
|
|
10240
|
+
return 3;
|
|
10182
10241
|
};
|
|
10183
|
-
var titleLevel = getTitleLevel(titleSize, asCard);
|
|
10184
10242
|
var imageToLeft = imagePosition === 'left';
|
|
10243
|
+
var titleLevel = getTitleLevel(titleSize, asCard);
|
|
10185
10244
|
var isExtraContentPresent = !!children;
|
|
10186
10245
|
var anchorLink = title.replace(' ', '-').toLocaleLowerCase() + "-content";
|
|
10187
10246
|
var handleExtraContent = function handleExtraContent(e) {
|
|
@@ -10213,15 +10272,15 @@ var PromoWithTags = function PromoWithTags(_ref) {
|
|
|
10213
10272
|
restTextLink = _objectWithoutPropertiesLoose(link, _excluded3);
|
|
10214
10273
|
return /*#__PURE__*/React__default.createElement(TextLinkWrapper$3, {
|
|
10215
10274
|
key: index
|
|
10216
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
10275
|
+
}, /*#__PURE__*/React__default.createElement(PromoWithTagsTextLink, Object.assign({}, restTextLink), textLinkText));
|
|
10217
10276
|
}) : null;
|
|
10218
10277
|
var renderTimerBlock = function renderTimerBlock() {
|
|
10219
10278
|
if (!timerParams) return null;
|
|
10220
10279
|
if (!isTimerActive && timerParams.endDateText) {
|
|
10221
10280
|
return /*#__PURE__*/React__default.createElement(EndDateText, {
|
|
10222
10281
|
"data-testid": "promo-with-tags-timer-end-date-text"
|
|
10223
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
10224
|
-
|
|
10282
|
+
}, /*#__PURE__*/React__default.createElement(AltHeader, {
|
|
10283
|
+
level: 5
|
|
10225
10284
|
}, timerParams.endDateText));
|
|
10226
10285
|
}
|
|
10227
10286
|
return /*#__PURE__*/React__default.createElement(TimerWrapper$2, {
|
|
@@ -10245,36 +10304,30 @@ var PromoWithTags = function PromoWithTags(_ref) {
|
|
|
10245
10304
|
imageToLeft: imageToLeft,
|
|
10246
10305
|
hideSection: showExtraContent,
|
|
10247
10306
|
asCard: asCard
|
|
10248
|
-
}, renderTimerBlock(), /*#__PURE__*/React__default.createElement(
|
|
10249
|
-
marginBottom:
|
|
10250
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
10307
|
+
}, renderTimerBlock(), /*#__PURE__*/React__default.createElement(PromoWithTagsContainer, null, !!(aboveTitleTags != null && aboveTitleTags.length) && (/*#__PURE__*/React__default.createElement(PromoWithTagsTagWrapper, {
|
|
10308
|
+
marginBottom: 16
|
|
10309
|
+
}, /*#__PURE__*/React__default.createElement(PromoWithTagsTypeTags, {
|
|
10251
10310
|
list: aboveTitleTags
|
|
10252
|
-
}))), /*#__PURE__*/React__default.createElement(
|
|
10253
|
-
|
|
10254
|
-
|
|
10255
|
-
}, title)), !!(belowTitleTags != null && belowTitleTags.length) && (/*#__PURE__*/React__default.createElement(PromoWithTagsTagWrapper, {
|
|
10256
|
-
marginBottom:
|
|
10257
|
-
|
|
10258
|
-
}, /*#__PURE__*/React__default.createElement(TypeTags, {
|
|
10311
|
+
}))), /*#__PURE__*/React__default.createElement(PromoWithTagsHeader, {
|
|
10312
|
+
semanticLevel: 2,
|
|
10313
|
+
level: titleLevel
|
|
10314
|
+
}, title)), subtitle && /*#__PURE__*/React__default.createElement(PromoWithTagsSubtitle, null, subtitle), !!(belowTitleTags != null && belowTitleTags.length) && (/*#__PURE__*/React__default.createElement(PromoWithTagsTagWrapper, {
|
|
10315
|
+
marginBottom: 8
|
|
10316
|
+
}, /*#__PURE__*/React__default.createElement(PromoWithTagsTypeTags, {
|
|
10259
10317
|
list: belowTitleTags
|
|
10260
|
-
}))),
|
|
10261
|
-
size: "large"
|
|
10262
|
-
}, subtitle) : null, /*#__PURE__*/React__default.createElement(BodyCopyHarmonicWithWrapper$1, {
|
|
10263
|
-
size: "large",
|
|
10318
|
+
}))), /*#__PURE__*/React__default.createElement(PromoWithTagsText, {
|
|
10264
10319
|
dangerouslySetInnerHTML: {
|
|
10265
10320
|
__html: textTruncate
|
|
10266
10321
|
}
|
|
10267
|
-
}), middleText &&
|
|
10268
|
-
size: "large",
|
|
10322
|
+
}), middleText && /*#__PURE__*/React__default.createElement(PromoWithTagsAdditionalText, {
|
|
10269
10323
|
dangerouslySetInnerHTML: {
|
|
10270
10324
|
__html: middleText
|
|
10271
10325
|
}
|
|
10272
|
-
})
|
|
10273
|
-
size: "large",
|
|
10326
|
+
}), bottomText && /*#__PURE__*/React__default.createElement(PromoWithTagsAdditionalText, {
|
|
10274
10327
|
dangerouslySetInnerHTML: {
|
|
10275
10328
|
__html: bottomText
|
|
10276
10329
|
}
|
|
10277
|
-
})
|
|
10330
|
+
}), !!(textLinks != null && textLinks.length) && /*#__PURE__*/React__default.createElement(TextLinksContainer, null, textLinkItems), links && (/*#__PURE__*/React__default.createElement(ButtonsContainer$2, {
|
|
10278
10331
|
hasTextLinks: !!(textLinks != null && textLinks.length),
|
|
10279
10332
|
"data-testid": "buttons-wrapper",
|
|
10280
10333
|
primaryButtonTextLength: firstButtonText.length,
|
|
@@ -10289,9 +10342,9 @@ var PromoWithTags = function PromoWithTags(_ref) {
|
|
|
10289
10342
|
}, restFirstButton), primaryButtonTextTruncate)))), secondButton && (/*#__PURE__*/React__default.createElement(SecondButtonComponent, Object.assign({}, restSecondButton), secondButtonTextTruncate))))), /*#__PURE__*/React__default.createElement(PromoWithTagsExtraContentWrapper, {
|
|
10290
10343
|
"data-testid": "extra-content-wrapper",
|
|
10291
10344
|
imageToLeft: imageToLeft
|
|
10292
|
-
}, showExtraContent && (/*#__PURE__*/React__default.createElement(MobileTitleWrapper, null, /*#__PURE__*/React__default.createElement(
|
|
10293
|
-
|
|
10294
|
-
|
|
10345
|
+
}, showExtraContent && (/*#__PURE__*/React__default.createElement(MobileTitleWrapper, null, /*#__PURE__*/React__default.createElement(PromoWithTagsHeader, {
|
|
10346
|
+
semanticLevel: 2,
|
|
10347
|
+
level: titleLevel
|
|
10295
10348
|
}, title))), /*#__PURE__*/React__default.createElement(ImageAspectRatioWrapper, {
|
|
10296
10349
|
aspectRatio: AspectRatio['4:3']
|
|
10297
10350
|
}, isExtraContentPresent && showExtraContent ? (/*#__PURE__*/React__default.createElement(ExtraContentWrapper, null, children, /*#__PURE__*/React__default.createElement(IconWrapper$2, {
|
|
@@ -10315,7 +10368,7 @@ var PromoWithTags = function PromoWithTags(_ref) {
|
|
|
10315
10368
|
}))));
|
|
10316
10369
|
};
|
|
10317
10370
|
|
|
10318
|
-
var _templateObject$18, _templateObject2$
|
|
10371
|
+
var _templateObject$18, _templateObject2$V, _templateObject3$I, _templateObject4$A, _templateObject5$u, _templateObject6$o, _templateObject7$i;
|
|
10319
10372
|
var LENGTH_TEXT$2 = 28;
|
|
10320
10373
|
var LENGTH_TEXT_TABLET$2 = 10;
|
|
10321
10374
|
var PromoWithTitleGrid = /*#__PURE__*/styled(Grid)(_templateObject$18 || (_templateObject$18 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-template-areas: ", ";\n\n @media ", " {\n & {\n grid-template-areas: ", ";\n }\n }\n\n @media ", " {\n & {\n grid-template-columns: var(--grid-margin) minmax(0, 1fr) var(--grid-margin);\n grid-template-rows: min-content 24px min-content;\n gap: 0;\n grid-template-areas:\n 'row1 row1 row1'\n '. . .'\n '. row2 .';\n }\n }\n"])), function (_ref) {
|
|
@@ -10325,7 +10378,7 @@ var PromoWithTitleGrid = /*#__PURE__*/styled(Grid)(_templateObject$18 || (_templ
|
|
|
10325
10378
|
var imageToLeft = _ref2.imageToLeft;
|
|
10326
10379
|
return imageToLeft ? "'left left left left left left left right right right right right right .'" : "'. left left left left left left right right right right right right right'";
|
|
10327
10380
|
}, devices.mobile);
|
|
10328
|
-
var PromoWithTitleImageWrapper = /*#__PURE__*/styled.div(_templateObject2$
|
|
10381
|
+
var PromoWithTitleImageWrapper = /*#__PURE__*/styled.div(_templateObject2$V || (_templateObject2$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n align-self: center;\n @media ", " {\n & {\n grid-area: row1;\n }\n }\n"])), function (_ref3) {
|
|
10329
10382
|
var imageToLeft = _ref3.imageToLeft;
|
|
10330
10383
|
return imageToLeft ? 'left' : 'right';
|
|
10331
10384
|
}, devices.mobile);
|
|
@@ -10333,10 +10386,10 @@ var PromoWithTitleContentWrapper = /*#__PURE__*/styled.div(_templateObject3$I ||
|
|
|
10333
10386
|
var imageToLeft = _ref4.imageToLeft;
|
|
10334
10387
|
return imageToLeft ? 'right' : 'left';
|
|
10335
10388
|
}, devices.mobile);
|
|
10336
|
-
var HarmonicHeaderWithWrapper
|
|
10337
|
-
var HarmonicSubtitleWithWrapper
|
|
10338
|
-
var BodyCopyHarmonicWithWrapper$
|
|
10339
|
-
var ButtonsContainer$3 = /*#__PURE__*/styled.div(_templateObject7$
|
|
10389
|
+
var HarmonicHeaderWithWrapper = /*#__PURE__*/styled(HarmonicHeader)(_templateObject4$A || (_templateObject4$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-bottom: 32px;\n\n @media ", " {\n padding-bottom: 24px;\n }\n"])), devices.mobile);
|
|
10390
|
+
var HarmonicSubtitleWithWrapper = /*#__PURE__*/styled(HarmonicSubtitle)(_templateObject5$u || (_templateObject5$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-wrap: break-word;\n margin-bottom: 16px;\n"])));
|
|
10391
|
+
var BodyCopyHarmonicWithWrapper$1 = /*#__PURE__*/styled(BodyCopyHarmonic)(_templateObject6$o || (_templateObject6$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n margin-bottom: 32px;\n whiete-space: break-spaces;\n overflow-wrap: break-word;\n\n a {\n text-decoration: underline;\n cursor: pointer;\n\n &[href^='tel:'] {\n text-decoration: none;\n }\n\n &:link {\n color: var(--color-primary-black);\n }\n\n &:visited {\n color: var(--color-base-dark-grey);\n }\n\n &:hover {\n color: var(--color-primary-red);\n }\n }\n @media ", " {\n margin-bottom: 24px;\n }\n"])), devices.mobile);
|
|
10392
|
+
var ButtonsContainer$3 = /*#__PURE__*/styled.div(_templateObject7$i || (_templateObject7$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n gap: 16px;\n margin-top: 32px;\n\n ", "\n\n @media ", " {\n gap: 24px;\n margin-top: 24px;\n flex-direction: column;\n align-items: center;\n }\n\n @media ", " {\n gap: 24px;\n margin-top: 24px;\n align-items: flex-start;\n\n ", "\n }\n"])), function (_ref5) {
|
|
10340
10393
|
var _ref5$primaryButtonTe = _ref5.primaryButtonTextLength,
|
|
10341
10394
|
primaryButtonTextLength = _ref5$primaryButtonTe === void 0 ? 0 : _ref5$primaryButtonTe,
|
|
10342
10395
|
_ref5$tertiaryButtonT = _ref5.tertiaryButtonTextLength,
|
|
@@ -10524,12 +10577,12 @@ var PromoWithTitle = function PromoWithTitle(_ref) {
|
|
|
10524
10577
|
}, children), /*#__PURE__*/React__default.createElement(PromoWithTitleContentWrapper, {
|
|
10525
10578
|
"data-testid": "content-wrapper",
|
|
10526
10579
|
imageToLeft: imageToLeft
|
|
10527
|
-
}, /*#__PURE__*/React__default.createElement(HarmonicHeaderWithWrapper
|
|
10580
|
+
}, /*#__PURE__*/React__default.createElement(HarmonicHeaderWithWrapper, {
|
|
10528
10581
|
size: titleSize,
|
|
10529
10582
|
hierarchy: titleHierarchy
|
|
10530
|
-
}, title), subtitle ? /*#__PURE__*/React__default.createElement(HarmonicSubtitleWithWrapper
|
|
10583
|
+
}, title), subtitle ? /*#__PURE__*/React__default.createElement(HarmonicSubtitleWithWrapper, {
|
|
10531
10584
|
size: "medium"
|
|
10532
|
-
}, subtitle) : null, /*#__PURE__*/React__default.createElement(BodyCopyHarmonicWithWrapper$
|
|
10585
|
+
}, subtitle) : null, /*#__PURE__*/React__default.createElement(BodyCopyHarmonicWithWrapper$1, {
|
|
10533
10586
|
size: "large",
|
|
10534
10587
|
dangerouslySetInnerHTML: {
|
|
10535
10588
|
__html: text
|
|
@@ -10597,9 +10650,9 @@ var RadioGroup = function RadioGroup(_ref) {
|
|
|
10597
10650
|
})));
|
|
10598
10651
|
};
|
|
10599
10652
|
|
|
10600
|
-
var _templateObject$1b, _templateObject2$
|
|
10653
|
+
var _templateObject$1b, _templateObject2$W, _templateObject3$J;
|
|
10601
10654
|
var Container$3 = /*#__PURE__*/styled.div(_templateObject$1b || (_templateObject$1b = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
10602
|
-
var RadioGroup$1 = /*#__PURE__*/styled.div(_templateObject2$
|
|
10655
|
+
var RadioGroup$1 = /*#__PURE__*/styled.div(_templateObject2$W || (_templateObject2$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: flex-start;\n justify-content: flex-start;\n flex-direction: ", ";\n gap: ", ";\n"])), function (_ref) {
|
|
10603
10656
|
var horizontalMode = _ref.horizontalMode;
|
|
10604
10657
|
if (horizontalMode) return 'row';
|
|
10605
10658
|
return 'column';
|
|
@@ -10684,9 +10737,9 @@ var RadioGroup2 = function RadioGroup2(_ref) {
|
|
|
10684
10737
|
}, error))));
|
|
10685
10738
|
};
|
|
10686
10739
|
|
|
10687
|
-
var _templateObject$1c, _templateObject2$
|
|
10740
|
+
var _templateObject$1c, _templateObject2$X, _templateObject3$K;
|
|
10688
10741
|
var StatusBannerWrapper = /*#__PURE__*/styled.div(_templateObject$1c || (_templateObject$1c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 26px 150px;\n display: flex;\n justify-content: space-between;\n background-color: var(--base-color-light-grey);\n transition: transform 0.3s ease;\n transform-origin: top;\n\n @media ", " {\n padding: 20px 20px;\n }\n\n @media ", " {\n padding: 20px 50px;\n }\n\n &.closing {\n transform: scaleY(0);\n }\n"])), devices.mobile, devices.tablet);
|
|
10689
|
-
var ContentContainer$3 = /*#__PURE__*/styled.div(_templateObject2$
|
|
10742
|
+
var ContentContainer$3 = /*#__PURE__*/styled.div(_templateObject2$X || (_templateObject2$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.3s ease-in-out;\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n"])));
|
|
10690
10743
|
var SvgContainer$3 = /*#__PURE__*/styled.div(_templateObject3$K || (_templateObject3$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n align-items: end;\n\n svg {\n width: var(--navigation-large-gap);\n height: var(--navigation-large-gap);\n padding-left: 50px;\n }\n\n cursor: pointer;\n\n @media ", " {\n padding-left: 20px;\n }\n"])), devices.mobile);
|
|
10691
10744
|
|
|
10692
10745
|
/* eslint-disable react/no-danger */
|
|
@@ -10744,49 +10797,35 @@ var StatusBanner = function StatusBanner(_ref) {
|
|
|
10744
10797
|
};
|
|
10745
10798
|
|
|
10746
10799
|
var _templateObject$1d;
|
|
10747
|
-
var SectionTitleWrapper = /*#__PURE__*/styled.div(_templateObject$1d || (_templateObject$1d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 30px 0;\n\n & > div {\n row-gap: 0;\n }\n\n & h1,\n & h2 {\n margin: 16px 0;\n white-space: pre-wrap;\n }\n\n @media ", " {\n & h1,\n & h2 {\n margin: 12px 0;\n }\n }\n\n & div {\n margin-block-start: 0;\n }\n"])), devices.mobile);
|
|
10748
|
-
|
|
10749
|
-
/* ~~~~~~~ new harmonic types ~~~~~~~ */
|
|
10750
|
-
var HarmonicSize = {
|
|
10751
|
-
Small: 'small',
|
|
10752
|
-
Medium: 'medium',
|
|
10753
|
-
Large: 'large'
|
|
10754
|
-
};
|
|
10755
|
-
var HeaderHierarchy = {
|
|
10756
|
-
H1: 'h1',
|
|
10757
|
-
H2: 'h2',
|
|
10758
|
-
H3: 'h3'
|
|
10759
|
-
};
|
|
10800
|
+
var SectionTitleWrapper = /*#__PURE__*/styled.div(_templateObject$1d || (_templateObject$1d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 30px 0;\n\n & > div {\n row-gap: 0;\n }\n\n & h1,\n & h2 {\n margin: 16px 0;\n white-space: pre-wrap;\n }\n\n @media ", " {\n & h1,\n & h2 {\n margin: 12px 0;\n }\n }\n\n & div {\n font-size: var(--font-size-title-description);\n line-height: var(--line-height-title-description);\n margin-block-start: 0;\n }\n"])), devices.mobile);
|
|
10760
10801
|
|
|
10761
10802
|
var SectionTitle = function SectionTitle(_ref) {
|
|
10762
10803
|
var title = _ref.title,
|
|
10763
10804
|
_ref$size = _ref.size,
|
|
10764
10805
|
size = _ref$size === void 0 ? 'small' : _ref$size,
|
|
10765
10806
|
description = _ref.description,
|
|
10766
|
-
|
|
10767
|
-
var headingLevel = size === 'large' ?
|
|
10768
|
-
|
|
10769
|
-
return /*#__PURE__*/React__default.createElement(SectionTitleWrapper, {
|
|
10770
|
-
className: className
|
|
10771
|
-
}, /*#__PURE__*/React__default.createElement(Grid, null, /*#__PURE__*/React__default.createElement(GridItem, {
|
|
10807
|
+
semanticLevel = _ref.semanticLevel;
|
|
10808
|
+
var headingLevel = size === 'large' ? 1 : 2;
|
|
10809
|
+
return /*#__PURE__*/React__default.createElement(SectionTitleWrapper, null, /*#__PURE__*/React__default.createElement(Grid, null, /*#__PURE__*/React__default.createElement(GridItem, {
|
|
10772
10810
|
columnStartDesktop: 3,
|
|
10773
10811
|
columnSpanDesktop: 12,
|
|
10774
10812
|
columnStartDevice: 2,
|
|
10775
10813
|
columnSpanDevice: 12
|
|
10776
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
10777
|
-
|
|
10778
|
-
|
|
10814
|
+
}, /*#__PURE__*/React__default.createElement(Header, {
|
|
10815
|
+
level: headingLevel,
|
|
10816
|
+
semanticLevel: semanticLevel != null ? semanticLevel : headingLevel
|
|
10779
10817
|
}, title)), description && (/*#__PURE__*/React__default.createElement(GridItem, {
|
|
10780
10818
|
columnStartDesktop: 3,
|
|
10781
10819
|
columnSpanDesktop: 8,
|
|
10782
10820
|
columnStartDevice: 2,
|
|
10783
10821
|
columnSpanDevice: 12
|
|
10784
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
10785
|
-
|
|
10822
|
+
}, /*#__PURE__*/React__default.createElement(BodyText, {
|
|
10823
|
+
level: 1,
|
|
10824
|
+
tag: "div"
|
|
10786
10825
|
}, description)))));
|
|
10787
10826
|
};
|
|
10788
10827
|
|
|
10789
|
-
var _templateObject$1e, _templateObject2$
|
|
10828
|
+
var _templateObject$1e, _templateObject2$Y, _templateObject3$L, _templateObject4$B, _templateObject5$v, _templateObject6$p, _templateObject7$j, _templateObject8$e, _templateObject9$8, _templateObject0$8, _templateObject1$5;
|
|
10790
10829
|
var stateStyles = /*#__PURE__*/css(_templateObject$1e || (_templateObject$1e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n &:focus,\n &.focus {\n outline: ", ";\n }\n\n &.disabled {\n background-color: ", ";\n color: ", ";\n pointer-events: none;\n cursor: none;\n }\n"])), function (_ref) {
|
|
10791
10830
|
var theme = _ref.theme;
|
|
10792
10831
|
return "3px solid " + theme.colors.lapisLazuli;
|
|
@@ -10797,7 +10836,7 @@ var stateStyles = /*#__PURE__*/css(_templateObject$1e || (_templateObject$1e = /
|
|
|
10797
10836
|
var theme = _ref3.theme;
|
|
10798
10837
|
return theme.colors.lightgrey;
|
|
10799
10838
|
});
|
|
10800
|
-
var borderStyles = /*#__PURE__*/css(_templateObject2$
|
|
10839
|
+
var borderStyles = /*#__PURE__*/css(_templateObject2$Y || (_templateObject2$Y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-radius: 0;\n outline: 1px solid ", ";\n"])), function (_ref4) {
|
|
10801
10840
|
var theme = _ref4.theme;
|
|
10802
10841
|
return theme.colors.darkgrey;
|
|
10803
10842
|
});
|
|
@@ -10812,9 +10851,9 @@ var ArrowIcon = /*#__PURE__*/styled(Icon).attrs(function (_ref5) {
|
|
|
10812
10851
|
};
|
|
10813
10852
|
})(_templateObject5$v || (_templateObject5$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n pointer-events: none;\n\n max-width: 24px;\n max-height: 24px;\n\n svg {\n width: 24px;\n height: 24px;\n }\n"])));
|
|
10814
10853
|
var Wrapper$6 = /*#__PURE__*/styled.div(_templateObject6$p || (_templateObject6$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n height: initial;\n\n display: flex;\n flex-direction: column;\n gap: 20px;\n"])), noMarginAndPaddingStyles);
|
|
10815
|
-
var SelectWrapper = /*#__PURE__*/styled.div(_templateObject7$
|
|
10816
|
-
var Options = /*#__PURE__*/styled.div(_templateObject8$
|
|
10817
|
-
var Option = /*#__PURE__*/styled.li(_templateObject9$
|
|
10854
|
+
var SelectWrapper = /*#__PURE__*/styled.div(_templateObject7$j || (_templateObject7$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n height: inherit;\n"])), noMarginAndPaddingStyles);
|
|
10855
|
+
var Options = /*#__PURE__*/styled.div(_templateObject8$e || (_templateObject8$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n z-index: 1;\n\n ", "\n ", "\n"])), noMarginAndPaddingStyles, borderStyles);
|
|
10856
|
+
var Option = /*#__PURE__*/styled.li(_templateObject9$8 || (_templateObject9$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n ", "\n\n ", "\n"])), noMarginAndPaddingStyles, listItemStyles, function (_ref6) {
|
|
10818
10857
|
var theme = _ref6.theme,
|
|
10819
10858
|
hover = _ref6.hover;
|
|
10820
10859
|
var _theme$colors = theme.colors,
|
|
@@ -10824,7 +10863,7 @@ var Option = /*#__PURE__*/styled.li(_templateObject9$9 || (_templateObject9$9 =
|
|
|
10824
10863
|
return "\n background-color: " + lightgrey + ";\n &:hover { background-color: " + midgrey + " }\n ";
|
|
10825
10864
|
});
|
|
10826
10865
|
var selectStyles = function selectStyles(width, height) {
|
|
10827
|
-
return css(_templateObject0$
|
|
10866
|
+
return css(_templateObject0$8 || (_templateObject0$8 = _taggedTemplateLiteralLoose(["\n position: relative;\n z-index: ", ";\n\n width: ", ";\n height: ", ";\n\n * {\n width: ", ";\n }\n\n ", " {\n position: absolute;\n top: ", ";\n }\n ", " {\n height: ", ";\n }\n p {\n height: ", ";\n padding-inline: 20px;\n\n display: flex;\n align-items: center;\n }\n"])), zIndexes[3], width, height, width, Options, height, Option, height, height);
|
|
10828
10867
|
};
|
|
10829
10868
|
var SelectList = /*#__PURE__*/styled.ul(_templateObject1$5 || (_templateObject1$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n\n ", "\n ", "\n ", "\n ", "\n\n & ", " {\n position: absolute;\n\n top: 13px;\n right: 16px;\n }\n"])), function (_ref7) {
|
|
10830
10869
|
var width = _ref7.width,
|
|
@@ -11167,9 +11206,9 @@ function Select(_ref3) {
|
|
|
11167
11206
|
})))), /*#__PURE__*/React__default.createElement(ArrowIcon, null)));
|
|
11168
11207
|
}
|
|
11169
11208
|
|
|
11170
|
-
var _templateObject$1f, _templateObject2$
|
|
11209
|
+
var _templateObject$1f, _templateObject2$Z, _templateObject3$M, _templateObject4$C;
|
|
11171
11210
|
var Container$4 = /*#__PURE__*/styled.div(_templateObject$1f || (_templateObject$1f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
11172
|
-
var SelectWrapper$1 = /*#__PURE__*/styled.div(_templateObject2$
|
|
11211
|
+
var SelectWrapper$1 = /*#__PURE__*/styled.div(_templateObject2$Z || (_templateObject2$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n width: auto;\n max-width: ", ";\n\n .harmonic-select__control {\n min-height: 48px;\n border-radius: 0;\n transition: none;\n border: ", ";\n &:hover {\n border-color: ", ";\n }\n }\n .harmonic-select__control--is-focused {\n border-color: var(--base-color-dark-grey);\n box-shadow: ", ";\n }\n .harmonic-select__control--menu-is-open {\n .harmonic-select__indicator {\n svg {\n transform: rotate(180deg);\n }\n }\n }\n .harmonic-select__indicator {\n font-size: 25px;\n padding: 0;\n margin-right: 12px;\n color: var(--base-color-black);\n svg {\n height: 1em;\n width: 1em;\n color: inherit;\n path {\n fill: currentColor;\n color: inherit;\n }\n }\n }\n .harmonic-select__single-value,\n .harmonic-select__placeholder {\n margin-left: 0;\n margin-right: 0;\n font-family: var(--font-family-altHeader);\n font-feature-settings: var(--font-feature-settings-altHeader);\n font-size: var(--font-size-altHeader-6);\n font-weight: var(--font-weight-altHeader-6);\n letter-spacing: var(--letter-spacing-altHeader-6);\n line-height: var(--line-height-altHeader-6);\n text-transform: var(--text-transform-altHeader);\n }\n .harmonic-select__placeholder {\n color: var(--base-color-dark-grey);\n }\n .harmonic-select__single-value {\n color: var(--base-color-black);\n }\n .harmonic-select__value-container {\n padding-left: 20px;\n padding-right: 20px;\n padding-top: 1px;\n padding-bottom: 0px;\n }\n .harmonic-select--is-disabled {\n .harmonic-select__control {\n border: 1px solid var(--base-color-light-grey);\n background: var(--base-color-light-grey);\n }\n .harmonic-select__indicator,\n .harmonic-select__single-value {\n color: var(--base-color-dark-grey);\n }\n }\n .harmonic-select__menu {\n margin-top: -1px;\n box-shadow: none;\n border-radius: 0;\n border: 1px solid var(--base-color-dark-grey);\n background: var(--base-color-light-grey);\n }\n .harmonic-select__menu-list {\n padding-top: 0;\n padding-bottom: 0;\n }\n .harmonic-select__option {\n padding: 10px 20px;\n font-family: var(--font-family-altHeader);\n font-feature-settings: var(--font-feature-settings-altHeader);\n font-size: var(--font-size-altHeader-6);\n font-weight: var(--font-weight-altHeader-6);\n letter-spacing: var(--letter-spacing-altHeader-6);\n line-height: var(--line-height-altHeader-6);\n text-transform: var(--text-transform-altHeader);\n color: var(--base-color-black);\n &:active,\n &.harmonic-select__option--is-focused {\n background: var(--base-color-mid-grey);\n }\n }\n .harmonic-select__option--is-selected {\n color: var(--base-color-black);\n background: none;\n }\n .harmonic-select__input-container {\n margin: 0;\n padding-top: 0;\n padding-bottom: 0;\n font-family: var(--font-family-altHeader);\n font-feature-settings: var(--font-feature-settings-altHeader);\n font-size: var(--font-size-altHeader-6);\n font-weight: var(--font-weight-altHeader-6);\n letter-spacing: var(--letter-spacing-altHeader-6);\n line-height: var(--line-height-altHeader-6);\n text-transform: var(--text-transform-altHeader);\n color: var(--base-color-black);\n }\n .harmonic-select__menu-notice {\n padding: 20px 20px;\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-size: var(--font-size-body-1);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n color: var(--base-color-black);\n text-align: left;\n }\n .harmonic-select__menu-notice--loading {\n font-style: italic;\n }\n"])), function (_ref) {
|
|
11173
11212
|
var width = _ref.width;
|
|
11174
11213
|
if (!width) return 'none';
|
|
11175
11214
|
return width + "px";
|
|
@@ -11305,7 +11344,7 @@ var SelectComponent$1 = function SelectComponent(_ref) {
|
|
|
11305
11344
|
})));
|
|
11306
11345
|
};
|
|
11307
11346
|
|
|
11308
|
-
var _templateObject$1g, _templateObject2$
|
|
11347
|
+
var _templateObject$1g, _templateObject2$_;
|
|
11309
11348
|
var Wrapper$7 = /*#__PURE__*/styled.figure(_templateObject$1g || (_templateObject$1g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n height: 100%;\n width: fit-content;\n\n ", " {\n height: calc(100% - 12px - var(--line-height-body-2));\n @supports not (aspect-ratio: ", ") {\n width: ", ";\n }\n }\n"])), StyledImageAspectRatioWrapper, function (_ref) {
|
|
11310
11349
|
var _ref$aspectRatio = _ref.aspectRatio,
|
|
11311
11350
|
aspectRatio = _ref$aspectRatio === void 0 ? AspectRatio['1:1'] : _ref$aspectRatio;
|
|
@@ -11316,7 +11355,7 @@ var Wrapper$7 = /*#__PURE__*/styled.figure(_templateObject$1g || (_templateObjec
|
|
|
11316
11355
|
height = _ref2.height;
|
|
11317
11356
|
return "calc(calc(" + height + "px - 12px - var(--line-height-body-2)) * " + AspectRatioWidth[aspectRatio] + ")";
|
|
11318
11357
|
});
|
|
11319
|
-
var CaptionWrapper = /*#__PURE__*/styled.figcaption(_templateObject2$
|
|
11358
|
+
var CaptionWrapper = /*#__PURE__*/styled.figcaption(_templateObject2$_ || (_templateObject2$_ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 12px;\n height: var(--line-height-body-2);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-size: var(--font-size-body-2);\n font-weight: var(--font-weight-body-2);\n letter-spacing: var(--letter-spacing-body-2);\n line-height: var(--line-height-body-2);\n text-transform: var(--text-transform-body-2);\n word-break: var(--word-break-body-2);\n font-style: italic;\n"])));
|
|
11320
11359
|
|
|
11321
11360
|
var ImageWithCaption = function ImageWithCaption(_ref) {
|
|
11322
11361
|
var caption = _ref.caption,
|
|
@@ -11350,9 +11389,9 @@ var ImageWithCaption = function ImageWithCaption(_ref) {
|
|
|
11350
11389
|
})), caption && /*#__PURE__*/React__default.createElement(CaptionWrapper, null, caption));
|
|
11351
11390
|
};
|
|
11352
11391
|
|
|
11353
|
-
var _templateObject$1h, _templateObject2
|
|
11392
|
+
var _templateObject$1h, _templateObject2$$, _templateObject3$N;
|
|
11354
11393
|
var TextWrapper$3 = /*#__PURE__*/styled.div(_templateObject$1h || (_templateObject$1h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h4 {\n margin: 0;\n }\n"])));
|
|
11355
|
-
var AttributionWrapper = /*#__PURE__*/styled.div(_templateObject2
|
|
11394
|
+
var AttributionWrapper = /*#__PURE__*/styled.div(_templateObject2$$ || (_templateObject2$$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n"])), function (_ref) {
|
|
11356
11395
|
var displayAttribution = _ref.displayAttribution;
|
|
11357
11396
|
return "display: " + (displayAttribution ? 'block' : 'none') + ";";
|
|
11358
11397
|
});
|
|
@@ -11381,13 +11420,13 @@ var Quote = function Quote(_ref) {
|
|
|
11381
11420
|
}, attribution))));
|
|
11382
11421
|
};
|
|
11383
11422
|
|
|
11384
|
-
var _templateObject$1i, _templateObject2
|
|
11423
|
+
var _templateObject$1i, _templateObject2$10, _templateObject3$O, _templateObject4$D, _templateObject5$w, _templateObject6$q;
|
|
11385
11424
|
var CardContainer$1 = /*#__PURE__*/styled.div(_templateObject$1i || (_templateObject$1i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: pointer;\n width: 100%;\n display: grid;\n grid-template-columns: repeat(7, minmax(0, 1fr));\n gap: 15px;\n min-height: 50px;\n"])));
|
|
11386
|
-
var ContentContainer$4 = /*#__PURE__*/styled.div(_templateObject2
|
|
11425
|
+
var ContentContainer$4 = /*#__PURE__*/styled.div(_templateObject2$10 || (_templateObject2$10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n"])));
|
|
11387
11426
|
var StyledImage = /*#__PURE__*/styled.img(_templateObject3$O || (_templateObject3$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 1px solid var(--base-color-white);\n"])));
|
|
11388
11427
|
var ImageWrapper$1 = /*#__PURE__*/styled.div(_templateObject4$D || (_templateObject4$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
|
|
11389
11428
|
var IconWrapper$3 = /*#__PURE__*/styled.div(_templateObject5$w || (_templateObject5$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background: rgba(0, 0, 0, 0.4);\n position: absolute;\n top: 0;\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n span {\n width: 40px;\n height: 40px;\n @media ", " {\n width: 24px;\n height: 24px;\n }\n @media ", " {\n width: 18px;\n height: 18px;\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
11390
|
-
var TitleWrapper$
|
|
11429
|
+
var TitleWrapper$4 = /*#__PURE__*/styled.div(_templateObject6$q || (_templateObject6$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 8px;\n div {\n @media ", " {\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n"])), devices.mobile);
|
|
11391
11430
|
|
|
11392
11431
|
var MiniCard = function MiniCard(_ref) {
|
|
11393
11432
|
var _ref$title = _ref.title,
|
|
@@ -11420,14 +11459,14 @@ var MiniCard = function MiniCard(_ref) {
|
|
|
11420
11459
|
columnSpanDesktop: 4
|
|
11421
11460
|
}, /*#__PURE__*/React__default.createElement(ContentContainer$4, null, /*#__PURE__*/React__default.createElement(Overline, {
|
|
11422
11461
|
level: 4
|
|
11423
|
-
}, subtitle), /*#__PURE__*/React__default.createElement(TitleWrapper$
|
|
11462
|
+
}, subtitle), /*#__PURE__*/React__default.createElement(TitleWrapper$4, null, /*#__PURE__*/React__default.createElement(Overline, {
|
|
11424
11463
|
level: 2
|
|
11425
11464
|
}, title)))));
|
|
11426
11465
|
};
|
|
11427
11466
|
|
|
11428
|
-
var _templateObject$1j, _templateObject2$
|
|
11467
|
+
var _templateObject$1j, _templateObject2$11, _templateObject3$P, _templateObject4$E, _templateObject5$x;
|
|
11429
11468
|
var ReadMoreContainer = /*#__PURE__*/styled.div(_templateObject$1j || (_templateObject$1j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n margin: 0px 0px 12px 0px !important;\n }\n width: 100%;\n"])));
|
|
11430
|
-
var LinkContainer = /*#__PURE__*/styled.div(_templateObject2$
|
|
11469
|
+
var LinkContainer = /*#__PURE__*/styled.div(_templateObject2$11 || (_templateObject2$11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-top: 24px;\n gap: 8px;\n\n :hover {\n cursor: pointer;\n }\n\n @media print {\n visibility: hidden;\n }\n"])));
|
|
11431
11470
|
var FullTextContainer = /*#__PURE__*/styled.div(_templateObject3$P || (_templateObject3$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n visibility: ", ";\n\n @media print {\n visibility: visible;\n }\n"])), function (_ref) {
|
|
11432
11471
|
var isVisible = _ref.isVisible;
|
|
11433
11472
|
return isVisible ? 'visible' : 'hidden';
|
|
@@ -11517,9 +11556,9 @@ var ReadMore = function ReadMore(_ref) {
|
|
|
11517
11556
|
}, isFullTextOpen ? "" + hideText : "" + showMoreText))));
|
|
11518
11557
|
};
|
|
11519
11558
|
|
|
11520
|
-
var _templateObject$1k, _templateObject2$
|
|
11559
|
+
var _templateObject$1k, _templateObject2$12, _templateObject3$Q, _templateObject4$F, _templateObject5$y;
|
|
11521
11560
|
var MenuContainer$2 = /*#__PURE__*/styled.nav(_templateObject$1k || (_templateObject$1k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding: 0;\n margin: 0;\n"])));
|
|
11522
|
-
var MenuList = /*#__PURE__*/styled.ul(_templateObject2$
|
|
11561
|
+
var MenuList = /*#__PURE__*/styled.ul(_templateObject2$12 || (_templateObject2$12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n list-style: none;\n border-right: 1px solid var(--base-color-", ");\n li {\n margin-left: -5px;\n }\n"])), Colors.LightGrey);
|
|
11523
11562
|
var MobileButton = /*#__PURE__*/styled.button(_templateObject3$Q || (_templateObject3$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n line-height: var(--line-height-navigation);\n font-size: var(--font-size-navigation);\n font-family: var(--font-family-navigation);\n font-weight: var(--font-weight-navigation);\n letter-spacing: var(--letter-spacing-navigation);\n color: var(--base-color-", ");\n text-transform: uppercase;\n margin: 0;\n padding: 16px 46px 14px 20px;\n background: var(--base-color-", ");\n border: 1px solid var(--base-color-", ");\n border-radius: 0;\n display: block;\n width: 100%;\n text-align: left;\n cursor: pointer;\n position: relative;\n span {\n width: 25px;\n height: 25px;\n position: absolute;\n top: 50%;\n margin-top: -12px;\n right: 10px;\n }\n"])), Colors.Black, Colors.White, Colors.DarkGrey);
|
|
11524
11563
|
var MenuItem$1 = /*#__PURE__*/styled.a(_templateObject4$F || (_templateObject4$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n line-height: var(--line-height-navigation);\n font-size: var(--font-size-navigation);\n font-family: var(--font-family-navigation);\n font-weight: var(--font-weight-navigation);\n letter-spacing: var(--letter-spacing-navigation);\n color: var(--base-color-", ");\n text-transform: uppercase;\n text-decoration: none;\n margin: 0;\n padding: 16px 20px 15px 5px;\n display: block;\n background: ", ";\n cursor: pointer;\n &:hover {\n background: var(--base-color-", ");\n }\n"])), Colors.Black, function (_ref) {
|
|
11525
11564
|
var isActive = _ref.isActive;
|
|
@@ -11681,9 +11720,9 @@ var AuxiliaryNav = function AuxiliaryNav(_ref6) {
|
|
|
11681
11720
|
});
|
|
11682
11721
|
};
|
|
11683
11722
|
|
|
11684
|
-
var _templateObject$1l, _templateObject2$
|
|
11723
|
+
var _templateObject$1l, _templateObject2$13, _templateObject3$R, _templateObject4$G, _templateObject5$z, _templateObject6$r;
|
|
11685
11724
|
var Container$5 = /*#__PURE__*/styled.div(_templateObject$1l || (_templateObject$1l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 10px;\n"])));
|
|
11686
|
-
var Sections = /*#__PURE__*/styled.div(_templateObject2$
|
|
11725
|
+
var Sections = /*#__PURE__*/styled.div(_templateObject2$13 || (_templateObject2$13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n gap: 8px;\n"])));
|
|
11687
11726
|
var Section = /*#__PURE__*/styled.div(_templateObject3$R || (_templateObject3$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 1;\n height: 2px;\n background-color: ", ";\n"])), function (_ref) {
|
|
11688
11727
|
var color = _ref.color;
|
|
11689
11728
|
return "var(--base-color-" + color + ")";
|
|
@@ -11775,19 +11814,19 @@ var PasswordStrength = function PasswordStrength(_ref) {
|
|
|
11775
11814
|
}, strengthLabel))));
|
|
11776
11815
|
};
|
|
11777
11816
|
|
|
11778
|
-
var _templateObject$1m, _templateObject2$
|
|
11817
|
+
var _templateObject$1m, _templateObject2$14, _templateObject3$S, _templateObject4$H, _templateObject5$A, _templateObject6$s, _templateObject7$k, _templateObject8$f;
|
|
11779
11818
|
var TableContainer = /*#__PURE__*/styled.table(_templateObject$1m || (_templateObject$1m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-collapse: collapse;\n"])));
|
|
11780
|
-
var Container$6 = /*#__PURE__*/styled.div(_templateObject2$
|
|
11819
|
+
var Container$6 = /*#__PURE__*/styled.div(_templateObject2$14 || (_templateObject2$14 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-x: auto;\n"])));
|
|
11781
11820
|
var Wrapper$8 = /*#__PURE__*/styled.div(_templateObject3$S || (_templateObject3$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n"])));
|
|
11782
|
-
var TableHeader = /*#__PURE__*/styled.th(_templateObject4$H || (_templateObject4$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 12px;\n text-align: left;\n text-transform:
|
|
11821
|
+
var TableHeader = /*#__PURE__*/styled.th(_templateObject4$H || (_templateObject4$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 12px;\n text-align: left;\n text-transform: uppercase;\n border: 1px solid var(--color-primary-black);\n\n &:last-child {\n white-space: nowrap;\n width: auto;\n }\n\n &:not(:last-child) {\n width: ", ";\n }\n\n @media ", " {\n &:last-child {\n white-space: nowrap;\n }\n }\n\n @media ", " {\n min-width: 150px;\n\n &:last-child {\n white-space: normal;\n }\n }\n"])), function (props) {
|
|
11783
11822
|
return "calc(100% / " + (props.columns - 1) + ")";
|
|
11784
11823
|
}, devices.tablet, devices.mobile);
|
|
11785
11824
|
var TableCell = /*#__PURE__*/styled.td(_templateObject5$A || (_templateObject5$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 12px;\n text-align: left;\n vertical-align: middle;\n border: 1px solid var(--color-primary-black);\n\n &:last-child {\n width: auto;\n }\n\n &:not(:last-child) {\n width: ", ";\n }\n\n > span > svg {\n width: 24px;\n height: 24px;\n }\n\n @media ", " {\n min-width: 150px;\n }\n"])), function (props) {
|
|
11786
11825
|
return "calc(100% / " + (props.columns - 1) + ")";
|
|
11787
11826
|
}, devices.mobile);
|
|
11788
11827
|
var PaginationWrapper = /*#__PURE__*/styled(Pagination)(_templateObject6$s || (_templateObject6$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-top: 40px;\n padding-bottom: 80px;\n\n @media ", " {\n padding-top: 24px;\n padding-bottom: 60px;\n }\n"])), devices.mobile);
|
|
11789
|
-
var ScrollButtons = /*#__PURE__*/styled.div(_templateObject7$
|
|
11790
|
-
var AriaDescription$2 = /*#__PURE__*/styled.span(_templateObject8$
|
|
11828
|
+
var ScrollButtons = /*#__PURE__*/styled.div(_templateObject7$k || (_templateObject7$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: flex-end;\n padding: 60px 0 24px 0;\n\n div:hover {\n background-color: var(--color-base-light-grey);\n }\n\n > div > div {\n background-color: var(--color-base-light-grey);\n }\n\n svg path {\n fill: var(--color-base-black) !important;\n }\n"])));
|
|
11829
|
+
var AriaDescription$2 = /*#__PURE__*/styled.span(_templateObject8$f || (_templateObject8$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n left: -9999px;\n width: 1px;\n height: 1px;\n overflow: hidden;\n"])));
|
|
11791
11830
|
|
|
11792
11831
|
/* eslint-disable react/no-danger */
|
|
11793
11832
|
var Content = function Content(_ref) {
|
|
@@ -11890,53 +11929,20 @@ var Table = function Table(_ref) {
|
|
|
11890
11929
|
var _useState2 = useState(false),
|
|
11891
11930
|
showScrollButtons = _useState2[0],
|
|
11892
11931
|
setShowScrollButtons = _useState2[1];
|
|
11893
|
-
var tableRef = useRef(null);
|
|
11894
|
-
var _useState3 = useState(true),
|
|
11895
|
-
atStart = _useState3[0],
|
|
11896
|
-
setAtStart = _useState3[1];
|
|
11897
|
-
var _useState4 = useState(false),
|
|
11898
|
-
atEnd = _useState4[0],
|
|
11899
|
-
setAtEnd = _useState4[1];
|
|
11900
|
-
var checkScrollPosition = function checkScrollPosition() {
|
|
11901
|
-
if (tableRef.current) {
|
|
11902
|
-
var _tableRef$current = tableRef.current,
|
|
11903
|
-
scrollLeft = _tableRef$current.scrollLeft,
|
|
11904
|
-
scrollWidth = _tableRef$current.scrollWidth,
|
|
11905
|
-
clientWidth = _tableRef$current.clientWidth;
|
|
11906
|
-
setAtStart(scrollLeft === 0);
|
|
11907
|
-
setAtEnd(scrollLeft + clientWidth >= scrollWidth);
|
|
11908
|
-
}
|
|
11909
|
-
};
|
|
11910
|
-
var handleNext = function handleNext() {
|
|
11911
|
-
scrollTable(tableRef, 'right');
|
|
11912
|
-
};
|
|
11913
|
-
var handlePrev = function handlePrev() {
|
|
11914
|
-
scrollTable(tableRef, 'left');
|
|
11915
|
-
};
|
|
11916
11932
|
var handlePageChange = function handlePageChange(page) {
|
|
11917
11933
|
setCurrentPage(page - 1);
|
|
11918
11934
|
};
|
|
11935
|
+
var tableRef = useRef(null);
|
|
11919
11936
|
useLayoutEffect(function () {
|
|
11920
11937
|
var horizontalScroll = function horizontalScroll() {
|
|
11921
11938
|
if (tableRef.current) {
|
|
11922
11939
|
setShowScrollButtons(tableRef.current.scrollWidth > tableRef.current.clientWidth);
|
|
11923
|
-
checkScrollPosition();
|
|
11924
11940
|
}
|
|
11925
11941
|
};
|
|
11926
|
-
var handleScroll = function handleScroll() {
|
|
11927
|
-
checkScrollPosition();
|
|
11928
|
-
};
|
|
11929
11942
|
horizontalScroll();
|
|
11930
11943
|
window.addEventListener('resize', horizontalScroll);
|
|
11931
|
-
var table = tableRef.current;
|
|
11932
|
-
if (table) {
|
|
11933
|
-
table.addEventListener('scroll', handleScroll);
|
|
11934
|
-
}
|
|
11935
11944
|
return function () {
|
|
11936
|
-
window.removeEventListener('resize', horizontalScroll);
|
|
11937
|
-
if (table) {
|
|
11938
|
-
table.removeEventListener('scroll', handleScroll);
|
|
11939
|
-
}
|
|
11945
|
+
return window.removeEventListener('resize', horizontalScroll);
|
|
11940
11946
|
};
|
|
11941
11947
|
}, []);
|
|
11942
11948
|
var totalRows = Array.isArray(children) ? children.length : 1;
|
|
@@ -11963,10 +11969,12 @@ var Table = function Table(_ref) {
|
|
|
11963
11969
|
return /*#__PURE__*/React__default.createElement(Wrapper$8, {
|
|
11964
11970
|
className: className
|
|
11965
11971
|
}, showScrollButtons && (/*#__PURE__*/React__default.createElement(ScrollButtons, null, /*#__PURE__*/React__default.createElement(RotatorButtons, {
|
|
11966
|
-
onClickPrev:
|
|
11967
|
-
|
|
11968
|
-
|
|
11969
|
-
|
|
11972
|
+
onClickPrev: function onClickPrev() {
|
|
11973
|
+
return scrollTable(tableRef, 'left');
|
|
11974
|
+
},
|
|
11975
|
+
onClickNext: function onClickNext() {
|
|
11976
|
+
return scrollTable(tableRef, 'right');
|
|
11977
|
+
}
|
|
11970
11978
|
}))), /*#__PURE__*/React__default.createElement(Container$6, {
|
|
11971
11979
|
role: "table",
|
|
11972
11980
|
tabIndex: 0,
|
|
@@ -11990,7 +11998,7 @@ var Table = function Table(_ref) {
|
|
|
11990
11998
|
}))));
|
|
11991
11999
|
};
|
|
11992
12000
|
|
|
11993
|
-
var _templateObject$1n, _templateObject2$
|
|
12001
|
+
var _templateObject$1n, _templateObject2$15, _templateObject3$T, _templateObject4$I, _templateObject5$B, _templateObject6$t, _templateObject7$l, _templateObject8$g, _templateObject9$9, _templateObject0$9, _templateObject1$6, _templateObject10$4, _templateObject11$4, _templateObject12$4, _templateObject13$3;
|
|
11994
12002
|
var Wrapper$9 = /*#__PURE__*/styled('div')(_templateObject$1n || (_templateObject$1n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n border-top: 4px solid ", ";\n border-bottom: 4px solid ", ";\n"])), function (_ref) {
|
|
11995
12003
|
var theme = _ref.theme;
|
|
11996
12004
|
return "var(--color-" + theme + ")";
|
|
@@ -11998,15 +12006,15 @@ var Wrapper$9 = /*#__PURE__*/styled('div')(_templateObject$1n || (_templateObjec
|
|
|
11998
12006
|
var theme = _ref2.theme;
|
|
11999
12007
|
return "var(--color-" + theme + ")";
|
|
12000
12008
|
});
|
|
12001
|
-
var SignUpFormWrapper = /*#__PURE__*/styled(Grid)(_templateObject2$
|
|
12009
|
+
var SignUpFormWrapper = /*#__PURE__*/styled(Grid)(_templateObject2$15 || (_templateObject2$15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 0 var(--grid-column-gap);\n margin-bottom: 32px;\n\n @media ", " {\n margin-bottom: 30px;\n }\n"])), devices.mobile);
|
|
12002
12010
|
var SignUpTitleWrapper = /*#__PURE__*/styled('div')(_templateObject3$T || (_templateObject3$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-align: left;\n position: relative;\n top: -25px;\n left: -20px;\n height: 52px;\n background: var(--color-base-white);\n display: inline-block;\n padding: 0 20px;\n\n @media ", " {\n top: -18px;\n height: 37px;\n padding: 0 13px;\n left: -13px;\n }\n"])), devices.mobile);
|
|
12003
|
-
var Error = /*#__PURE__*/styled.div(_templateObject4$I || (_templateObject4$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 20px;\n color: var(--color-base-errorstate);\n\n a {\n text-decoration: underline;\n color: inherit;\n }\n"])));
|
|
12004
|
-
var Form = /*#__PURE__*/styled.form(_templateObject5$B || (_templateObject5$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 32px;\n align-items: center;\n ", " {\n margin-top: -20px;\n }\n a[href] {\n color: inherit;\n }\n"])), Error);
|
|
12011
|
+
var Error$1 = /*#__PURE__*/styled.div(_templateObject4$I || (_templateObject4$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 20px;\n color: var(--color-base-errorstate);\n\n a {\n text-decoration: underline;\n color: inherit;\n }\n"])));
|
|
12012
|
+
var Form = /*#__PURE__*/styled.form(_templateObject5$B || (_templateObject5$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 32px;\n align-items: center;\n ", " {\n margin-top: -20px;\n }\n a[href] {\n color: inherit;\n }\n"])), Error$1);
|
|
12005
12013
|
var FormFooterWrapper = /*#__PURE__*/styled.div(_templateObject6$t || (_templateObject6$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 32px;\n display: flex;\n gap: 28px;\n align-items: center;\n\n @media ", " {\n flex-direction: column;\n align-items: flex-start;\n }\n"])), devices.mobile);
|
|
12006
|
-
var ServerError = /*#__PURE__*/styled.div(_templateObject7$
|
|
12007
|
-
var CTALinkWrapper = /*#__PURE__*/styled.a(_templateObject8$
|
|
12008
|
-
var ButtonWrapper$3 = /*#__PURE__*/styled.div(_templateObject9$
|
|
12009
|
-
var FieldsWrapper = /*#__PURE__*/styled.div(_templateObject0$
|
|
12014
|
+
var ServerError = /*#__PURE__*/styled.div(_templateObject7$l || (_templateObject7$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-align: left;\n color: var(--color-base-errorstate);\n"])));
|
|
12015
|
+
var CTALinkWrapper = /*#__PURE__*/styled.a(_templateObject8$g || (_templateObject8$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-decoration: none;\n\n @media ", " {\n text-decoration: underline;\n }\n"])), devices.mobile);
|
|
12016
|
+
var ButtonWrapper$3 = /*#__PURE__*/styled.div(_templateObject9$9 || (_templateObject9$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n all: unset;\n width: fit-content;\n color: var(--base-color-white);\n text-decoration: none;\n\n @media ", " {\n width: 100%;\n }\n"])), devices.mobile);
|
|
12017
|
+
var FieldsWrapper = /*#__PURE__*/styled.div(_templateObject0$9 || (_templateObject0$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: 36px;\n\n @media ", " {\n grid-template-columns: 1fr;\n gap: 20px;\n }\n"])), devices.mobile);
|
|
12010
12018
|
var MessageWrapper$1 = /*#__PURE__*/styled.div(_templateObject1$6 || (_templateObject1$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n div > p {\n margin: 0;\n }\n"])));
|
|
12011
12019
|
var DropdownAreaWrapper = /*#__PURE__*/styled.div(_templateObject10$4 || (_templateObject10$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: 1 / -1;\n display: grid;\n grid-template-columns: var(--grid-template-columns);\n gap: var(--grid-column-gap);\n cursor: pointer;\n"])));
|
|
12012
12020
|
var DropdownWrapper = /*#__PURE__*/styled.div(_templateObject11$4 || (_templateObject11$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n width: fit-content;\n transform: rotate(", ");\n .dropdown-icon > div {\n border-bottom: none;\n color: var(--color-base-black);\n margin: 0;\n }\n"])), function (_ref3) {
|
|
@@ -12182,18 +12190,18 @@ var SignUpForm = function SignUpForm(_ref) {
|
|
|
12182
12190
|
};
|
|
12183
12191
|
};
|
|
12184
12192
|
var handleFormSubmit = /*#__PURE__*/function () {
|
|
12185
|
-
var _ref2 = _asyncToGenerator(/*#__PURE__*/
|
|
12193
|
+
var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee(e) {
|
|
12186
12194
|
var formErrors, response;
|
|
12187
|
-
return
|
|
12188
|
-
while (1) switch (_context.
|
|
12195
|
+
return _regeneratorRuntime().wrap(function _callee$(_context) {
|
|
12196
|
+
while (1) switch (_context.prev = _context.next) {
|
|
12189
12197
|
case 0:
|
|
12190
12198
|
e.preventDefault();
|
|
12191
12199
|
if (!isSuccess) {
|
|
12192
|
-
_context.
|
|
12200
|
+
_context.next = 3;
|
|
12193
12201
|
break;
|
|
12194
12202
|
}
|
|
12195
|
-
return _context.
|
|
12196
|
-
case
|
|
12203
|
+
return _context.abrupt("return");
|
|
12204
|
+
case 3:
|
|
12197
12205
|
formErrors = {};
|
|
12198
12206
|
if (!isLoggedIn) {
|
|
12199
12207
|
if (!formValues.firstName) {
|
|
@@ -12211,16 +12219,16 @@ var SignUpForm = function SignUpForm(_ref) {
|
|
|
12211
12219
|
}
|
|
12212
12220
|
}
|
|
12213
12221
|
if (!(Object.keys(formErrors).length > 0)) {
|
|
12214
|
-
_context.
|
|
12222
|
+
_context.next = 8;
|
|
12215
12223
|
break;
|
|
12216
12224
|
}
|
|
12217
12225
|
setErrors(formErrors);
|
|
12218
|
-
return _context.
|
|
12219
|
-
case
|
|
12220
|
-
_context.
|
|
12226
|
+
return _context.abrupt("return");
|
|
12227
|
+
case 8:
|
|
12228
|
+
_context.next = 10;
|
|
12221
12229
|
return submitHandler(isLoggedIn ? {} : formValues);
|
|
12222
|
-
case
|
|
12223
|
-
response = _context.
|
|
12230
|
+
case 10:
|
|
12231
|
+
response = _context.sent;
|
|
12224
12232
|
if (response.success) {
|
|
12225
12233
|
setIsSuccess(true);
|
|
12226
12234
|
} else {
|
|
@@ -12230,8 +12238,9 @@ var SignUpForm = function SignUpForm(_ref) {
|
|
|
12230
12238
|
});
|
|
12231
12239
|
});
|
|
12232
12240
|
}
|
|
12233
|
-
case
|
|
12234
|
-
|
|
12241
|
+
case 12:
|
|
12242
|
+
case "end":
|
|
12243
|
+
return _context.stop();
|
|
12235
12244
|
}
|
|
12236
12245
|
}, _callee);
|
|
12237
12246
|
}));
|
|
@@ -12413,10 +12422,10 @@ var SignUpFormComponent = function SignUpFormComponent(_ref) {
|
|
|
12413
12422
|
}))))));
|
|
12414
12423
|
};
|
|
12415
12424
|
|
|
12416
|
-
var _templateObject$1o, _templateObject2$
|
|
12425
|
+
var _templateObject$1o, _templateObject2$16, _templateObject4$J, _templateObject5$C;
|
|
12417
12426
|
var AnchorBarContainer = /*#__PURE__*/styled(Grid)(_templateObject$1o || (_templateObject$1o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: sticky;\n top: 0;\n min-height: 70px;\n background: var(--color-base-white);\n z-index: ", ";\n align-content: center;\n border-bottom: 1px solid var(--color-base-light-grey);\n\n ", "\n\n @media ", " {\n min-height: 60px;\n }\n"])), zIndexes.anchor, function (_ref) {
|
|
12418
12427
|
var withShadow = _ref.withShadow;
|
|
12419
|
-
return withShadow && css(_templateObject2$
|
|
12428
|
+
return withShadow && css(_templateObject2$16 || (_templateObject2$16 = _taggedTemplateLiteralLoose(["\n box-shadow: var(--shadow-floating);\n "])));
|
|
12420
12429
|
}, devices.mobile);
|
|
12421
12430
|
var CloseButtonWrapper = /*#__PURE__*/styled.a(_templateObject4$J || (_templateObject4$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-decoration: none;\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 24px;\n min-width: 24px;\n max-height: 24px;\n max-width: 24px;\n border: none;\n padding: 0;\n background: none;\n\n :hover {\n cursor: pointer;\n }\n\n @media ", " {\n min-height: 12px;\n min-width: 12px;\n max-height: 12px;\n max-width: 12px;\n }\n"])), devices.mobile);
|
|
12422
12431
|
var ContentWrapper$3 = /*#__PURE__*/styled.a(_templateObject5$C || (_templateObject5$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n"])));
|
|
@@ -12628,6 +12637,64 @@ var HighlightsCarousel = function HighlightsCarousel(_ref) {
|
|
|
12628
12637
|
})));
|
|
12629
12638
|
};
|
|
12630
12639
|
|
|
12640
|
+
var css_248z$1 = "@font-face {\n font-family: 'GreyLLTT';\n src: url('https://static.roh.org.uk/fonts/harmonic/GreyLLTT-Regular.woff2') format('woff2');\n font-weight: 400;\n font-style: normal;\n font-display: swap;\n}\n\n@font-face {\n font-family: 'GreyLLTT';\n src: url('https://static.roh.org.uk/fonts/harmonic/GreyLLTT-Medium.woff2') format('woff2');\n font-weight: 500;\n font-style: normal;\n font-display: swap;\n}\n\n@font-face {\n font-family: 'GreyLLTT';\n src: url('https://static.roh.org.uk/fonts/harmonic/GreyLLTT-Bold.woff2') format('woff2');\n font-weight: 700;\n font-style: normal;\n font-display: swap;\n}\n\n@font-face {\n font-family: 'VictorSerif';\n src: url('https://static.roh.org.uk/fonts/harmonic/VictorSerif-Medium.woff2')\n format('woff2');\n font-weight: 500;\n font-style: normal;\n font-display: swap;\n}\n\n@font-face {\n font-family: 'VictorSerif';\n src: url('https://static.roh.org.uk/fonts/harmonic/VictorSerif-MediumItalic.woff2')\n format('woff2');\n font-weight: 500;\n font-style: italic;\n font-display: swap;\n}\n";
|
|
12641
|
+
styleInject(css_248z$1);
|
|
12642
|
+
|
|
12643
|
+
var css_248z$2 = ".core-theme-module_coreTheme__pWxYB {\n /* RBO Red */\n /* Primary Palette */\n --color-primary: #1a1a1a;\n --color-primary-background: #eb0a0a;\n --color-primary-red: #eb0a0a;\n --color-primary-black: #1a1a1a;\n\n /* Base Colours */\n --color-base-white: #ffffff;\n --color-base-black: #000000;\n --color-base-dark-grey: #4c4f53;\n --color-base-mid-grey: #72767c;\n --color-base-light-grey: #e9e9e9;\n --color-base-transparent: transparent;\n\n /* States */\n --color-state-error: #cc071e;\n --color-state-medium: #ffce45;\n --color-state-good: #2a874a;\n --color-state-focused: #1e1da0;\n --color-state-disabled: #b3b3b3;\n\n /* RBO Red (Core) */\n --color-rbo-red-hovered: #c40808;\n --color-rbo-red-pressed: #9d0707;\n\n /* RBO Black */\n --color-rbo-black-hovered: #575757;\n --color-rbo-black-pressed: #353535;\n\n /* Black */\n --color-black-hovered: #575757;\n --color-black-pressed: #353535;\n\n /* White */\n --color-white-hovered: #fafafa;\n --color-white-pressed: #f2f2f2;\n\n /* Secondary Palette */\n --color-secondary-yellow: #ffce45;\n --color-secondary-pink: #ff36d0;\n --color-secondary-orange: #ff6700;\n --color-secondary-blue: #5f9cff;\n\n /* Shadows */\n --shadow-floating: 0px 4px 38px 0px #0000000a;\n\n /* Core theme colors */\n --base-color-primary: #c8102e;\n --base-color-core: #c8102e;\n --base-color-stream: #1866dc;\n --base-color-cinema: #1a1a1a;\n --base-color-white: #ffffff;\n --base-color-black: #000000;\n --base-color-dark-grey: #4c4f53;\n --base-color-mid-grey: #72767c;\n --base-color-light-grey: #e9e9e9;\n --base-color-transparent: transparent;\n --base-color-errorstate: #eb0a0a;\n --base-color-mediumstate: #ffce45;\n --base-color-goodstate: #2a874a;\n --base-color-progress: #1866dc;\n --base-color-navigation: #c8102e;\n --base-color-lapislazuli: #0060a0;\n --base-color-lemonchiffon: #fffbbe;\n\n --button-height: 48px;\n --button-line-height: 20px;\n --button-padding-x: 20px;\n --button-padding-y: 14px;\n --button-padding-y-icon: 12px;\n --button-icon-margin: 12px;\n --button-icon-width: 20px;\n --button-icon-height: 20px;\n --button-font-size: 14px;\n --button-font-weight: 400;\n --button-color: var(--color-base-white);\n --button-bg-color: var(--color-primary-red);\n --button-hover-color: var(--color-rbo-red-hovered);\n --button-pressed-color: var(--color-rbo-red-pressed);\n --button-secondary-color: var(--color-primary-red);\n --button-secondary-hover-color: var(--color-rbo-red-hovered);\n --button-secondary-pressed-color: var(--color-rbo-red-pressed);\n --button-tertiary-color: var(--color-primary-black);\n --button-tertiary-hover-color: var(--color-rbo-black-hovered);\n --button-tertiary-pressed-color: var(--color-rbo-black-pressed);\n --button-auxiliary-color: var(--color-primary-black);\n --button-auxiliary-bg-color: var(--color-base-transparent);\n\n/* ----- Variables already used in Harmonic START ----- */\n --grid-column-gap: 36px;\n --grid-margin: 10%;\n\n --rotator-button-width: 60px;\n --rotator-button-icon-width: 36px;\n --rotator-button-color: var(--color-primary-black);\n --rotator-button-bg-color: var(--color-base-light-grey);\n --rotator-button-hover-color: var(--color-base-white);\n --rotator-button-hover-bg-color: var(--color-primary-red);\n\n --carousel-image-caption-height: 17px;\n \n @media (max-width: 699px) {\n --grid-column-gap: 12px;\n --grid-margin: 20px;\n --rotator-button-width: 40px;\n --rotator-button-icon-width: 24px;\n --carousel-image-caption-height: 14px;\n }\n\n @media (min-width: 700px) and (max-width: 1139px) {\n --grid-column-gap: 20px;\n --grid-margin: 32px;\n --rotator-button-width: 44px;\n --rotator-button-icon-width: 24px;\n --carousel-image-caption-height: 14px;\n }\n\n/* ----- Variables already used in Harmonic END ----- */\n\n --font-size-header-1: 96px;\n --font-weight-header-1: 500;\n --letter-spacing-header-1: 2px;\n --line-height-header-1: 110px;\n --margin-header-1: 0.67em 0;\n\n --font-size-header-2: 68px;\n --font-weight-header-2: 500;\n --letter-spacing-header-2: 1px;\n --line-height-header-2: 72px;\n --margin-header-2: 0.83em 0;\n\n --font-size-header-3: 44px;\n --font-weight-header-3: 500;\n --letter-spacing-header-3: 1px;\n --line-height-header-3: 48px;\n --margin-header-3: 1em 0;\n\n --font-size-header-4: 34px;\n --font-weight-header-4: 500;\n --letter-spacing-header-4: 1px;\n --line-height-header-4: 40px;\n --margin-header-4: 1.33em 0;\n\n --font-size-header-5: 24px;\n --font-weight-header-5: 500;\n --letter-spacing-header-5: 1px;\n --line-height-header-5: 30px;\n --margin-header-5: 1.67em 0;\n\n --font-size-header-6: 20px;\n --font-weight-header-6: 500;\n --letter-spacing-header-6: 1px;\n --line-height-header-6: 28px;\n --margin-header-6: 2.33em 0;\n\n --font-size-altHeader-3: 44px;\n --font-weight-altHeader-3: normal;\n --letter-spacing-altHeader-3: normal;\n --line-height-altHeader-3: 48px;\n\n --font-size-altHeader-4: 34px;\n --font-weight-altHeader-4: normal;\n --letter-spacing-altHeader-4: normal;\n --line-height-altHeader-4: 44px;\n\n --font-size-altHeader-5: 24px;\n --font-weight-altHeader-5: normal;\n --letter-spacing-altHeader-5: normal;\n --line-height-altHeader-5: 30px;\n\n --font-size-altHeader-6: 20px;\n --font-weight-altHeader-6: normal;\n --letter-spacing-altHeader-6: normal;\n --line-height-altHeader-6: 28px;\n\n --font-size-overline-1: 14px;\n --font-weight-overline-1: 500;\n --letter-spacing-overline-1: 1px;\n --line-height-overline-1: 16px;\n\n --font-size-overline-2: 12px;\n --font-weight-overline-2: 500;\n --letter-spacing-overline-2: 1px;\n --line-height-overline-2: 14px;\n\n --font-size-overline-3: 10px;\n --font-weight-overline-3: 500;\n --letter-spacing-overline-3: 1px;\n --line-height-overline-3: 12px;\n\n --font-size-overline-4: 8px;\n --font-weight-overline-4: 500;\n --letter-spacing-overline-4: 1px;\n --line-height-overline-4: 10px;\n\n --font-size-body-1: 19px;\n --font-weight-body-1: 400;\n --letter-spacing-body-1: normal;\n --line-height-body-1: 26px;\n\n --font-size-body-2: 16px;\n --font-weight-body-2: 400;\n --letter-spacing-body-2: normal;\n --line-height-body-2: 22px;\n\n --font-size-body-3: 14px;\n --font-weight-body-3: 400;\n --letter-spacing-body-3: normal;\n --line-height-body-3: 20px;\n\n --font-size-subtitle-1: 18px;\n --font-weight-subtitle-1: 500;\n --letter-spacing-subtitle-1: 1px;\n --line-height-subtitle-1: 22px;\n\n --font-size-subtitle-2: 14px;\n --font-weight-subtitle-2: 500;\n --letter-spacing-subtitle-2: 1px;\n --line-height-subtitle-2: 22px;\n\n --font-size-title-description: 20px;\n --line-height-title-description: 28px;\n\n --line-height-listing: 36px;\n --font-size-individual-listing-name: 19px;\n --line-height-individual-listing-name: 24px;\n --line-height-people-listing-gap: 24px;\n\n --font-family-header: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-altHeader: 'adobe-garamond-pro';\n --font-family-body: 'adobe-garamond-pro';\n --font-family-body-italics: 'adobe-garamond-pro';\n --font-family-buttons: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-overline: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-subtitle: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-people-listing-role: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-people-listing-name: 'adobe-garamond-pro';\n\n --font-feature-settings-header: 'tnum' on, 'lnum' on;\n --font-feature-settings-altHeader: 'pnum' on, 'onum' on;\n --font-feature-settings-overline: 'tnum' on, 'lnum' on, 'liga' off, 'calt' off;\n --font-feature-settings-subtitle: 'tnum' on, 'lnum' on;\n --font-feature-settings-body: 'pnum' on, 'onum' on, 'liga' off;\n --font-feature-settings-navigation: 'tnum' on, 'lnum' on, 'liga' off, 'calt' off;\n\n --text-transform-header: uppercase;\n --text-transform-altHeader: none;\n --text-transform-body: none;\n --text-transform-overline: uppercase;\n --text-transform-subtitle: uppercase;\n\n --word-break-header: break-word;\n --word-break-altHeader: break-word;\n --word-break-body: break-word;\n --word-break-overline: break-word;\n --word-break-subtitle: break-word;\n\n --font-family-navigation: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-size-navigation: 13px;\n --font-weight-navigation: 500;\n --line-height-navigation: 16px;\n --text-transform-navigation: uppercase;\n --letter-spacing-navigation: 1px;\n\n --navigation-small-gap: 16px;\n --navigation-middle-gap: 20px;\n --navigation-large-gap: 24px;\n --navigation-xlarge-gap: 36px;\n --navigation-large-margin: 60px;\n\n --font-size-search: 24px;\n --font-family-search: 'adobe-garamond-pro';\n\n --grid-outer-margin: 50px;\n --grid-template-columns: 14px calc(10% - 86px) repeat(12, minmax(0, 1fr)) calc(10% - 86px) 14px;\n\n --footer-height: 380px;\n --footer-padding-top: 44px;\n --footer-padding-bottom: 44px;\n --footer-items-gap: 32px;\n --footer-media-gap: 32px;\n --footer-media-icon-width: 24px;\n --footer-media-icon-height: 24px;\n --footer-vertical-spacing-lg: 58px;\n --footer-vertical-spacing-sm: 16px;\n\n --text-link-underline-offset: 8px;\n --cards-spacing-stack: 40px;\n\n --editorial-subtitle-margin-bottom: 16px;\n --editorial-margin-between: 24px;\n --editorial-spacing-hover: 4px;\n --anchor-tabs-height: 70px;\n\n --font-family-sans: 'GreyLLTT', 'Roboto', sans-serif;\n --font-family-serif: 'VictorSerif', 'Inria Serif Regular', serif;\n\n --harmonic-text-link-underline-offset: 6px;\n --harmonic-font-size-navigation: 19px;\n\n --announcement-banner-color: var(--color-base-white);\n --announcement-banner-bg-color: var(--color-primary-red);\n --announcement-banner-hover-color: var(--color-white-hovered);\n --announcement-banner-pressed-color: var(--color-white-pressed);\n\n --information-panel-color: var(--color-base-white);\n --information-panel-bg-color: var(--color-primary-red);\n --information-panel-button-color: var(--color-primary-black);\n --information-panel-button-bg-color: var(--color-base-white);\n --information-panel-button-hover-color: var(--color-white-hovered);\n --information-panel-button-pressed-color: var(--color-white-pressed);\n\n --heading-promo-bg-color: var(--color-primary-red);\n --page-header-bg-color: var(--color-primary-red);\n\n @media (max-width: 699px) {\n --font-size-header-1: 38px;\n --font-weight-header-1: 500;\n --letter-spacing-header-1: 1px;\n --line-height-header-1: 42px;\n\n --font-size-header-2: 30px;\n --font-weight-header-2: 500;\n --letter-spacing-header-2: 1px;\n --line-height-header-2: 34px;\n\n --font-size-header-3: 26px;\n --font-weight-header-3: 500;\n --letter-spacing-header-3: 1px;\n --line-height-header-3: 30px;\n\n --font-size-header-4: 24px;\n --font-weight-header-4: 500;\n --letter-spacing-header-4: 1px;\n --line-height-header-4: 28px;\n\n --font-size-header-5: 20px;\n --font-weight-header-5: 500;\n --letter-spacing-header-5: 1px;\n --line-height-header-5: 28px;\n\n --font-size-header-6: 17px;\n --font-weight-header-6: 500;\n --letter-spacing-header-6: 1px;\n --line-height-header-6: 24px;\n\n --font-size-altHeader-3: 26px;\n --font-weight-altHeader-3: normal;\n --letter-spacing-altHeader-3: normal;\n --line-height-altHeader-3: 30px;\n\n --font-size-altHeader-4: 24px;\n --font-weight-altHeader-4: normal;\n --letter-spacing-altHeader-4: normal;\n --line-height-altHeader-4: 28px;\n\n --font-size-altHeader-5: 20px;\n --font-weight-altHeader-5: normal;\n --letter-spacing-altHeader-5: normal;\n --line-height-altHeader-5: 28px;\n\n --font-size-altHeader-6: 17px;\n --font-weight-altHeader-6: normal;\n --letter-spacing-altHeader-6: normal;\n --line-height-altHeader-6: 24px;\n\n --font-size-overline-1: 14px;\n --font-weight-overline-1: 500;\n --letter-spacing-overline-1: 1px;\n --line-height-overline-1: 16px;\n\n --font-size-overline-2: 12px;\n --font-weight-overline-2: 500;\n --letter-spacing-overline-2: 1px;\n --line-height-overline-2: 14px;\n\n --font-size-body-1: 17px;\n --font-weight-body-1: 400;\n --letter-spacing-body-1: normal;\n --line-height-body-1: 24px;\n\n --font-size-body-2: 12px;\n --font-weight-body-2: 400;\n --letter-spacing-body-2: normal;\n --line-height-body-2: 18px;\n\n --font-size-body-3: 11px;\n --font-weight-body-3: 400;\n --letter-spacing-body-3: normal;\n --line-height-body-3: 16px;\n\n --font-size-subtitle-1: 16px;\n --font-weight-subtitle-1: 500;\n --letter-spacing-subtitle-1: 1px;\n --line-height-subtitle-1: 24px;\n\n --font-size-subtitle-2: 14px;\n --font-weight-subtitle-2: 500;\n --letter-spacing-subtitle-2: 1px;\n --line-height-subtitle-2: 18px;\n\n --font-size-title-description: 17px;\n --line-height-title-description: 24px;\n --line-height-people-listing-gap: 16px;\n\n --font-size-search: 20px;\n --font-family-search: 'adobe-garamond-pro';\n\n --font-family-header: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-altHeader: 'adobe-garamond-pro';\n --font-family-body: 'adobe-garamond-pro';\n --font-family-body-italics: 'adobe-garamond-pro';\n --font-family-buttons: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-overline: 'Gotham SSm Medium', sans-serif;\n --font-family-subtitle: 'Gotham SSm Medium', 'Montserrat', sans-serif;\n --font-family-people-listing-role: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-people-listing-name: 'adobe-garamond-pro';\n\n --font-feature-settings-header: 'tnum' on, 'lnum' on;\n --font-feature-settings-altHeader: 'pnum' on, 'onum' on;\n --font-feature-settings-overline: 'tnum' on, 'lnum' on, 'liga' off, 'calt' off;\n --font-feature-settings-subtitle: 'tnum' on, 'lnum' on;\n --font-feature-settings-body: 'pnum' on, 'onum' on, 'liga' off;\n --font-feature-settings-navigation: 'tnum' on, 'lnum' on, 'liga' off, 'calt' off;\n\n --text-transform-header: uppercase;\n --text-transform-altHeader: none;\n --text-transform-body: none;\n --text-transform-overline: uppercase;\n --text-transform-subtitle: uppercase;\n\n --word-break-header: break-word;\n --word-break-altHeader: break-word;\n --word-break-body: break-word;\n --word-break-overline: break-word;\n --word-break-subtitle: break-word;\n\n --grid-template-columns: calc(20px - 12px) repeat(12, minmax(0, 1fr)) calc(20px - 12px);\n\n --footer-height: auto;\n --footer-padding-top: 20px;\n --footer-padding-bottom: 20px;\n --footer-items-gap: 12px;\n --footer-media-icon-width: 28px;\n --footer-media-icon-height: 28px;\n --footer-vertical-spacing-lg: 24px;\n --footer-vertical-spacing-sm: 24px;\n\n --anchor-tabs-height: 60px;\n }\n\n @media (min-width: 700px) and (max-width: 1139px) {\n --grid-template-columns: calc(32px - 20px) repeat(12, minmax(0, 1fr)) calc(32px - 20px);\n --font-size-header-6: 17px;\n --font-size-altHeader-4: 24px;\n --font-size-body-1: 17px;\n\n --footer-media-gap: 24px;\n --footer-padding-top: 40px;\n --footer-padding-bottom: 40px;\n }\n}\n";
|
|
12644
|
+
var coreThemeStyles = {"coreTheme":"core-theme-module_coreTheme__pWxYB"};
|
|
12645
|
+
styleInject(css_248z$2);
|
|
12646
|
+
|
|
12647
|
+
var css_248z$3 = ".stream-theme-module_streamTheme__lTfqQ {\n /* Stream theme overrides */\n --base-color-primary: #1a1a1a;\n --color-primary: #1a1a1a;\n --color-primary-background: #1a1a1a;\n --color-primary-button: #1a1a1a;\n --color-secondary-button: #ffffff;\n --color-tertiary-button: transparent;\n --color-auxiliary-button: transparent;\n --color-primary-button-reverse-bg: #1a1a1a;\n --color-primary-button-reverse: #ffffff;\n\n --button-color: var(--color-base-white);\n --button-bg-color: var(--color-primary-black);\n --button-hover-color: var(--color-black-hovered);\n --button-pressed-color: var(--color-black-pressed);\n --button-secondary-color: var(--color-primary-black);\n --button-secondary-hover-color: var(--color-black-hovered);\n --button-secondary-pressed-color: var(--color-black-pressed);\n --button-tertiary-color: var(--color-primary-black);\n --button-tertiary-hover-color: var(--color-rbo-black-hovered);\n --button-tertiary-pressed-color: var(--color-rbo-black-pressed);\n\n --rotator-button-color: var(--color-base-black);\n --rotator-button-bg-color: var(--color-base-light-grey);\n --rotator-button-hover-color: var(--color-base-white);\n --rotator-button-hover-bg-color: var(--color-primary-black);\n\n --announcement-banner-color: var(--color-base-white);\n --announcement-banner-bg-color: var(--color-primary-black);\n --announcement-banner-hover-color: var(--color-white-hovered);\n --announcement-banner-pressed-color: var(--color-white-pressed);\n\n --information-panel-color: var(--color-base-white);\n --information-panel-bg-color: var(--color-primary-black);\n\n --heading-promo-bg-color: var(--color-base-black);\n --page-header-bg-color: var(--color-primary-black);\n}\n";
|
|
12648
|
+
var streamThemeStyles = {"streamTheme":"stream-theme-module_streamTheme__lTfqQ"};
|
|
12649
|
+
styleInject(css_248z$3);
|
|
12650
|
+
|
|
12651
|
+
var css_248z$4 = ".cinema-theme-module_cinemaTheme__f5QFs {\n /* White */\n --base-color-primary: #1a1a1a;\n --color-primary: #1a1a1a;\n --color-primary-button: #ffffff;\n --color-primary-background: #1a1a1a;\n --color-primary-button-reverse-bg: #ffffff;\n --color-primary-button-reverse: #1a1a1a;\n --color-secondary-button: #ffffff;\n --color-tertiary-button: transparent;\n --color-auxiliary-button: transparent;\n --color-white-hovered: #fafafa;\n --color-white-pressed: #f2f2f2;\n\n --button-color: var(--color-primary-black);\n --button-bg-color: var(--color-base-white);\n --button-hover-color: var(--color-white-hovered);\n --button-pressed-color: var(--color-white-pressed);\n --button-secondary-color: var(--color-base-white);\n --button-secondary-hover-color: var(--color-white-hovered);\n --button-secondary-pressed-color: var(--color-white-pressed);\n --button-tertiary-color: var(--color-base-white);\n --button-tertiary-hover-color: var(--color-white-hovered);\n --button-tertiary-pressed-color: var(--color-white-pressed);\n\n --rotator-button-color: var(--color-primary-black);\n --rotator-button-bg-color: var(--color-base-light-grey);\n --rotator-button-hover-color: var(--color-base-white);\n --rotator-button-hover-bg-color: var(--color-primary-black);\n\n --announcement-banner-color: var(--color-primary-red);\n --announcement-banner-bg-color: var(--color-base-white);\n --announcement-banner-hover-color: var(--color-rbo-red-hovered);\n --announcement-banner-pressed-color: var(--color-rbo-red-pressed);\n\n --information-panel-color: var(--color-primary-black);\n --information-panel-bg-color: var(--color-base-white);\n --information-panel-button-color: var(--color-base-white);\n --information-panel-button-bg-color: var(--color-primary-red);\n --information-panel-button-hover-color: var(--color-rbo-red-hovered);\n --information-panel-button-pressed-color: var(--color-rbo-red-pressed);\n\n --heading-promo-bg-color: var(--color-base-white); \n --page-header-bg-color: var(--color-primary-black);\n};";
|
|
12652
|
+
var cinemaThemeStyles = {"cinemaTheme":"cinema-theme-module_cinemaTheme__f5QFs"};
|
|
12653
|
+
styleInject(css_248z$4);
|
|
12654
|
+
|
|
12655
|
+
var css_248z$5 = ".schools-theme-module_schoolsTheme__CWHba {\n /* Schools theme overrides */\n --base-color-primary: #c8102e;\n --color-primary: #c8102e;\n --color-primary-button: #c8102e;\n --color-primary-button-reverse-bg: #1a1a1a;\n --color-primary-button-reverse: #ffffff;\n --color-secondary-button: #ffffff;\n --color-tertiary-button: transparent;\n --color-auxiliary-button: transparent;\n\n --text-transform-header: none;\n --text-transform-altHeader: none;\n --text-transform-body: none;\n --text-transform-overline: none;\n --text-transform-subtitle: none;\n --text-transform-navigation: uppercase;\n\n @media only screen and (max-width: calc(var(--breakpoint-sm) - 1px)) {\n --text-transform-header: none;\n --text-transform-altHeader: none;\n --text-transform-body: none;\n --text-transform-overline: none;\n --text-transform-subtitle: none;\n --text-transform-navigation: uppercase;\n }\n}\n";
|
|
12656
|
+
var schoolsThemeStyles = {"schoolsTheme":"schools-theme-module_schoolsTheme__CWHba"};
|
|
12657
|
+
styleInject(css_248z$5);
|
|
12658
|
+
|
|
12659
|
+
/* eslint-disable react/jsx-no-useless-fragment */
|
|
12660
|
+
var getThemeClass = function getThemeClass(theme) {
|
|
12661
|
+
// Always include the base (core) theme class
|
|
12662
|
+
var baseThemeClass = coreThemeStyles.coreTheme;
|
|
12663
|
+
var overrideClass = '';
|
|
12664
|
+
switch (theme) {
|
|
12665
|
+
case ThemeType.Core:
|
|
12666
|
+
overrideClass = '';
|
|
12667
|
+
break;
|
|
12668
|
+
case ThemeType.Stream:
|
|
12669
|
+
overrideClass = streamThemeStyles.streamTheme;
|
|
12670
|
+
break;
|
|
12671
|
+
case ThemeType.Cinema:
|
|
12672
|
+
overrideClass = cinemaThemeStyles.cinemaTheme;
|
|
12673
|
+
break;
|
|
12674
|
+
case ThemeType.Schools:
|
|
12675
|
+
overrideClass = schoolsThemeStyles.schoolsTheme;
|
|
12676
|
+
break;
|
|
12677
|
+
default:
|
|
12678
|
+
overrideClass = '';
|
|
12679
|
+
}
|
|
12680
|
+
// Return the combined classes
|
|
12681
|
+
return [baseThemeClass, overrideClass].filter(Boolean).join(' ');
|
|
12682
|
+
};
|
|
12683
|
+
var HarmonicThemeProvider = function HarmonicThemeProvider(_ref) {
|
|
12684
|
+
var theme = _ref.theme,
|
|
12685
|
+
children = _ref.children;
|
|
12686
|
+
var themeClass = getThemeClass(theme);
|
|
12687
|
+
// Convert children to an array (assuming they accept a className prop)
|
|
12688
|
+
var childrenArray = React__default.Children.toArray(children);
|
|
12689
|
+
var themedChildren = childrenArray.map(function (child) {
|
|
12690
|
+
return /*#__PURE__*/React__default.cloneElement(child, {
|
|
12691
|
+
className: ((child.props.className || '') + " " + themeClass).trim(),
|
|
12692
|
+
theme: theme
|
|
12693
|
+
});
|
|
12694
|
+
});
|
|
12695
|
+
return themedChildren.length === 1 ? themedChildren[0] : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, themedChildren);
|
|
12696
|
+
};
|
|
12697
|
+
|
|
12631
12698
|
var _excluded$s = ["logo", "slides"];
|
|
12632
12699
|
var HighlightsCinema = function HighlightsCinema(_ref) {
|
|
12633
12700
|
var logo = _ref.logo,
|
|
@@ -13672,5 +13739,12 @@ var GlobalStyles = /*#__PURE__*/createGlobalStyle(_templateObject$1q || (_templa
|
|
|
13672
13739
|
return theme.footer.tablet.paddingBottom;
|
|
13673
13740
|
}, devices.desktop, devices.largeDesktop);
|
|
13674
13741
|
|
|
13675
|
-
|
|
13742
|
+
/* ~~~~~~~ new harmonic types ~~~~~~~ */
|
|
13743
|
+
var HarmonicSize = {
|
|
13744
|
+
Small: 'small',
|
|
13745
|
+
Medium: 'medium',
|
|
13746
|
+
Large: 'large'
|
|
13747
|
+
};
|
|
13748
|
+
|
|
13749
|
+
export { Accordion, Accordions, AltHeader, AnchorBar, AnchorTabBar, AnnouncementBanner, AspectRatio, AuxiliaryButton, AuxiliaryNav, BodyCopyHarmonic, BodyText, ButtonText, ButtonType, Caption, Card, Cards, Carousel, CarouselType, CinemaBadge, Colors, ContactCard, ContentSummary, ControlledDropdown, CreditListing, Editorial, Footer, GlobalStyles, Grid, GridItem, HarmonicHeader, HarmonicOverline, HarmonicSize, HarmonicSubtitle, HarmonicThemeProvider, Header, HighlightsCarousel, HighlightsCinema as HighlightsCarouselCinema, HighlightsCore as HighlightsCarouselCore, HighlightsStream as HighlightsCarouselStream, HotFilters, Icon, ImageAspectRatioWrapper, ImageWithCaption, Information, MiniCard, MinimalCarousel, ModalWindow, Navigation, NavigationText, Overline, PageHeading, PageHeadingCompact, PageHeadingImpact, PageHeadingPanel, PageHeadingPromo, Pagination, PasswordStrength, PeopleListing, PrimaryButton, Progress, PromoWithTags, PromoWithTitle, Quote, Radio, Radio2, RadioGroup, RadioGroup2, ReadMore, RotatorButtons, SearchBar, SecondaryButton, SecondaryLogo, SectionSplitter, SectionTitle, Select, SelectComponent as Select2, SelectComponent$1 as Select2Async, SignUpFormComponent as SignUpForm, Sponsorship, StatusBanner, Component as Stepper, StickyBar, StreamBadge, Subtitle, Tab, TabLink, Table, Tabs, TertiaryButton, TextArea, TextField, TextFieldLegacy, TextLink, TextOnly, ThemeColor, Theme as ThemeProvider, ThemeType, Tickbox, Tickbox2, TickboxMode, Timer, TitleWithCTA, TypeTags, UpsellCard, UpsellSection, VideoControls, VideoWithControls$1 as VideoWithControls, breakpoints, devices, zIndexes };
|
|
13676
13750
|
//# sourceMappingURL=harmonic.esm.js.map
|