@royaloperahouse/chord 2.3.2 → 2.3.3-b-chord-development
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/CHANGELOG.md +213 -7
- package/README.md +250 -40
- package/dist/chord.cjs.development.js +678 -381
- package/dist/chord.cjs.development.js.map +1 -1
- package/dist/chord.cjs.production.min.js +1 -1
- package/dist/chord.cjs.production.min.js.map +1 -1
- package/dist/chord.esm.js +678 -383
- package/dist/chord.esm.js.map +1 -1
- package/dist/components/atoms/Grid/GridItemLegacy.d.ts +8 -0
- package/dist/components/atoms/Grid/index.d.ts +2 -1
- package/dist/components/atoms/TextField/TextFieldLegacy.d.ts +10 -0
- package/dist/components/atoms/TextField/TextFieldLegacy.style.d.ts +5 -0
- package/dist/components/atoms/TextField/index.d.ts +2 -1
- package/dist/components/atoms/Typography/Typography.d.ts +1 -1
- package/dist/components/atoms/index.d.ts +3 -3
- package/dist/components/index.d.ts +2 -2
- package/dist/components/molecules/PageHeading/index.d.ts +1 -1
- package/dist/components/molecules/PeopleListing/CreditListing/CreditListing.style.d.ts +1 -0
- package/dist/components/molecules/PromoWithTitle/PromoChild.d.ts +2 -2
- package/dist/components/molecules/SectionTitle/SectionTitle.d.ts +1 -1
- package/dist/components/molecules/index.d.ts +1 -1
- package/dist/helpers/generateDomElementId.d.ts +8 -0
- package/dist/index.d.ts +3 -2
- package/dist/types/editorial.d.ts +18 -2
- package/dist/types/formTypes.d.ts +12 -9
- package/dist/types/impactHeader.d.ts +13 -0
- package/dist/types/types.d.ts +10 -1
- package/package.json +1 -1
- package/README.GIT +0 -277
package/dist/chord.esm.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React__default, { createElement, memo, useRef, useCallback, useEffect, useState, forwardRef, cloneElement } from 'react';
|
|
1
|
+
import React__default, { createElement, memo, useRef, useCallback, useEffect, useState, forwardRef, useMemo, cloneElement } from 'react';
|
|
2
2
|
import styled, { css, ThemeProvider, createGlobalStyle } from 'styled-components';
|
|
3
3
|
import moment from 'moment';
|
|
4
4
|
import { renderToString } from 'react-dom/server';
|
|
@@ -120,37 +120,181 @@ var BadgeWrapper = /*#__PURE__*/styled.svg(_templateObject || (_templateObject =
|
|
|
120
120
|
|
|
121
121
|
var StreamBadge = function StreamBadge(_ref) {
|
|
122
122
|
var _ref$fillColor = _ref.fillColor,
|
|
123
|
-
fillColor = _ref$fillColor === void 0 ? Colors.White : _ref$fillColor
|
|
123
|
+
fillColor = _ref$fillColor === void 0 ? Colors.White : _ref$fillColor,
|
|
124
|
+
_ref$align = _ref.align,
|
|
125
|
+
align = _ref$align === void 0 ? 'center' : _ref$align;
|
|
124
126
|
return /*#__PURE__*/React__default.createElement(BadgeWrapper, {
|
|
125
127
|
fillColor: fillColor,
|
|
126
128
|
width: "100%",
|
|
127
129
|
height: "100%",
|
|
128
|
-
viewBox: "
|
|
129
|
-
fill: "none",
|
|
130
|
+
viewBox: "110 450 865 200",
|
|
130
131
|
xmlns: "http://www.w3.org/2000/svg"
|
|
131
132
|
}, /*#__PURE__*/React__default.createElement("g", null, /*#__PURE__*/React__default.createElement("path", {
|
|
132
|
-
d: "
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
d: "
|
|
136
|
-
|
|
133
|
+
d: "M416.81,485.21c0-9.38-6.6-14.94-18.59-14.94h-23.1v60.79h22.84c13.2,0,20.58-7.12,20.58-17.97,0-7.3-4.86-13.11-13.46-14.07,7.9-1.13,11.73-7.47,11.73-13.8ZM389.28,481.3h5.47c5.47,0,7.64,2.69,7.64,6.51s-2.17,6.51-7.73,6.51h-5.38v-13.03ZM395.79,519.59h-6.51v-14.59h6.42c4.95,0,8.43,2.69,8.43,7.29s-3.39,7.29-8.34,7.29Z",
|
|
134
|
+
"stroke-width": "0"
|
|
135
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
136
|
+
d: "M435.74,518.9h19.19l3.73,12.16h14.76l-20.67-60.79h-14.85l-20.67,60.79h14.76l3.73-12.16ZM445.29,487.55l5.82,18.85h-11.64l5.82-18.85Z",
|
|
137
|
+
"stroke-width": "0"
|
|
138
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
139
|
+
d: "M774.06,500.66c0-18.15-13.89-31.7-32.56-31.7s-32.56,13.54-32.56,31.7,13.98,31.7,32.56,31.7,32.56-13.55,32.56-31.7ZM723.44,500.66c0-10.59,7.81-18.58,18.06-18.58s18.06,7.99,18.06,18.58-7.73,18.58-18.06,18.58-18.06-7.99-18.06-18.58Z",
|
|
140
|
+
"stroke-width": "0"
|
|
141
|
+
}), /*#__PURE__*/React__default.createElement("polygon", {
|
|
142
|
+
points: "511.38 470.27 511.38 531.06 542.64 531.06 542.64 518.38 525.53 518.38 525.53 470.27 511.38 470.27",
|
|
143
|
+
"stroke-width": "0"
|
|
144
|
+
}), /*#__PURE__*/React__default.createElement("polygon", {
|
|
145
|
+
points: "610.2 531.06 610.2 482.95 623.83 482.95 623.83 470.27 582.41 470.27 582.41 482.95 596.04 482.95 596.04 531.06 610.2 531.06",
|
|
146
|
+
"stroke-width": "0"
|
|
147
|
+
}), /*#__PURE__*/React__default.createElement("polygon", {
|
|
148
|
+
points: "578.59 482.95 578.59 470.27 546.46 470.27 546.46 531.06 578.59 531.06 578.59 518.38 560.61 518.38 560.61 506.74 575.03 506.74 575.03 494.06 560.61 494.06 560.61 482.95 578.59 482.95",
|
|
149
|
+
"stroke-width": "0"
|
|
150
|
+
}), /*#__PURE__*/React__default.createElement("polygon", {
|
|
151
|
+
points: "475.86 470.27 475.86 531.06 507.12 531.06 507.12 518.38 490.01 518.38 490.01 470.27 475.86 470.27",
|
|
152
|
+
"stroke-width": "0"
|
|
153
|
+
}), /*#__PURE__*/React__default.createElement("polygon", {
|
|
154
|
+
points: "324.76 470.27 324.76 531.06 356.02 531.06 356.02 518.38 338.92 518.38 338.92 470.27 324.76 470.27",
|
|
155
|
+
"stroke-width": "0"
|
|
156
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
157
|
+
d: "M800.98,508.48c12.33,0,20.58-7.99,20.58-19.11s-8.25-19.1-20.58-19.1h-23.19v60.79h14.16v-22.58h9.03ZM791.95,481.91h6.42c6.25,0,8.68,3.21,8.68,7.47s-2.43,7.56-8.68,7.56h-6.42v-15.02Z",
|
|
158
|
+
"stroke-width": "0"
|
|
159
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
160
|
+
d: "M923.95,470.27l-19.45,57.31-11.03-20.75c7.12-2.95,11.46-9.38,11.46-17.45,0-11.03-8.25-19.1-20.58-19.1h-23.19v60.79h14.15v-22.58h3.56l11.55,22.58h27.62l3.73-12.16h19.19l3.74,12.16h14.76l-20.67-60.79h-14.85ZM881.74,496.93h-6.43v-15.02h6.43c6.25,0,8.68,3.21,8.68,7.47s-2.43,7.56-8.68,7.56ZM925.51,506.39l5.82-18.85,5.82,18.85h-11.64Z",
|
|
161
|
+
"stroke-width": "0"
|
|
162
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
163
|
+
d: "M636.25,511c0,12.24,9.38,21.36,22.49,21.36,7.21,0,13.2-2.78,18.24-7.38l4.86,6.08h17.8l-13.37-16.59,9.81-14.33-10.85-7.47-7.64,11.12-16.85-20.84h18.93v-12.68h-36.64v12.68l6.68,8.25c-8.94,4.34-13.46,11.46-13.46,19.8ZM657.61,501.01l11.29,14.07c-2.26,2.34-5.21,4.17-9.03,4.17-5.64,0-9.21-4-9.21-8.77,0-4.26,2.87-7.81,6.95-9.46Z",
|
|
164
|
+
"stroke-width": "0"
|
|
165
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
166
|
+
d: "M176.87,529.41c-9.38-5.9-17.02-14.16-22.06-23.01,6.6-3.04,10.6-9.29,10.6-17.02,0-11.03-8.25-19.1-20.58-19.1h-23.19v60.79h14.15v-22.84h5.13c6.16,12.68,16.06,24.49,27.87,31.78h0l8.08-10.59ZM142.23,496.93h-6.43v-15.02h6.43c6.25,0,8.68,3.21,8.68,7.47s-2.43,7.56-8.68,7.56Z",
|
|
167
|
+
"stroke-width": "0"
|
|
168
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
169
|
+
d: "M284.56,518.9h19.19l3.74,12.16h14.76l-20.67-60.79h-14.85l-20.67,60.79h14.76l3.73-12.16ZM294.11,487.55l5.82,18.85h-11.64l5.82-18.85Z",
|
|
170
|
+
"stroke-width": "0"
|
|
171
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
172
|
+
d: "M201.1,468.97c-18.58,0-32.56,13.54-32.56,31.7s13.98,31.7,32.56,31.7,32.56-13.55,32.56-31.7-13.89-31.7-32.56-31.7ZM201.1,519.25c-10.25,0-18.06-7.99-18.06-18.58s7.81-18.58,18.06-18.58,18.06,7.99,18.06,18.58-7.73,18.58-18.06,18.58Z",
|
|
173
|
+
"stroke-width": "0"
|
|
174
|
+
}), /*#__PURE__*/React__default.createElement("polygon", {
|
|
175
|
+
points: "254.42 490.41 242.44 470.27 226.37 470.27 247.3 504.92 247.3 531.06 261.46 531.06 261.46 504.74 282.3 470.27 266.32 470.27 254.42 490.41",
|
|
176
|
+
"stroke-width": "0"
|
|
177
|
+
}), /*#__PURE__*/React__default.createElement("polygon", {
|
|
178
|
+
points: "857.34 482.95 857.34 470.27 825.21 470.27 825.21 531.06 857.34 531.06 857.34 518.38 839.36 518.38 839.36 506.74 853.78 506.74 853.78 494.06 839.36 494.06 839.36 482.95 857.34 482.95",
|
|
179
|
+
"stroke-width": "0"
|
|
180
|
+
})), align === 'left' && /*#__PURE__*/React__default.createElement("g", null, /*#__PURE__*/React__default.createElement("path", {
|
|
181
|
+
d: "M151.07,588.98c.36-1.96.53-3.12.53-5.25,0-6.14-4.54-9.88-10.68-9.88s-10.68,3.74-10.68,9.88c0,7.83,8.19,9.17,15.22,11.84,7.21,2.76,16.02,6.41,16.02,17.98s-9.08,18.16-20.47,18.16-20.47-6.85-20.47-18.16c0-2.58.53-4.54,1.07-5.87l7.92-.45c-.62,2.05-.98,4.01-.98,6.32,0,7.03,5.43,11.04,12.46,11.04s12.46-4,12.46-11.04c0-8.19-8.99-10.24-14.95-12.37-8.37-3.03-16.29-6.59-16.29-17.62s8.63-16.82,18.69-16.82,18.69,6.32,18.69,16.82c0,1.69-.27,3.74-.62,4.9l-7.92.53Z",
|
|
182
|
+
"stroke-width": "0"
|
|
183
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
184
|
+
d: "M184,630.37v-55.18h-16.91v-7.12h41.83v7.12h-16.91v55.18h-8.01Z",
|
|
185
|
+
"stroke-width": "0"
|
|
186
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
187
|
+
d: "M249.5,630.37c-1.69-2.58-1.33-11.04-1.6-16.2-.18-4.18-.98-6.32-2.49-7.83-1.6-1.51-4.18-2.22-7.48-2.22h-10.68v26.26h-8.01v-62.3h20.56c6.59,0,10.68,1.87,13.71,4.89,3.2,3.2,5.34,7.74,5.34,12.91,0,7.3-5.16,14.42-14.15,15.04,6.41.71,10.5,4.9,11.04,12.82l.36,5.52c.27,3.74.36,6.14.8,7.92.27,1.07.8,2.31,1.96,2.85v.36h-9.35ZM239.09,596.99c4.63,0,7.03-1.07,8.72-2.85,1.87-1.96,3.03-4.9,3.03-8.01s-1.16-5.96-3.03-7.92c-1.69-1.78-4.09-3.03-8.72-3.03h-11.84v21.81h11.84Z",
|
|
188
|
+
"stroke-width": "0"
|
|
189
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
190
|
+
d: "M271.93,630.37v-62.3h34.27v7.12h-26.26v20.03h19.14v7.12h-19.14v20.92h27.15v7.12h-35.16Z",
|
|
191
|
+
"stroke-width": "0"
|
|
192
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
193
|
+
d: "M353.01,630.37l-4.54-14.24h-22.7l-4.54,14.24h-8.1l20.03-62.3h8.01l20.03,62.3h-8.19ZM338.5,584.53c-.89-2.76-1.16-3.92-1.42-5.16-.27,1.25-.53,2.4-1.42,5.16l-7.57,24.48h18.07l-7.65-24.48Z",
|
|
194
|
+
"stroke-width": "0"
|
|
195
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
196
|
+
d: "M416.55,630.37v-37.83c0-2.22,0-4.09.09-6.23-.8,2.58-1.25,3.92-2.23,6.23l-15.75,38.72h-1.78l-15.75-38.72c-.98-2.31-1.42-3.65-2.23-6.23.09,2.14.09,4.01.09,6.23v37.83h-7.92v-62.3h8.01l16.11,39.07c1.25,3.03,1.69,4.18,2.67,6.76.98-2.58,1.42-3.74,2.67-6.76l15.93-39.07h8.01v62.3h-7.92Z",
|
|
197
|
+
"stroke-width": "0"
|
|
198
|
+
})), align === 'center' && /*#__PURE__*/React__default.createElement("g", null, /*#__PURE__*/React__default.createElement("path", {
|
|
199
|
+
d: "M401.56,585.29c.36-1.96.53-3.12.53-5.25,0-6.14-4.54-9.88-10.68-9.88s-10.68,3.74-10.68,9.88c0,7.83,8.19,9.17,15.22,11.84,7.21,2.76,16.02,6.41,16.02,17.98s-9.08,18.16-20.47,18.16-20.47-6.85-20.47-18.16c0-2.58.53-4.54,1.07-5.87l7.92-.45c-.62,2.05-.98,4.01-.98,6.32,0,7.03,5.43,11.04,12.46,11.04s12.46-4,12.46-11.04c0-8.19-8.99-10.24-14.95-12.37-8.37-3.03-16.29-6.59-16.29-17.62s8.63-16.82,18.69-16.82,18.69,6.32,18.69,16.82c0,1.69-.27,3.74-.62,4.9l-7.92.53Z",
|
|
200
|
+
"stroke-width": "0"
|
|
201
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
202
|
+
d: "M434.49,626.68v-55.18h-16.91v-7.12h41.83v7.12h-16.91v55.18h-8.01Z",
|
|
203
|
+
"stroke-width": "0"
|
|
204
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
205
|
+
d: "M500,626.68c-1.69-2.58-1.33-11.04-1.6-16.2-.18-4.18-.98-6.32-2.49-7.83-1.6-1.51-4.18-2.22-7.48-2.22h-10.68v26.26h-8.01v-62.3h20.56c6.59,0,10.68,1.87,13.71,4.89,3.2,3.2,5.34,7.74,5.34,12.91,0,7.3-5.16,14.42-14.15,15.04,6.41.71,10.5,4.9,11.04,12.82l.36,5.52c.27,3.74.36,6.14.8,7.92.27,1.07.8,2.31,1.96,2.85v.36h-9.35ZM489.58,593.3c4.63,0,7.03-1.07,8.72-2.85,1.87-1.96,3.03-4.9,3.03-8.01s-1.16-5.96-3.03-7.92c-1.69-1.78-4.09-3.03-8.72-3.03h-11.84v21.81h11.84Z",
|
|
206
|
+
"stroke-width": "0"
|
|
207
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
208
|
+
d: "M522.42,626.68v-62.3h34.27v7.12h-26.26v20.03h19.14v7.12h-19.14v20.92h27.15v7.12h-35.16Z",
|
|
209
|
+
"stroke-width": "0"
|
|
210
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
211
|
+
d: "M603.5,626.68l-4.54-14.24h-22.7l-4.54,14.24h-8.1l20.03-62.3h8.01l20.03,62.3h-8.19ZM588.99,580.84c-.89-2.76-1.16-3.92-1.42-5.16-.27,1.25-.53,2.4-1.42,5.16l-7.57,24.48h18.07l-7.65-24.48Z",
|
|
212
|
+
"stroke-width": "0"
|
|
213
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
214
|
+
d: "M667.05,626.68v-37.83c0-2.22,0-4.09.09-6.23-.8,2.58-1.25,3.92-2.23,6.23l-15.75,38.72h-1.78l-15.75-38.72c-.98-2.31-1.42-3.65-2.23-6.23.09,2.14.09,4.01.09,6.23v37.83h-7.92v-62.3h8.01l16.11,39.07c1.25,3.03,1.69,4.18,2.67,6.76.98-2.58,1.42-3.74,2.67-6.76l15.93-39.07h8.01v62.3h-7.92Z",
|
|
215
|
+
"stroke-width": "0"
|
|
216
|
+
})));
|
|
137
217
|
};
|
|
138
218
|
|
|
139
219
|
var CinemaBadge = function CinemaBadge(_ref) {
|
|
140
220
|
var _ref$fillColor = _ref.fillColor,
|
|
141
|
-
fillColor = _ref$fillColor === void 0 ? Colors.White : _ref$fillColor
|
|
221
|
+
fillColor = _ref$fillColor === void 0 ? Colors.White : _ref$fillColor,
|
|
222
|
+
_ref$align = _ref.align,
|
|
223
|
+
align = _ref$align === void 0 ? 'center' : _ref$align;
|
|
142
224
|
return /*#__PURE__*/React__default.createElement(BadgeWrapper, {
|
|
143
225
|
fillColor: fillColor,
|
|
144
226
|
width: "100%",
|
|
145
227
|
height: "100%",
|
|
146
|
-
viewBox: "
|
|
147
|
-
fill: "none",
|
|
228
|
+
viewBox: "110 450 865 200",
|
|
148
229
|
xmlns: "http://www.w3.org/2000/svg"
|
|
149
|
-
}, /*#__PURE__*/React__default.createElement("g", null, /*#__PURE__*/React__default.createElement("path", {
|
|
150
|
-
d: "
|
|
151
|
-
})
|
|
152
|
-
|
|
153
|
-
|
|
230
|
+
}, /*#__PURE__*/React__default.createElement("g", null, /*#__PURE__*/React__default.createElement("g", null, /*#__PURE__*/React__default.createElement("g", null, /*#__PURE__*/React__default.createElement("path", {
|
|
231
|
+
d: "M416.26,485.21c0-9.38-6.6-14.94-18.59-14.94h-23.1v60.79h22.84c13.2,0,20.58-7.12,20.58-17.97\n\t\t\t\tc0-7.3-4.86-13.11-13.46-14.07C412.43,497.88,416.26,491.54,416.26,485.21z M388.73,481.3h5.47c5.47,0,7.64,2.69,7.64,6.51\n\t\t\t\tc0,3.82-2.17,6.51-7.73,6.51h-5.38V481.3z M395.24,519.59h-6.51v-14.59h6.42c4.95,0,8.43,2.69,8.43,7.29\n\t\t\t\tC403.58,516.81,400.19,519.59,395.24,519.59z"
|
|
232
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
233
|
+
d: "M773.51,500.66c0-18.15-13.89-31.7-32.56-31.7c-18.58,0-32.56,13.54-32.56,31.7\n\t\t\t\tc0,18.15,13.98,31.7,32.56,31.7C759.61,532.36,773.51,518.81,773.51,500.66z M722.88,500.66c0-10.59,7.81-18.58,18.06-18.58\n\t\t\t\tc10.33,0,18.06,7.99,18.06,18.58c0,10.59-7.73,18.58-18.06,18.58C730.7,519.25,722.88,511.26,722.88,500.66z"
|
|
234
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
235
|
+
d: "M435.19,518.9h19.19l3.73,12.16h14.76l-20.67-60.79h-14.85l-20.67,60.79h14.76L435.19,518.9z\n\t\t\t\t M444.74,487.55l5.82,18.85h-11.64L444.74,487.55z"
|
|
236
|
+
}), /*#__PURE__*/React__default.createElement("polygon", {
|
|
237
|
+
points: "475.31,470.27 475.31,531.06 506.57,531.06 506.57,518.38 489.46,518.38 489.46,470.27"
|
|
238
|
+
}), /*#__PURE__*/React__default.createElement("polygon", {
|
|
239
|
+
points: "609.65,531.06 609.65,482.95 623.28,482.95 623.28,470.27 581.86,470.27 581.86,482.95 \n\t\t\t\t595.49,482.95 595.49,531.06"
|
|
240
|
+
}), /*#__PURE__*/React__default.createElement("polygon", {
|
|
241
|
+
points: "578.03,482.95 578.03,470.27 545.91,470.27 545.91,531.06 578.03,531.06 578.03,518.38 \n\t\t\t\t560.06,518.38 560.06,506.74 574.47,506.74 574.47,494.06 560.06,494.06 560.06,482.95"
|
|
242
|
+
}), /*#__PURE__*/React__default.createElement("polygon", {
|
|
243
|
+
points: "324.21,470.27 324.21,531.06 355.47,531.06 355.47,518.38 338.36,518.38 338.36,470.27"
|
|
244
|
+
}), /*#__PURE__*/React__default.createElement("polygon", {
|
|
245
|
+
points: "510.82,470.27 510.82,531.06 542.09,531.06 542.09,518.38 524.98,518.38 524.98,470.27"
|
|
246
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
247
|
+
d: "M284,518.9h19.19l3.74,12.16h14.76l-20.67-60.79h-14.85l-20.67,60.79h14.76L284,518.9z M293.55,487.55\n\t\t\t\tl5.82,18.85h-11.64L293.55,487.55z"
|
|
248
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
249
|
+
d: "M635.7,511c0,12.24,9.38,21.36,22.49,21.36c7.21,0,13.2-2.78,18.24-7.38l4.86,6.08h17.8l-13.37-16.59\n\t\t\t\tl9.81-14.33l-10.85-7.47l-7.64,11.12l-16.85-20.84h18.93v-12.68h-36.64v12.68l6.68,8.25C640.21,495.54,635.7,502.66,635.7,511z\n\t\t\t\t M657.06,501.01l11.29,14.07c-2.26,2.34-5.21,4.17-9.03,4.17c-5.64,0-9.21-4-9.21-8.77\n\t\t\t\tC650.11,506.22,652.98,502.66,657.06,501.01z"
|
|
250
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
251
|
+
d: "M176.32,529.41c-9.38-5.9-17.02-14.16-22.06-23.01c6.6-3.04,10.6-9.29,10.6-17.02\n\t\t\t\tc0-11.03-8.25-19.1-20.58-19.1h-23.19v60.79h14.15v-22.84h5.13c6.16,12.68,16.06,24.49,27.87,31.78h0L176.32,529.41z\n\t\t\t\t M141.67,496.93h-6.43v-15.02h6.43c6.25,0,8.68,3.21,8.68,7.47C150.36,493.72,147.93,496.93,141.67,496.93z"
|
|
252
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
253
|
+
d: "M923.39,470.27l-19.45,57.31l-11.03-20.75c7.12-2.95,11.46-9.38,11.46-17.45\n\t\t\t\tc0-11.03-8.25-19.1-20.58-19.1h-23.19v60.79h14.15v-22.58h3.56l11.55,22.58h27.62l3.73-12.16h19.19l3.74,12.16h14.76\n\t\t\t\tl-20.67-60.79H923.39z M881.19,496.93h-6.43v-15.02h6.43c6.25,0,8.68,3.21,8.68,7.47C889.87,493.72,887.44,496.93,881.19,496.93z\n\t\t\t\t M924.95,506.39l5.82-18.85l5.82,18.85H924.95z"
|
|
254
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
255
|
+
d: "M800.43,508.48c12.33,0,20.58-7.99,20.58-19.11c0-11.03-8.25-19.1-20.58-19.1h-23.19v60.79h14.16v-22.58\n\t\t\t\tH800.43z M791.4,481.91h6.42c6.25,0,8.68,3.21,8.68,7.47c0,4.34-2.43,7.56-8.68,7.56h-6.42V481.91z"
|
|
256
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
257
|
+
d: "M200.55,468.97c-18.58,0-32.56,13.54-32.56,31.7c0,18.15,13.98,31.7,32.56,31.7\n\t\t\t\tc18.67,0,32.56-13.55,32.56-31.7C233.11,482.51,219.22,468.97,200.55,468.97z M200.55,519.25c-10.25,0-18.06-7.99-18.06-18.58\n\t\t\t\tc0-10.59,7.81-18.58,18.06-18.58c10.33,0,18.06,7.99,18.06,18.58C218.61,511.26,210.88,519.25,200.55,519.25z"
|
|
258
|
+
}), /*#__PURE__*/React__default.createElement("polygon", {
|
|
259
|
+
points: "253.87,490.41 241.89,470.27 225.82,470.27 246.75,504.92 246.75,531.06 260.9,531.06 \n\t\t\t\t260.9,504.74 281.74,470.27 265.76,470.27"
|
|
260
|
+
}), /*#__PURE__*/React__default.createElement("polygon", {
|
|
261
|
+
points: "856.79,482.95 856.79,470.27 824.66,470.27 824.66,531.06 856.79,531.06 856.79,518.38 \n\t\t\t\t838.81,518.38 838.81,506.74 853.23,506.74 853.23,494.06 838.81,494.06 838.81,482.95"
|
|
262
|
+
}))), align === 'left' && /*#__PURE__*/React__default.createElement("g", null, /*#__PURE__*/React__default.createElement("path", {
|
|
263
|
+
d: "M121.69,630.37v-62.3h8.01v62.3H121.69z"
|
|
264
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
265
|
+
d: "M179.27,630.37l-22.34-40.85c-1.33-2.4-2.58-4.81-3.2-6.32c0.09,1.51,0.18,4.09,0.18,6.32v40.85h-8.01v-62.3h8.01\n\t\t\tl22.34,40.85c1.33,2.4,2.58,4.81,3.2,6.32c-0.09-1.51-0.18-4.09-0.18-6.32v-40.85h8.01v62.3H179.27z"
|
|
266
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
267
|
+
d: "M266.85,608.12c0,5.79-1.25,10.86-3.92,14.86c-3.83,5.88-9.97,8.72-17.18,8.72c-8.1,0-13.8-3.56-17.44-8.63\n\t\t\tc-4.81-6.59-6.41-15.75-6.41-23.85c0.09-14.86,5.79-32.49,23.94-32.49c11.48,0,19.23,8.63,19.23,19.05c0,1.07-0.09,2.49-0.36,3.65\n\t\t\tl-7.92,0.45c0.18-0.98,0.27-2.14,0.27-3.38c0-6.85-4.01-12.64-11.21-12.64c-12.37,0-15.93,14.6-15.93,25.37\n\t\t\tc0,5.16,0.8,12.28,3.47,17.36c2.49,4.72,6.68,8.01,12.37,8.01c9.43,0,12.82-7.48,13.17-16.91L266.85,608.12z"
|
|
268
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
269
|
+
d: "M278.95,630.37v-62.3h8.01v62.3H278.95z"
|
|
270
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
271
|
+
d: "M336.53,630.37l-22.34-40.85c-1.33-2.4-2.58-4.81-3.2-6.32c0.09,1.51,0.18,4.09,0.18,6.32v40.85h-8.01v-62.3h8.01\n\t\t\tl22.34,40.85c1.34,2.4,2.58,4.81,3.2,6.32c-0.09-1.51-0.18-4.09-0.18-6.32v-40.85h8.01v62.3H336.53z"
|
|
272
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
273
|
+
d: "M360.74,630.37v-62.3h34.27v7.12h-26.26v20.03h19.14v7.12h-19.14v20.92h27.15v7.12H360.74z"
|
|
274
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
275
|
+
d: "M453.75,630.37v-37.83c0-2.22,0-4.09,0.09-6.23c-0.8,2.58-1.25,3.92-2.23,6.23l-15.75,38.72h-1.78l-15.75-38.72\n\t\t\tc-0.98-2.31-1.42-3.65-2.23-6.23c0.09,2.14,0.09,4.01,0.09,6.23v37.83h-7.92v-62.3h8.01l16.11,39.07\n\t\t\tc1.25,3.03,1.69,4.18,2.67,6.76c0.98-2.58,1.42-3.74,2.67-6.76l15.93-39.07h8.01v62.3H453.75z"
|
|
276
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
277
|
+
d: "M511.42,630.37l-4.54-14.24h-22.7l-4.54,14.24h-8.1l20.03-62.3h8.01l20.03,62.3H511.42z M496.91,584.53\n\t\t\tc-0.89-2.76-1.16-3.92-1.42-5.16c-0.27,1.25-0.53,2.4-1.42,5.16l-7.57,24.48h18.07L496.91,584.53z"
|
|
278
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
279
|
+
d: "M555.38,588.98c0.36-1.96,0.53-3.12,0.53-5.25c0-6.14-4.54-9.88-10.68-9.88s-10.68,3.74-10.68,9.88\n\t\t\tc0,7.83,8.19,9.17,15.22,11.84c7.21,2.76,16.02,6.41,16.02,17.98c0,11.3-9.08,18.16-20.47,18.16s-20.47-6.85-20.47-18.16\n\t\t\tc0-2.58,0.53-4.54,1.07-5.87l7.92-0.45c-0.62,2.05-0.98,4.01-0.98,6.32c0,7.03,5.43,11.04,12.46,11.04s12.46-4,12.46-11.04\n\t\t\tc0-8.19-8.99-10.24-14.95-12.37c-8.37-3.03-16.29-6.59-16.29-17.62c0-10.5,8.63-16.82,18.69-16.82s18.69,6.32,18.69,16.82\n\t\t\tc0,1.69-0.27,3.74-0.62,4.9L555.38,588.98z"
|
|
280
|
+
})), align === 'center' && /*#__PURE__*/React__default.createElement("g", null, /*#__PURE__*/React__default.createElement("path", {
|
|
281
|
+
d: "M319.77,626.67v-62.3h8.01v62.3H319.77z"
|
|
282
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
283
|
+
d: "M377.35,626.67l-22.34-40.85c-1.33-2.4-2.58-4.81-3.2-6.32c0.09,1.51,0.18,4.09,0.18,6.32v40.85h-8.01v-62.3h8.01\n\t\t\tl22.34,40.85c1.33,2.4,2.58,4.81,3.2,6.32c-0.09-1.51-0.18-4.09-0.18-6.32v-40.85h8.01v62.3H377.35z"
|
|
284
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
285
|
+
d: "M464.92,604.42c0,5.79-1.25,10.86-3.92,14.86c-3.83,5.88-9.97,8.72-17.18,8.72c-8.1,0-13.8-3.56-17.45-8.63\n\t\t\tc-4.81-6.59-6.41-15.75-6.41-23.85c0.09-14.86,5.79-32.49,23.94-32.49c11.48,0,19.22,8.63,19.22,19.05c0,1.07-0.09,2.49-0.36,3.65\n\t\t\tl-7.92,0.45c0.18-0.98,0.27-2.14,0.27-3.38c0-6.85-4-12.64-11.21-12.64c-12.37,0-15.93,14.6-15.93,25.37\n\t\t\tc0,5.16,0.8,12.28,3.47,17.36c2.49,4.72,6.68,8.01,12.37,8.01c9.43,0,12.82-7.48,13.17-16.91L464.92,604.42z"
|
|
286
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
287
|
+
d: "M477.03,626.67v-62.3h8.01v62.3H477.03z"
|
|
288
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
289
|
+
d: "M534.61,626.67l-22.34-40.85c-1.33-2.4-2.58-4.81-3.2-6.32c0.09,1.51,0.18,4.09,0.18,6.32v40.85h-8.01v-62.3h8.01\n\t\t\tl22.34,40.85c1.33,2.4,2.58,4.81,3.2,6.32c-0.09-1.51-0.18-4.09-0.18-6.32v-40.85h8.01v62.3H534.61z"
|
|
290
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
291
|
+
d: "M558.81,626.67v-62.3h34.27v7.12h-26.26v20.03h19.14v7.12h-19.14v20.92h27.15v7.12H558.81z"
|
|
292
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
293
|
+
d: "M651.82,626.67v-37.83c0-2.22,0-4.09,0.09-6.23c-0.8,2.58-1.25,3.92-2.23,6.23l-15.75,38.72h-1.78l-15.75-38.72\n\t\t\tc-0.98-2.31-1.42-3.65-2.23-6.23c0.09,2.14,0.09,4.01,0.09,6.23v37.83h-7.92v-62.3h8.01l16.11,39.07\n\t\t\tc1.25,3.03,1.69,4.18,2.67,6.76c0.98-2.58,1.42-3.74,2.67-6.76l15.93-39.07h8.01v62.3H651.82z"
|
|
294
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
295
|
+
d: "M709.49,626.67l-4.54-14.24h-22.7l-4.54,14.24h-8.1l20.03-62.3h8.01l20.03,62.3H709.49z M694.98,580.84\n\t\t\tc-0.89-2.76-1.16-3.92-1.42-5.16c-0.27,1.25-0.53,2.4-1.42,5.16l-7.57,24.48h18.07L694.98,580.84z"
|
|
296
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
297
|
+
d: "M753.46,585.29c0.36-1.96,0.53-3.12,0.53-5.25c0-6.14-4.54-9.88-10.68-9.88c-6.14,0-10.68,3.74-10.68,9.88\n\t\t\tc0,7.83,8.19,9.17,15.22,11.84c7.21,2.76,16.02,6.41,16.02,17.98c0,11.3-9.08,18.16-20.47,18.16s-20.47-6.85-20.47-18.16\n\t\t\tc0-2.58,0.53-4.54,1.07-5.87l7.92-0.45c-0.62,2.05-0.98,4.01-0.98,6.32c0,7.03,5.43,11.04,12.46,11.04c7.03,0,12.46-4,12.46-11.04\n\t\t\tc0-8.19-8.99-10.24-14.95-12.37c-8.37-3.03-16.29-6.59-16.29-17.62c0-10.5,8.63-16.82,18.69-16.82S762,569.36,762,579.86\n\t\t\tc0,1.69-0.27,3.74-0.62,4.9L753.46,585.29z"
|
|
154
298
|
}))));
|
|
155
299
|
};
|
|
156
300
|
|
|
@@ -2628,7 +2772,39 @@ var GridItem = /*#__PURE__*/styled.div(_templateObject$a || (_templateObject$a =
|
|
|
2628
2772
|
});
|
|
2629
2773
|
|
|
2630
2774
|
var _templateObject$b;
|
|
2631
|
-
|
|
2775
|
+
/**
|
|
2776
|
+
* # IMPORTANT
|
|
2777
|
+
* Please use the `<GridItem />` component instead of this component if possible.
|
|
2778
|
+
* This component was introduced due to incompatibilities between versions of the Chord library.
|
|
2779
|
+
*/
|
|
2780
|
+
|
|
2781
|
+
var GridItemLegacy = /*#__PURE__*/styled.div(_templateObject$b || (_templateObject$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: ", " / span\n ", ";\n\n @media ", " {\n & {\n grid-column: ", " /\n span ", ";\n }\n }\n\n @media ", " {\n & {\n grid-column: ", " / span\n ", ";\n }\n }\n"])), function (_ref) {
|
|
2782
|
+
var columnStartDesktop = _ref.columnStartDesktop;
|
|
2783
|
+
return columnStartDesktop;
|
|
2784
|
+
}, function (_ref2) {
|
|
2785
|
+
var _ref2$columnSpanDeskt = _ref2.columnSpanDesktop,
|
|
2786
|
+
columnSpanDesktop = _ref2$columnSpanDeskt === void 0 ? 1 : _ref2$columnSpanDeskt;
|
|
2787
|
+
return columnSpanDesktop;
|
|
2788
|
+
}, devices.mobile, function (_ref3) {
|
|
2789
|
+
var columnStartDevice = _ref3.columnStartDevice,
|
|
2790
|
+
columnStartSmallDevice = _ref3.columnStartSmallDevice;
|
|
2791
|
+
return columnStartSmallDevice != null ? columnStartSmallDevice : columnStartDevice;
|
|
2792
|
+
}, function (_ref4) {
|
|
2793
|
+
var _ref4$columnSpanDevic = _ref4.columnSpanDevice,
|
|
2794
|
+
columnSpanDevice = _ref4$columnSpanDevic === void 0 ? 1 : _ref4$columnSpanDevic,
|
|
2795
|
+
columnSpanSmallDevice = _ref4.columnSpanSmallDevice;
|
|
2796
|
+
return columnSpanSmallDevice != null ? columnSpanSmallDevice : columnSpanDevice;
|
|
2797
|
+
}, devices.tablet, function (_ref5) {
|
|
2798
|
+
var columnStartDevice = _ref5.columnStartDevice;
|
|
2799
|
+
return columnStartDevice;
|
|
2800
|
+
}, function (_ref6) {
|
|
2801
|
+
var _ref6$columnSpanDevic = _ref6.columnSpanDevice,
|
|
2802
|
+
columnSpanDevice = _ref6$columnSpanDevic === void 0 ? 1 : _ref6$columnSpanDevic;
|
|
2803
|
+
return columnSpanDevice;
|
|
2804
|
+
});
|
|
2805
|
+
|
|
2806
|
+
var _templateObject$c;
|
|
2807
|
+
var ImageAspectRatioWrapper = /*#__PURE__*/styled.div(_templateObject$c || (_templateObject$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n aspect-ratio: ", ";\n\n @supports not (aspect-ratio: ", ") {\n width: 100%;\n padding-top: ", "%;\n }\n\n img {\n display: block;\n width: 100%;\n height: 100%;\n object-fit: cover;\n\n @supports not (aspect-ratio: ", ") {\n position: absolute;\n top: 0;\n left: 0;\n }\n }\n"])), function (_ref) {
|
|
2632
2808
|
var _ref$aspectRatio = _ref.aspectRatio,
|
|
2633
2809
|
aspectRatio = _ref$aspectRatio === void 0 ? AspectRatio['1:1'] : _ref$aspectRatio;
|
|
2634
2810
|
return aspectRatio;
|
|
@@ -2646,8 +2822,8 @@ var ImageAspectRatioWrapper = /*#__PURE__*/styled.div(_templateObject$b || (_tem
|
|
|
2646
2822
|
return aspectRatio;
|
|
2647
2823
|
});
|
|
2648
2824
|
|
|
2649
|
-
var _templateObject$
|
|
2650
|
-
var ProgressView = /*#__PURE__*/styled.div(_templateObject$
|
|
2825
|
+
var _templateObject$d, _templateObject2$3, _templateObject3$2, _templateObject4$1, _templateObject5;
|
|
2826
|
+
var ProgressView = /*#__PURE__*/styled.div(_templateObject$d || (_templateObject$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: ", ";\n width: 100%;\n display: flex;\n flex-direction: row;\n"])), function (_ref) {
|
|
2651
2827
|
var height = _ref.height;
|
|
2652
2828
|
return height ? height + "px" : '6px';
|
|
2653
2829
|
});
|
|
@@ -2730,13 +2906,13 @@ var Progress = function Progress(_ref) {
|
|
|
2730
2906
|
}, renderSteps()));
|
|
2731
2907
|
};
|
|
2732
2908
|
|
|
2733
|
-
var _templateObject$
|
|
2734
|
-
var RadioContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
2909
|
+
var _templateObject$e, _templateObject2$4, _templateObject3$3;
|
|
2910
|
+
var RadioContainer = /*#__PURE__*/styled.div(_templateObject$e || (_templateObject$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 12px;\n"])));
|
|
2735
2911
|
var RadioLine = /*#__PURE__*/styled.div(_templateObject2$4 || (_templateObject2$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n gap: 20px;\n grid-template-columns: 1.15em 1fr;\n user-select: none;\n cursor: pointer;\n color: black;\n\n &:focus {\n outline: none;\n }\n\n input[type='radio'] {\n cursor: pointer;\n appearance: none;\n background-color: #ffffff00;\n margin: 0;\n color: black;\n width: 20px;\n height: 20px;\n border: 1px solid black;\n border-radius: 50%;\n position: relative;\n place-content: center;\n display: block;\n }\n\n input[type='radio']::before {\n content: '';\n width: 10px;\n height: 10px;\n border-radius: 50%;\n background-color: #ffffff00;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n\n input[type='radio']:checked::before {\n background-color: black;\n }\n"])));
|
|
2736
2912
|
var RadioError = /*#__PURE__*/styled.div(_templateObject3$3 || (_templateObject3$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-errorstate);\n"])));
|
|
2737
2913
|
|
|
2738
|
-
var _templateObject$
|
|
2739
|
-
var Wrapper$1 = /*#__PURE__*/styled.div(_templateObject$
|
|
2914
|
+
var _templateObject$f;
|
|
2915
|
+
var Wrapper$1 = /*#__PURE__*/styled.div(_templateObject$f || (_templateObject$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-", ");\n font-feature-settings: var(--font-feature-settings-", ");\n font-size: var(--font-size-", "-", ");\n font-weight: var(--font-weight-", "-", ");\n letter-spacing: var(--letter-spacing-", "-", ");\n line-height: var(--line-height-", "-", ");\n text-transform: var(--text-transform-", ");\n word-break: var(--word-break-", ");\n margin: var(--margin-", "-", ");\n"])), function (_ref) {
|
|
2740
2916
|
var typography = _ref.typography;
|
|
2741
2917
|
return typography;
|
|
2742
2918
|
}, function (_ref2) {
|
|
@@ -2792,9 +2968,10 @@ var StyledTag = function StyledTag(_ref) {
|
|
|
2792
2968
|
}, children);
|
|
2793
2969
|
};
|
|
2794
2970
|
var AltHeader = function AltHeader(_ref2) {
|
|
2795
|
-
var
|
|
2971
|
+
var semanticLevel = _ref2.semanticLevel,
|
|
2972
|
+
level = _ref2.level,
|
|
2796
2973
|
children = _ref2.children;
|
|
2797
|
-
var renderedTag = "h" + level;
|
|
2974
|
+
var renderedTag = semanticLevel ? "h" + semanticLevel : "h" + level;
|
|
2798
2975
|
return /*#__PURE__*/React__default.createElement(StyledTag, {
|
|
2799
2976
|
tag: renderedTag,
|
|
2800
2977
|
typography: "altHeader",
|
|
@@ -2892,8 +3069,8 @@ var Radio = function Radio(_ref) {
|
|
|
2892
3069
|
}, error)));
|
|
2893
3070
|
};
|
|
2894
3071
|
|
|
2895
|
-
var _templateObject$
|
|
2896
|
-
var Container = /*#__PURE__*/styled.div(_templateObject$
|
|
3072
|
+
var _templateObject$g, _templateObject2$5, _templateObject3$4, _templateObject4$2, _templateObject5$1, _templateObject6;
|
|
3073
|
+
var Container = /*#__PURE__*/styled.div(_templateObject$g || (_templateObject$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
2897
3074
|
var Radio$1 = /*#__PURE__*/styled.div(_templateObject2$5 || (_templateObject2$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 1px;\n left: 0;\n z-index: 1;\n box-sizing: border-box;\n width: 20px;\n height: 20px;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n border: ", ";\n background-color: ", ";\n color: ", ";\n"])), function (_ref) {
|
|
2898
3075
|
var error = _ref.error,
|
|
2899
3076
|
darkMode = _ref.darkMode,
|
|
@@ -3001,8 +3178,8 @@ var Radio2 = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
3001
3178
|
}, error)));
|
|
3002
3179
|
});
|
|
3003
3180
|
|
|
3004
|
-
var _templateObject$
|
|
3005
|
-
var ButtonsContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
3181
|
+
var _templateObject$h, _templateObject2$6, _templateObject3$5;
|
|
3182
|
+
var ButtonsContainer = /*#__PURE__*/styled.div(_templateObject$h || (_templateObject$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n"])));
|
|
3006
3183
|
var IconWrapper$1 = /*#__PURE__*/styled.div(_templateObject2$6 || (_templateObject2$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n justify-content: center;\n display: flex;\n align-items: center;\n width: var(--rotator-button-width);\n height: var(--rotator-button-width);\n background-color: var(--base-color-lightgrey);\n color: var(--base-color-black);\n\n svg {\n width: var(--rotator-button-icon-width);\n height: var(--rotator-button-icon-width);\n }\n\n svg path {\n fill: var(--base-color-black);\n }\n\n :hover {\n cursor: pointer;\n background-color: ", ";\n\n && svg path {\n fill: var(--base-color-white);\n }\n }\n\n @media ", " {\n background-color: var(--base-color-black);\n\n && svg path {\n fill: var(--base-color-white);\n }\n\n :hover {\n cursor: default;\n background-color: var(--base-color-black);\n\n && svg path {\n fill: var(--base-color-white);\n }\n }\n }\n"])), function (_ref) {
|
|
3007
3184
|
var theme = _ref.theme;
|
|
3008
3185
|
return theme.colors.primary;
|
|
@@ -3073,8 +3250,8 @@ var RotatorButtons = function RotatorButtons(_ref) {
|
|
|
3073
3250
|
}, renderNextIcon()));
|
|
3074
3251
|
};
|
|
3075
3252
|
|
|
3076
|
-
var _templateObject$
|
|
3077
|
-
var SecondaryLogoWrapper = /*#__PURE__*/styled.svg(_templateObject$
|
|
3253
|
+
var _templateObject$i;
|
|
3254
|
+
var SecondaryLogoWrapper = /*#__PURE__*/styled.svg(_templateObject$i || (_templateObject$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n path {\n fill: var(--base-color-", ");\n }\n"])), function (_ref) {
|
|
3078
3255
|
var fillColor = _ref.fillColor;
|
|
3079
3256
|
return fillColor;
|
|
3080
3257
|
});
|
|
@@ -3098,8 +3275,8 @@ var SecondaryLogo = function SecondaryLogo(_ref) {
|
|
|
3098
3275
|
})));
|
|
3099
3276
|
};
|
|
3100
3277
|
|
|
3101
|
-
var _templateObject$
|
|
3102
|
-
var SectionSplitterContainer = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
3278
|
+
var _templateObject$j, _templateObject2$7;
|
|
3279
|
+
var SectionSplitterContainer = /*#__PURE__*/styled(Grid)(_templateObject$j || (_templateObject$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 4px;\n"])));
|
|
3103
3280
|
var Splitter = /*#__PURE__*/styled.div(_templateObject2$7 || (_templateObject2$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n height: 4px;\n background: var(--base-color-lightgrey);\n"])));
|
|
3104
3281
|
|
|
3105
3282
|
var SectionSplitter = function SectionSplitter(_ref) {
|
|
@@ -3118,8 +3295,8 @@ var SectionSplitter = function SectionSplitter(_ref) {
|
|
|
3118
3295
|
}, /*#__PURE__*/React__default.createElement(Splitter, null)));
|
|
3119
3296
|
};
|
|
3120
3297
|
|
|
3121
|
-
var _templateObject$
|
|
3122
|
-
var SponsorLogoWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
3298
|
+
var _templateObject$k;
|
|
3299
|
+
var SponsorLogoWrapper = /*#__PURE__*/styled.div(_templateObject$k || (_templateObject$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--base-color-black);\n width: 172px;\n"])));
|
|
3123
3300
|
|
|
3124
3301
|
var SponsorLogo = function SponsorLogo(_ref) {
|
|
3125
3302
|
var _ref$colorLogo = _ref.colorLogo,
|
|
@@ -3329,8 +3506,8 @@ var SponsorLogo = function SponsorLogo(_ref) {
|
|
|
3329
3506
|
})))));
|
|
3330
3507
|
};
|
|
3331
3508
|
|
|
3332
|
-
var _templateObject$
|
|
3333
|
-
var CustomImage = /*#__PURE__*/styled.img(_templateObject$
|
|
3509
|
+
var _templateObject$l, _templateObject2$8;
|
|
3510
|
+
var CustomImage = /*#__PURE__*/styled.img(_templateObject$l || (_templateObject$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n max-height: 100px;\n max-width: auto;\n\n @media ", " {\n max-height: 55px;\n }\n\n @media ", " {\n max-height: 45px;\n }\n"])), devices.tablet, devices.mobile);
|
|
3334
3511
|
var SponsorshipStyledIframe = /*#__PURE__*/styled.div(_templateObject2$8 || (_templateObject2$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: transparent;\n height: 80px;\n margin: 0px;\n overflow: hidden;\n padding: 0;\n width: 80px;\n\n & > iframe {\n border: 0;\n display: block;\n margin: 0px;\n padding: 0px;\n overflow: hidden;\n width: 100%;\n height: 100%;\n }\n\n @media ", " {\n & {\n height: 40px;\n width: 40px;\n }\n & iframe {\n height: 80px;\n transform: scale(0.5) translate(-40px, -40px);\n width: 80px;\n }\n }\n"])), devices.mobile);
|
|
3335
3512
|
|
|
3336
3513
|
var DEFAULT_SPONSORSHIP_IFRAME = 'https://static.roh.org.uk/rolex/v4/rolex.html?size=80';
|
|
@@ -3363,8 +3540,8 @@ var Sponsorship = function Sponsorship(_ref) {
|
|
|
3363
3540
|
}));
|
|
3364
3541
|
};
|
|
3365
3542
|
|
|
3366
|
-
var _templateObject$
|
|
3367
|
-
var TabText = /*#__PURE__*/styled.a(_templateObject$
|
|
3543
|
+
var _templateObject$m, _templateObject2$9;
|
|
3544
|
+
var TabText = /*#__PURE__*/styled.a(_templateObject$m || (_templateObject$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\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-black);\n margin-right: 0px;\n margin-top: 5px;\n text-decoration: none;\n text-transform: uppercase;\n\n ", "\n\n @media ", " {\n ", "\n }\n"])), function (props) {
|
|
3368
3545
|
if (props.withIcon === 'left') {
|
|
3369
3546
|
return "margin-left: 5px;";
|
|
3370
3547
|
}
|
|
@@ -3463,8 +3640,8 @@ var Tab = function Tab(_ref) {
|
|
|
3463
3640
|
}));
|
|
3464
3641
|
};
|
|
3465
3642
|
|
|
3466
|
-
var _templateObject$
|
|
3467
|
-
var TabLinkWrapper = /*#__PURE__*/styled.a(_templateObject$
|
|
3643
|
+
var _templateObject$n, _templateObject2$a;
|
|
3644
|
+
var TabLinkWrapper = /*#__PURE__*/styled.a(_templateObject$n || (_templateObject$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: ", ";\n font-family: var(--font-family-navigation);\n font-size: var(--font-size-navigation);\n font-weight: var(--font-weight-navigation);\n line-height: var(--line-height-navigation);\n letter-spacing: var(--letter-spacing-navigation);\n text-transform: var(--text-transform-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\n @media ", ", ", " {\n &:hover {\n color: var(--base-color-", ");\n border-bottom: 1px solid var(--base-color-", ");\n\n && svg path {\n fill: var(--base-color-", ");\n }\n }\n }\n"])), function (_ref) {
|
|
3468
3645
|
var iconName = _ref.iconName;
|
|
3469
3646
|
return iconName ? 'calc(var(--text-link-underline-offset) - 4px) 0' : 'var(--text-link-underline-offset) 0';
|
|
3470
3647
|
}, function (_ref2) {
|
|
@@ -3515,8 +3692,8 @@ var TabLink = function TabLink(_ref) {
|
|
|
3515
3692
|
})) : null, children);
|
|
3516
3693
|
};
|
|
3517
3694
|
|
|
3518
|
-
var _templateObject$
|
|
3519
|
-
var TextAreaWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
3695
|
+
var _templateObject$o, _templateObject2$b, _templateObject3$6, _templateObject4$3;
|
|
3696
|
+
var TextAreaWrapper = /*#__PURE__*/styled.div(_templateObject$o || (_templateObject$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: ", ";\n height: ", ";\n"])), function (_ref) {
|
|
3520
3697
|
var width = _ref.width;
|
|
3521
3698
|
return width ? width + "px;" : '100%;';
|
|
3522
3699
|
}, function (_ref2) {
|
|
@@ -3639,8 +3816,8 @@ var TextArea = function TextArea(_ref) {
|
|
|
3639
3816
|
}, error))));
|
|
3640
3817
|
};
|
|
3641
3818
|
|
|
3642
|
-
var _templateObject$
|
|
3643
|
-
var Container$1 = /*#__PURE__*/styled.div(_templateObject$
|
|
3819
|
+
var _templateObject$p, _templateObject2$c, _templateObject3$7, _templateObject4$4, _templateObject5$2, _templateObject6$1;
|
|
3820
|
+
var Container$1 = /*#__PURE__*/styled.div(_templateObject$p || (_templateObject$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
3644
3821
|
var InputWrapper = /*#__PURE__*/styled.div(_templateObject2$c || (_templateObject2$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n width: auto;\n max-width: ", ";\n"])), function (_ref) {
|
|
3645
3822
|
var width = _ref.width;
|
|
3646
3823
|
if (!width) return 'none';
|
|
@@ -3766,15 +3943,89 @@ var TextField = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
3766
3943
|
}, error)));
|
|
3767
3944
|
});
|
|
3768
3945
|
|
|
3769
|
-
var _templateObject$
|
|
3770
|
-
var
|
|
3946
|
+
var _templateObject$q, _templateObject2$d, _templateObject3$8, _templateObject4$5, _templateObject5$3;
|
|
3947
|
+
var TextFieldContainer = /*#__PURE__*/styled.div(_templateObject$q || (_templateObject$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
3948
|
+
var textStyles = /*#__PURE__*/css(_templateObject2$d || (_templateObject2$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-weight: ", ";\n font-size: ", ";\n line-height: ", ";\n"])), function (_ref) {
|
|
3949
|
+
var theme = _ref.theme;
|
|
3950
|
+
return theme.fonts.desktop.weights.body[1];
|
|
3951
|
+
}, function (_ref2) {
|
|
3952
|
+
var theme = _ref2.theme;
|
|
3953
|
+
return theme.fonts.desktop.sizes.altHeaders[6];
|
|
3954
|
+
}, function (_ref3) {
|
|
3955
|
+
var theme = _ref3.theme;
|
|
3956
|
+
return theme.spacing[7];
|
|
3957
|
+
});
|
|
3958
|
+
var Input$1 = /*#__PURE__*/styled.input(_templateObject3$8 || (_templateObject3$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n\n width: ", ";\n height: 48px;\n padding: 0px 20px;\n\n border: 1px solid ", ";\n outline: none;\n\n ", "\n\n :disabled {\n background-color: ", ";\n border: 1px solid transparent;\n outline: none;\n }\n\n :focus {\n outline: ", "};\n }\n"])), textStyles, function (_ref4) {
|
|
3959
|
+
var width = _ref4.width;
|
|
3960
|
+
return width ? width + 'px' : '196px';
|
|
3961
|
+
}, function (_ref5) {
|
|
3962
|
+
var theme = _ref5.theme;
|
|
3963
|
+
return theme.colors.darkgrey;
|
|
3964
|
+
}, function (_ref6) {
|
|
3965
|
+
var error = _ref6.error,
|
|
3966
|
+
theme = _ref6.theme;
|
|
3967
|
+
if (!error) return;
|
|
3968
|
+
return "\n border: 1px solid " + theme.colors.error + ";\n ";
|
|
3969
|
+
}, function (_ref7) {
|
|
3970
|
+
var theme = _ref7.theme;
|
|
3971
|
+
return theme.colors.lightgrey;
|
|
3972
|
+
}, function (_ref8) {
|
|
3973
|
+
var darkMode = _ref8.darkMode,
|
|
3974
|
+
theme = _ref8.theme;
|
|
3975
|
+
if (darkMode) return "4px solid " + theme.colors.lemonChiffon;
|
|
3976
|
+
return "3px solid " + theme.colors.lapisLazuli;
|
|
3977
|
+
});
|
|
3978
|
+
var TextLabel$2 = /*#__PURE__*/styled.p(_templateObject4$5 || (_templateObject4$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", ";\n\n color: ", ";\n"])), textStyles, function (_ref9) {
|
|
3979
|
+
var darkMode = _ref9.darkMode,
|
|
3980
|
+
theme = _ref9.theme;
|
|
3981
|
+
return darkMode ? theme.colors.white : theme.colors.black;
|
|
3982
|
+
});
|
|
3983
|
+
var ErrorLabel$2 = /*#__PURE__*/styled.p(_templateObject5$3 || (_templateObject5$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", ";\n\n color: ", ";\n"])), textStyles, function (_ref10) {
|
|
3984
|
+
var darkMode = _ref10.darkMode,
|
|
3985
|
+
theme = _ref10.theme;
|
|
3986
|
+
return darkMode ? theme.colors.white : theme.colors.error;
|
|
3987
|
+
});
|
|
3988
|
+
|
|
3989
|
+
/**
|
|
3990
|
+
* @deprecated
|
|
3991
|
+
*
|
|
3992
|
+
* # IMPORTANT
|
|
3993
|
+
* Please use the `<TextField />` component instead of this component if possible.
|
|
3994
|
+
* This component was introduced due to incompatibilities between versions of the Chord library.
|
|
3995
|
+
* */
|
|
3996
|
+
|
|
3997
|
+
var TextFieldLegacy = function TextFieldLegacy(_ref) {
|
|
3998
|
+
var label = _ref.label,
|
|
3999
|
+
error = _ref.error,
|
|
4000
|
+
_ref$darkMode = _ref.darkMode,
|
|
4001
|
+
darkMode = _ref$darkMode === void 0 ? false : _ref$darkMode,
|
|
4002
|
+
width = _ref.width,
|
|
4003
|
+
inputProps = _objectWithoutPropertiesLoose(_ref, ["label", "error", "darkMode", "width"]);
|
|
4004
|
+
|
|
4005
|
+
return /*#__PURE__*/React__default.createElement(TextFieldContainer, null, /*#__PURE__*/React__default.createElement("label", null, /*#__PURE__*/React__default.createElement(TextLabel$2, {
|
|
4006
|
+
darkMode: darkMode,
|
|
4007
|
+
"data-testid": "text-field-text-label"
|
|
4008
|
+
}, label), /*#__PURE__*/React__default.createElement(Input$1, Object.assign({
|
|
4009
|
+
type: "text",
|
|
4010
|
+
error: error,
|
|
4011
|
+
darkMode: darkMode,
|
|
4012
|
+
"data-testid": "text-field-input",
|
|
4013
|
+
width: width
|
|
4014
|
+
}, inputProps))), error ? /*#__PURE__*/React__default.createElement(ErrorLabel$2, {
|
|
4015
|
+
darkMode: darkMode,
|
|
4016
|
+
"data-testid": "text-field-error-label"
|
|
4017
|
+
}, error) : null);
|
|
4018
|
+
};
|
|
4019
|
+
|
|
4020
|
+
var _templateObject$r, _templateObject2$e;
|
|
4021
|
+
var TextLinkWrapper = /*#__PURE__*/styled.a(_templateObject$r || (_templateObject$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-bottom: 1px solid;\n padding-bottom: ", ";\n font-family: var(--font-family-overline);\n font-size: var(--font-size-overline-1);\n font-weight: var(--font-weight-overline-1);\n line-height: var(--line-height-overline-1);\n letter-spacing: var(--letter-spacing-overline-1);\n text-transform: var(--text-transform-overline);\n color: var(--base-color-", ");\n width: fit-content;\n display: flex;\n align-items: center;\n cursor: pointer;\n text-decoration: none;\n"])), function (_ref) {
|
|
3771
4022
|
var iconName = _ref.iconName;
|
|
3772
4023
|
return iconName ? 'calc(var(--text-link-underline-offset) - 4px)' : 'var(--text-link-underline-offset)';
|
|
3773
4024
|
}, function (_ref2) {
|
|
3774
4025
|
var color = _ref2.color;
|
|
3775
4026
|
return color;
|
|
3776
4027
|
});
|
|
3777
|
-
var TextLinkIconWrapper = /*#__PURE__*/styled.span(_templateObject2$
|
|
4028
|
+
var TextLinkIconWrapper = /*#__PURE__*/styled.span(_templateObject2$e || (_templateObject2$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: var(--button-icon-width);\n height: var(--button-icon-height);\n margin-left: var(--button-icon-margin);\n"])));
|
|
3778
4029
|
|
|
3779
4030
|
var TextLink = function TextLink(_ref) {
|
|
3780
4031
|
var children = _ref.children,
|
|
@@ -3796,21 +4047,6 @@ var TextLink = function TextLink(_ref) {
|
|
|
3796
4047
|
})) : null);
|
|
3797
4048
|
};
|
|
3798
4049
|
|
|
3799
|
-
var _templateObject$q, _templateObject2$e, _templateObject3$8, _templateObject4$5;
|
|
3800
|
-
var LogoWrapper = /*#__PURE__*/styled.div(_templateObject$q || (_templateObject$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: 10px;\n margin-top: 140px;\n display: grid;\n grid-template-columns: repeat(2, auto);\n font-family: var(--font-family-header);\n font-size: ", ";\n color: ", ";\n width: auto;\n margin: auto;\n"])), function (_ref) {
|
|
3801
|
-
var fontSize = _ref.fontSize;
|
|
3802
|
-
return fontSize + 'px';
|
|
3803
|
-
}, function (_ref2) {
|
|
3804
|
-
var color = _ref2.color;
|
|
3805
|
-
return color;
|
|
3806
|
-
});
|
|
3807
|
-
var LogoRightSide = /*#__PURE__*/styled.div(_templateObject2$e || (_templateObject2$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-left: 10px;\n font-weight: 500;\n letter-spacing: 1px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n"])));
|
|
3808
|
-
var LogoLeftSide = /*#__PURE__*/styled.div(_templateObject3$8 || (_templateObject3$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-right: 1px solid ", ";\n padding-right: 10px;\n letter-spacing: 2px;\n display: flex;\n flex-direction: column;\n"])), function (_ref3) {
|
|
3809
|
-
var color = _ref3.color;
|
|
3810
|
-
return color;
|
|
3811
|
-
});
|
|
3812
|
-
var LogoLeftSideRow = /*#__PURE__*/styled.div(_templateObject4$5 || (_templateObject4$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: block;\n position: relative;\n font-weight: 400;\n"])));
|
|
3813
|
-
|
|
3814
4050
|
var TextLogoProduct;
|
|
3815
4051
|
|
|
3816
4052
|
(function (TextLogoProduct) {
|
|
@@ -3818,21 +4054,8 @@ var TextLogoProduct;
|
|
|
3818
4054
|
TextLogoProduct["Cinema"] = "CINEMA";
|
|
3819
4055
|
})(TextLogoProduct || (TextLogoProduct = {}));
|
|
3820
4056
|
|
|
3821
|
-
var
|
|
3822
|
-
|
|
3823
|
-
productName = _ref.productName,
|
|
3824
|
-
_ref$fontSize = _ref.fontSize,
|
|
3825
|
-
fontSize = _ref$fontSize === void 0 ? 12 : _ref$fontSize;
|
|
3826
|
-
return /*#__PURE__*/createElement(LogoWrapper, {
|
|
3827
|
-
color: color,
|
|
3828
|
-
fontSize: fontSize
|
|
3829
|
-
}, /*#__PURE__*/createElement(LogoLeftSide, {
|
|
3830
|
-
color: color
|
|
3831
|
-
}, /*#__PURE__*/createElement(LogoLeftSideRow, null, "ROYAL"), /*#__PURE__*/createElement(LogoLeftSideRow, null, "OPERA"), /*#__PURE__*/createElement(LogoLeftSideRow, null, "HOUSE")), /*#__PURE__*/createElement(LogoRightSide, null, productName));
|
|
3832
|
-
};
|
|
3833
|
-
|
|
3834
|
-
var _templateObject$r, _templateObject2$f, _templateObject3$9, _templateObject4$6;
|
|
3835
|
-
var TickboxError = /*#__PURE__*/styled.div(_templateObject$r || (_templateObject$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-block: 20px;\n color: var(--base-color-", ");\n"])), function (_ref) {
|
|
4057
|
+
var _templateObject$s, _templateObject2$f, _templateObject3$9, _templateObject4$6;
|
|
4058
|
+
var TickboxError = /*#__PURE__*/styled.div(_templateObject$s || (_templateObject$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-block: 20px;\n color: var(--base-color-", ");\n"])), function (_ref) {
|
|
3836
4059
|
var dark = _ref.dark;
|
|
3837
4060
|
return dark ? 'white' : 'errorstate';
|
|
3838
4061
|
});
|
|
@@ -3953,8 +4176,8 @@ var Tickbox = function Tickbox(_ref) {
|
|
|
3953
4176
|
}, error)));
|
|
3954
4177
|
};
|
|
3955
4178
|
|
|
3956
|
-
var _templateObject$
|
|
3957
|
-
var Container$2 = /*#__PURE__*/styled.div(_templateObject$
|
|
4179
|
+
var _templateObject$t, _templateObject2$g, _templateObject3$a, _templateObject4$7, _templateObject5$4, _templateObject6$2;
|
|
4180
|
+
var Container$2 = /*#__PURE__*/styled.div(_templateObject$t || (_templateObject$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
3958
4181
|
var Tickbox$1 = /*#__PURE__*/styled.div(_templateObject2$g || (_templateObject2$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 1px;\n left: 0;\n z-index: 1;\n box-sizing: border-box;\n width: 20px;\n height: 20px;\n display: flex;\n align-items: center;\n justify-content: center;\n border: ", ";\n background-color: ", ";\n color: ", ";\n"])), function (_ref) {
|
|
3959
4182
|
var error = _ref.error,
|
|
3960
4183
|
darkMode = _ref.darkMode,
|
|
@@ -3990,7 +4213,7 @@ var TickboxLabel$2 = /*#__PURE__*/styled.label(_templateObject3$a || (_templateO
|
|
|
3990
4213
|
return '3px solid var(--base-color-lapislazuli)';
|
|
3991
4214
|
});
|
|
3992
4215
|
var TickboxIcon = /*#__PURE__*/styled.div(_templateObject4$7 || (_templateObject4$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n color: inherit;\n svg {\n font-size: 12px;\n width: 1em;\n height: 1em;\n fill: currentColor;\n color: inherit;\n path {\n fill: currentColor;\n color: inherit;\n }\n }\n input[type='checkbox']:checked + ", " & {\n display: block;\n }\n"])), Tickbox$1);
|
|
3993
|
-
var TextLabel$
|
|
4216
|
+
var TextLabel$3 = /*#__PURE__*/styled.div(_templateObject5$4 || (_templateObject5$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (_ref6) {
|
|
3994
4217
|
var darkMode = _ref6.darkMode,
|
|
3995
4218
|
disabled = _ref6.disabled;
|
|
3996
4219
|
if (darkMode && disabled) return 'var(--base-color-lightgrey)';
|
|
@@ -3998,7 +4221,7 @@ var TextLabel$2 = /*#__PURE__*/styled.div(_templateObject5$3 || (_templateObject
|
|
|
3998
4221
|
if (disabled) return 'var(--base-color-darkgrey)';
|
|
3999
4222
|
return 'var(--base-color-black)';
|
|
4000
4223
|
});
|
|
4001
|
-
var ErrorLabel$
|
|
4224
|
+
var ErrorLabel$3 = /*#__PURE__*/styled.div(_templateObject6$2 || (_templateObject6$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 20px;\n color: ", ";\n"])), function (_ref7) {
|
|
4002
4225
|
var darkMode = _ref7.darkMode;
|
|
4003
4226
|
if (darkMode) return 'var(--base-color-white)';
|
|
4004
4227
|
return 'var(--base-color-errorstate)';
|
|
@@ -4050,13 +4273,13 @@ var Tickbox2 = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
4050
4273
|
blackBox: blackBox
|
|
4051
4274
|
}, /*#__PURE__*/React__default.createElement(TickboxIcon, null, /*#__PURE__*/React__default.createElement(Icon, {
|
|
4052
4275
|
iconName: "Tick"
|
|
4053
|
-
}))), /*#__PURE__*/React__default.createElement(TextLabel$
|
|
4276
|
+
}))), /*#__PURE__*/React__default.createElement(TextLabel$3, {
|
|
4054
4277
|
disabled: disabled,
|
|
4055
4278
|
darkMode: darkMode,
|
|
4056
4279
|
"data-testid": "tickbox-content"
|
|
4057
4280
|
}, /*#__PURE__*/React__default.createElement(BodyText, {
|
|
4058
4281
|
level: 1
|
|
4059
|
-
}, children))), !!error && /*#__PURE__*/React__default.createElement(ErrorLabel$
|
|
4282
|
+
}, children))), !!error && /*#__PURE__*/React__default.createElement(ErrorLabel$3, {
|
|
4060
4283
|
darkMode: darkMode,
|
|
4061
4284
|
"data-testid": "tickbox-error-label"
|
|
4062
4285
|
}, /*#__PURE__*/React__default.createElement(AltHeader, {
|
|
@@ -4064,8 +4287,8 @@ var Tickbox2 = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
4064
4287
|
}, error)));
|
|
4065
4288
|
});
|
|
4066
4289
|
|
|
4067
|
-
var _templateObject$
|
|
4068
|
-
var TimerWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
4290
|
+
var _templateObject$u, _templateObject2$h, _templateObject3$b, _templateObject4$8, _templateObject5$5, _templateObject6$3, _templateObject7, _templateObject8;
|
|
4291
|
+
var TimerWrapper = /*#__PURE__*/styled.div(_templateObject$u || (_templateObject$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-", ");\n"])), function (_ref) {
|
|
4069
4292
|
var color = _ref.color;
|
|
4070
4293
|
return color;
|
|
4071
4294
|
});
|
|
@@ -4075,7 +4298,7 @@ var Line = /*#__PURE__*/styled.div(_templateObject2$h || (_templateObject2$h = /
|
|
|
4075
4298
|
}, devices.mobileAndTablet);
|
|
4076
4299
|
var TitleWrapper = /*#__PURE__*/styled.div(_templateObject3$b || (_templateObject3$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 16px;\n\n @media ", " {\n margin-bottom: 8px;\n }\n"])), devices.mobileAndTablet);
|
|
4077
4300
|
var ValuesWrapper = /*#__PURE__*/styled.div(_templateObject4$8 || (_templateObject4$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\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 display: flex;\n\n @media ", " {\n font-size: var(--font-size-header-5);\n }\n"])), devices.tablet);
|
|
4078
|
-
var TimerLabel = /*#__PURE__*/styled.div(_templateObject5$
|
|
4301
|
+
var TimerLabel = /*#__PURE__*/styled.div(_templateObject5$5 || (_templateObject5$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-overline);\n font-size: var(--font-size-overline-1);\n font-weight: var(--font-weight-overline-1);\n line-height: var(--line-height-overline-1);\n letter-spacing: var(--letter-spacing-overline-1);\n text-transform: var(--text-transform-overline);\n margin-top: 4px;\n"])));
|
|
4079
4302
|
var TimerValueSeparator = /*#__PURE__*/styled.div(_templateObject6$3 || (_templateObject6$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0 20px;\n\n @media ", " {\n margin: 0 12px;\n }\n\n @media ", " {\n margin: 0 12px;\n }\n"])), devices.tablet, devices.mobile);
|
|
4080
4303
|
var TimerValueWrapper = /*#__PURE__*/styled.div(_templateObject7 || (_templateObject7 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
4081
4304
|
var TimerValue = /*#__PURE__*/styled.div(_templateObject8 || (_templateObject8 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
@@ -4173,8 +4396,8 @@ var Timer = function Timer(_ref) {
|
|
|
4173
4396
|
}));
|
|
4174
4397
|
};
|
|
4175
4398
|
|
|
4176
|
-
var _templateObject$
|
|
4177
|
-
var TypeTagsContainer = /*#__PURE__*/styled.ul(_templateObject$
|
|
4399
|
+
var _templateObject$v;
|
|
4400
|
+
var TypeTagsContainer = /*#__PURE__*/styled.ul(_templateObject$v || (_templateObject$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n list-style-type: none;\n margin: 0;\n padding: 0;\n\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"])));
|
|
4178
4401
|
|
|
4179
4402
|
var TypeTags = function TypeTags(_ref) {
|
|
4180
4403
|
var list = _ref.list;
|
|
@@ -4916,12 +5139,12 @@ var runtime_1 = /*#__PURE__*/createCommonjsModule(function (module) {
|
|
|
4916
5139
|
}
|
|
4917
5140
|
});
|
|
4918
5141
|
|
|
4919
|
-
var _templateObject$
|
|
4920
|
-
var VideoPlayButton = /*#__PURE__*/styled.button(_templateObject$
|
|
5142
|
+
var _templateObject$w, _templateObject2$i, _templateObject3$c, _templateObject4$9, _templateObject5$6, _templateObject6$4, _templateObject7$1, _templateObject8$1, _templateObject9, _templateObject10;
|
|
5143
|
+
var VideoPlayButton = /*#__PURE__*/styled.button(_templateObject$w || (_templateObject$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 48px;\n height: 48px;\n border-radius: 50%;\n background-color: #fff;\n border: none;\n padding: 12px;\n cursor: pointer;\n"])));
|
|
4921
5144
|
var VideoFullscreenButton = /*#__PURE__*/styled.button(_templateObject2$i || (_templateObject2$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 56px;\n height: 36px;\n background-color: rgb(26, 26, 26, 0.6);\n border-radius: 5px;\n padding: 5px 14px;\n border: none;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n"])));
|
|
4922
5145
|
var VideoControlsWrapper = /*#__PURE__*/styled.div(_templateObject3$c || (_templateObject3$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: 0;\n width: 100%;\n"])));
|
|
4923
|
-
var VideoControlsInnerWrapper = /*#__PURE__*/styled.div(_templateObject4$9 || (_templateObject4$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin:
|
|
4924
|
-
var LeftWrapper = /*#__PURE__*/styled.div(_templateObject5$
|
|
5146
|
+
var VideoControlsInnerWrapper = /*#__PURE__*/styled.div(_templateObject4$9 || (_templateObject4$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin: 0 40px 17px 30px;\n"])));
|
|
5147
|
+
var LeftWrapper = /*#__PURE__*/styled.div(_templateObject5$6 || (_templateObject5$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n"])));
|
|
4925
5148
|
var VideoVolume = /*#__PURE__*/styled.input(_templateObject6$4 || (_templateObject6$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100px;\n margin-left: 24px;\n"])));
|
|
4926
5149
|
var VideoMute = /*#__PURE__*/styled.button(_templateObject7$1 || (_templateObject7$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 17px;\n height: 17px;\n background: none;\n border: none;\n padding: 0;\n svg {\n width: 100%;\n height: 100%;\n }\n cursor: pointer;\n"])));
|
|
4927
5150
|
var thumbStyles = /*#__PURE__*/css(_templateObject8$1 || (_templateObject8$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n -webkit-appearance: none;\n appearance: none;\n border: none;\n height: 8px;\n width: 8px;\n border-radius: 50%;\n background: #ffffff;\n border: none;\n transform: translateY(-25%);\n"])));
|
|
@@ -4990,6 +5213,16 @@ var VideoControls = function VideoControls(_ref2) {
|
|
|
4990
5213
|
video.loop = loop;
|
|
4991
5214
|
}
|
|
4992
5215
|
}, [loop]);
|
|
5216
|
+
useEffect(function () {
|
|
5217
|
+
var handleFullscreenChange = function handleFullscreenChange() {
|
|
5218
|
+
setIsFullscreen(!!document.fullscreenElement);
|
|
5219
|
+
};
|
|
5220
|
+
|
|
5221
|
+
document.addEventListener('fullscreenchange', handleFullscreenChange);
|
|
5222
|
+
return function () {
|
|
5223
|
+
document.removeEventListener('fullscreenchange', handleFullscreenChange);
|
|
5224
|
+
};
|
|
5225
|
+
}, []);
|
|
4993
5226
|
var handleFullscreen = useCallback( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee() {
|
|
4994
5227
|
var videoContainer;
|
|
4995
5228
|
return runtime_1.wrap(function _callee$(_context) {
|
|
@@ -5124,8 +5357,8 @@ var VideoControls = function VideoControls(_ref2) {
|
|
|
5124
5357
|
})));
|
|
5125
5358
|
};
|
|
5126
5359
|
|
|
5127
|
-
var _templateObject$
|
|
5128
|
-
var StepperWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
5360
|
+
var _templateObject$x, _templateObject2$j, _templateObject3$d, _templateObject4$a, _templateObject5$7;
|
|
5361
|
+
var StepperWrapper = /*#__PURE__*/styled.div(_templateObject$x || (_templateObject$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n justify-content: left;\n align-items: left;\n"])));
|
|
5129
5362
|
var StepperError = /*#__PURE__*/styled.div(_templateObject2$j || (_templateObject2$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-", ");\n margin-block: 15px 0;\n\n * {\n margin: 0;\n }\n"])), function (_ref) {
|
|
5130
5363
|
var darkMode = _ref.darkMode;
|
|
5131
5364
|
return darkMode ? 'white' : 'errorstate';
|
|
@@ -5156,7 +5389,7 @@ var StepperValue = /*#__PURE__*/styled.input(_templateObject4$a || (_templateObj
|
|
|
5156
5389
|
var disabled = _ref7.disabled;
|
|
5157
5390
|
return disabled ? 'not-allowed' : 'text';
|
|
5158
5391
|
});
|
|
5159
|
-
var StepperButton = /*#__PURE__*/styled.div(_templateObject5$
|
|
5392
|
+
var StepperButton = /*#__PURE__*/styled.div(_templateObject5$7 || (_templateObject5$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: ", ";\n\n span {\n display: flex;\n justify-content: center;\n }\n\n svg {\n width: 40%;\n height: auto;\n }\n"])), function (_ref8) {
|
|
5160
5393
|
var disabled = _ref8.disabled;
|
|
5161
5394
|
return disabled ? 'not-allowed' : 'pointer';
|
|
5162
5395
|
});
|
|
@@ -5352,8 +5585,8 @@ var Component = function Component(_ref) {
|
|
|
5352
5585
|
}, error)));
|
|
5353
5586
|
};
|
|
5354
5587
|
|
|
5355
|
-
var _templateObject$
|
|
5356
|
-
var NavigationWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
5588
|
+
var _templateObject$y, _templateObject2$k, _templateObject3$e, _templateObject4$b, _templateObject5$8, _templateObject6$5, _templateObject7$2, _templateObject8$2, _templateObject9$1, _templateObject10$1, _templateObject11;
|
|
5589
|
+
var NavigationWrapper = /*#__PURE__*/styled.div(_templateObject$y || (_templateObject$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n ", "\n }\n"])), devices.mobileAndTablet, function (_ref) {
|
|
5357
5590
|
var isMenuOpen = _ref.isMenuOpen;
|
|
5358
5591
|
return isMenuOpen && "\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: " + zIndexes.overlay + ";\n background-color: var(--base-color-white);\n overflow-y: auto;\n scrollbar-width: none;\n ::-webkit-scrollbar {\n display: none;\n }\n ";
|
|
5359
5592
|
});
|
|
@@ -5363,7 +5596,7 @@ var SearchBackground = /*#__PURE__*/styled.div(_templateObject4$b || (_templateO
|
|
|
5363
5596
|
var visible = _ref2.visible;
|
|
5364
5597
|
return visible ? 'visible' : 'hidden';
|
|
5365
5598
|
}, zIndexes.search, devices.mobile);
|
|
5366
|
-
var GridItemSearch = /*#__PURE__*/styled(GridItem)(_templateObject5$
|
|
5599
|
+
var GridItemSearch = /*#__PURE__*/styled(GridItem)(_templateObject5$8 || (_templateObject5$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n visibility: ", ";\n background-color: var(--base-color-white);\n border-top: 1px solid var(--base-color-light-grey);\n width: 100%;\n position: absolute;\n top: 140px;\n z-index: ", ";\n height: 100px;\n\n @media ", " {\n height: 100%;\n top: 80px;\n }\n"])), function (_ref3) {
|
|
5367
5600
|
var visible = _ref3.visible;
|
|
5368
5601
|
return visible ? 'visible' : 'hidden';
|
|
5369
5602
|
}, zIndexes.search, devices.mobile);
|
|
@@ -5377,10 +5610,10 @@ var NavContainer = /*#__PURE__*/styled.div(_templateObject9$1 || (_templateObjec
|
|
|
5377
5610
|
var NavContainerGridItem = /*#__PURE__*/styled(GridItem)(_templateObject10$1 || (_templateObject10$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n grid-column: 3 / span 14;\n }\n"])), devices.desktop);
|
|
5378
5611
|
var NavTopContainer = /*#__PURE__*/styled.div(_templateObject11 || (_templateObject11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 26px;\n right: 50px;\n top: 20px;\n position: absolute;\n\n @media ", " {\n margin-top: 1px;\n position: inherit;\n }\n"])), devices.mobileAndTablet);
|
|
5379
5612
|
|
|
5380
|
-
var _templateObject$
|
|
5381
|
-
var LogoWrapper
|
|
5613
|
+
var _templateObject$z;
|
|
5614
|
+
var LogoWrapper = /*#__PURE__*/styled.div(_templateObject$z || (_templateObject$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 66px;\n height: auto;\n cursor: pointer;\n & img {\n width: auto;\n height: 100%;\n }\n"])));
|
|
5382
5615
|
|
|
5383
|
-
var Logo
|
|
5616
|
+
var Logo = function Logo(_ref) {
|
|
5384
5617
|
var _ref$id = _ref.id,
|
|
5385
5618
|
id = _ref$id === void 0 ? 'Logo' : _ref$id,
|
|
5386
5619
|
_ref$dataRoh = _ref.dataRoh,
|
|
@@ -5396,7 +5629,7 @@ var Logo$1 = function Logo(_ref) {
|
|
|
5396
5629
|
rel: "noopener noreferrer",
|
|
5397
5630
|
href: urlLink,
|
|
5398
5631
|
title: title
|
|
5399
|
-
}, /*#__PURE__*/React__default.createElement(LogoWrapper
|
|
5632
|
+
}, /*#__PURE__*/React__default.createElement(LogoWrapper, {
|
|
5400
5633
|
id: id,
|
|
5401
5634
|
className: "logoImg"
|
|
5402
5635
|
}, /*#__PURE__*/React__default.createElement("picture", null, /*#__PURE__*/React__default.createElement("source", {
|
|
@@ -5407,11 +5640,11 @@ var Logo$1 = function Logo(_ref) {
|
|
|
5407
5640
|
}))));
|
|
5408
5641
|
};
|
|
5409
5642
|
|
|
5410
|
-
var _templateObject$
|
|
5411
|
-
var NavTopContainer$1 = /*#__PURE__*/styled.div(_templateObject$
|
|
5643
|
+
var _templateObject$A;
|
|
5644
|
+
var NavTopContainer$1 = /*#__PURE__*/styled.div(_templateObject$A || (_templateObject$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n column-gap: 16px;\n justify-content: flex-end;\n height: 26px;\n\n @media ", " {\n column-gap: 8px;\n }\n"])), devices.mobile);
|
|
5412
5645
|
|
|
5413
|
-
var _templateObject$
|
|
5414
|
-
var BasketContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
5646
|
+
var _templateObject$B, _templateObject2$l, _templateObject3$f, _templateObject4$c;
|
|
5647
|
+
var BasketContainer = /*#__PURE__*/styled.div(_templateObject$B || (_templateObject$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n cursor: pointer;\n border-bottom: 1px solid var(--base-color-transparent);\n\n ", "\n\n :hover {\n border-bottom: 1px solid var(--base-color-", ");\n && a {\n color: var(--base-color-", ");\n }\n && svg path {\n fill: var(--base-color-", ");\n }\n }\n\n ", "\n"])), function (_ref) {
|
|
5415
5648
|
var selected = _ref.selected,
|
|
5416
5649
|
colorPrimary = _ref.colorPrimary;
|
|
5417
5650
|
|
|
@@ -5599,8 +5832,8 @@ var Basket$1 = function Basket(_ref) {
|
|
|
5599
5832
|
}, expiryTime ? basketText : text) : ''));
|
|
5600
5833
|
};
|
|
5601
5834
|
|
|
5602
|
-
var _templateObject$
|
|
5603
|
-
var SearchContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
5835
|
+
var _templateObject$C, _templateObject2$m;
|
|
5836
|
+
var SearchContainer = /*#__PURE__*/styled.div(_templateObject$C || (_templateObject$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n cursor: pointer;\n border-bottom: 1px solid var(--base-color-transparent);\n ", "\n\n :hover {\n border-bottom: 1px solid var(--base-color-", ");\n && svg path {\n fill: var(--base-color-", ");\n }\n }\n"])), function (_ref) {
|
|
5604
5837
|
var selected = _ref.selected,
|
|
5605
5838
|
colorPrimary = _ref.colorPrimary;
|
|
5606
5839
|
|
|
@@ -5892,8 +6125,8 @@ var NavTop = function NavTop(_ref) {
|
|
|
5892
6125
|
}));
|
|
5893
6126
|
};
|
|
5894
6127
|
|
|
5895
|
-
var _templateObject$
|
|
5896
|
-
var TabsContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
6128
|
+
var _templateObject$D, _templateObject2$n, _templateObject3$g, _templateObject4$d;
|
|
6129
|
+
var TabsContainer = /*#__PURE__*/styled.div(_templateObject$D || (_templateObject$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: row;\n column-gap: 32px;\n"])));
|
|
5897
6130
|
var ItemsContainer = /*#__PURE__*/styled.div(_templateObject2$n || (_templateObject2$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: row;\n column-gap: 32px;\n\n @media ", " {\n column-gap: 15px;\n }\n\n @media ", ", ", " {\n div:last-child > div {\n right: 1px;\n }\n }\n\n @media ", " {\n ", "\n }\n"])), devices.desktop, devices.desktop, devices.largeDesktop, devices.mobileAndTablet, function (props) {
|
|
5898
6131
|
if (props.showMenu) {
|
|
5899
6132
|
return "\n display: flex;\n flex-direction: column;\n row-gap: 32px;\n ";
|
|
@@ -6035,11 +6268,11 @@ var Tabs = function Tabs(_ref) {
|
|
|
6035
6268
|
}, "MENU"))));
|
|
6036
6269
|
};
|
|
6037
6270
|
|
|
6038
|
-
var _templateObject$
|
|
6039
|
-
var SearchBarContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
6271
|
+
var _templateObject$E, _templateObject2$o, _templateObject3$h, _templateObject5$9, _templateObject6$6, _templateObject7$3;
|
|
6272
|
+
var SearchBarContainer = /*#__PURE__*/styled.div(_templateObject$E || (_templateObject$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n column-gap: 64px;\n justify-content: space-between;\n align-items: center;\n height: 100%;\n background-color: var(--base-color-transparent);\n\n @media ", " {\n column-gap: 12px;\n }\n"])), devices.mobile);
|
|
6040
6273
|
var SvgContainerSearch = /*#__PURE__*/styled.div(_templateObject2$o || (_templateObject2$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n svg {\n width: var(--navigation-xlarge-gap);\n height: var(--navigation-xlarge-gap);\n }\n"])));
|
|
6041
6274
|
var SvgContainerClose = /*#__PURE__*/styled.div(_templateObject3$h || (_templateObject3$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n svg {\n width: var(--navigation-large-gap);\n height: var(--navigation-large-gap);\n }\n\n :hover {\n cursor: pointer;\n && svg path {\n fill: var(--base-color-navigation);\n }\n }\n"])));
|
|
6042
|
-
var InputContainer = /*#__PURE__*/styled.div(_templateObject5$
|
|
6275
|
+
var InputContainer = /*#__PURE__*/styled.div(_templateObject5$9 || (_templateObject5$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: blue;\n width: 100%;\n\n input {\n font-size: var(--font-size-search);\n font-family: var(--font-family-search);\n border: none;\n border-radius: 0;\n outline: none;\n outline-color: var(--base-color-white);\n height: 48px;\n box-sizing: border-box;\n width: 100%;\n -webkit-appearance: none;\n\n &.search-input {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n @media ", " {\n column-gap: 24px;\n }\n }\n"])), devices.mobile);
|
|
6043
6276
|
var SearchLinkContainer = /*#__PURE__*/styled.div(_templateObject6$6 || (_templateObject6$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n display: none;\n }\n"])), devices.mobile);
|
|
6044
6277
|
var SearchArrowContainer = /*#__PURE__*/styled.a(_templateObject7$3 || (_templateObject7$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n height: 24px;\n width: 24px;\n\n @media ", " {\n display: block;\n }\n"])), devices.mobile);
|
|
6045
6278
|
|
|
@@ -6222,7 +6455,7 @@ var Navigation = function Navigation(_ref) {
|
|
|
6222
6455
|
columnSpanDesktop: 1,
|
|
6223
6456
|
columnStartDevice: 2,
|
|
6224
6457
|
columnSpanDevice: 2
|
|
6225
|
-
}, /*#__PURE__*/React__default.createElement(LogoContainer, null, /*#__PURE__*/React__default.createElement(Logo
|
|
6458
|
+
}, /*#__PURE__*/React__default.createElement(LogoContainer, null, /*#__PURE__*/React__default.createElement(Logo, {
|
|
6226
6459
|
urlLink: logoLink,
|
|
6227
6460
|
desktopImage: desktopLogoUrl,
|
|
6228
6461
|
devicesImage: devicesLogoUrl
|
|
@@ -6273,16 +6506,16 @@ var Navigation = function Navigation(_ref) {
|
|
|
6273
6506
|
})))));
|
|
6274
6507
|
};
|
|
6275
6508
|
|
|
6276
|
-
var _templateObject$
|
|
6277
|
-
var FooterSection = /*#__PURE__*/styled.section(_templateObject$
|
|
6509
|
+
var _templateObject$F, _templateObject2$p, _templateObject3$i, _templateObject4$e, _templateObject5$a, _templateObject6$7;
|
|
6510
|
+
var FooterSection = /*#__PURE__*/styled.section(_templateObject$F || (_templateObject$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--base-color-black);\n color: var(--base-color-white);\n"])));
|
|
6278
6511
|
var FooterContainer = /*#__PURE__*/styled.div(_templateObject2$p || (_templateObject2$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--footer-height);\n padding-top: var(--footer-padding-top);\n padding-bottom: var(--footer-padding-bottom);\n display: grid;\n grid-template-rows:\n min-content var(--footer-vertical-spacing-lg) min-content var(--footer-vertical-spacing-lg) min-content var(\n --footer-vertical-spacing-sm\n )\n min-content;\n grid-template-areas:\n 'row1'\n '.'\n 'row2'\n '.'\n 'row3'\n '.'\n 'row4';\n"])));
|
|
6279
6512
|
var PolicyLinksRow = /*#__PURE__*/styled.div(_templateObject3$i || (_templateObject3$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: row1;\n justify-self: center;\n\n @media ", " {\n & {\n justify-self: start;\n grid-area: row2;\n }\n }\n"])), devices.mobile);
|
|
6280
6513
|
var ContactNewsletterRow = /*#__PURE__*/styled.div(_templateObject4$e || (_templateObject4$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: row2;\n\n @media ", " {\n & {\n grid-area: row1;\n }\n }\n"])), devices.mobile);
|
|
6281
|
-
var ArtsLogoRow = /*#__PURE__*/styled.div(_templateObject5$
|
|
6514
|
+
var ArtsLogoRow = /*#__PURE__*/styled.div(_templateObject5$a || (_templateObject5$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: row3;\n justify-self: center;\n\n @media ", " {\n justify-self: start;\n }\n"])), devices.mobile);
|
|
6282
6515
|
var AdditionalInfo = /*#__PURE__*/styled.p(_templateObject6$7 || (_templateObject6$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: row4;\n font-family: var(--font-family-body);\n font-size: var(--font-size-body-3);\n line-height: var(--line-height-body-3);\n text-align: center;\n margin: 0;\n padding: 0;\n\n @media ", " {\n text-align: left;\n }\n"])), devices.mobile);
|
|
6283
6516
|
|
|
6284
|
-
var _templateObject$
|
|
6285
|
-
var PolicyLinksList = /*#__PURE__*/styled.ul(_templateObject$
|
|
6517
|
+
var _templateObject$G, _templateObject2$q, _templateObject3$j;
|
|
6518
|
+
var PolicyLinksList = /*#__PURE__*/styled.ul(_templateObject$G || (_templateObject$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0 auto;\n padding: 0;\n list-style: none;\n display: flex;\n gap: var(--footer-items-gap);\n\n @media ", " {\n & {\n margin: 0;\n flex-direction: column;\n }\n }\n"])), devices.mobile);
|
|
6286
6519
|
var PolicyLinkItem = /*#__PURE__*/styled.li(_templateObject2$q || (_templateObject2$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-overline);\n font-size: var(--font-size-overline-1);\n font-weight: var(--font-weight-overline-1);\n line-height: var(--line-height-overline-1);\n letter-spacing: var(--letter-spacing-overline-1);\n text-transform: var(--text-transform-overline);\n text-align: center;\n\n @media ", " {\n & {\n text-align: left;\n }\n }\n"])), devices.mobile);
|
|
6287
6520
|
var PolicyLink = /*#__PURE__*/styled.a(_templateObject3$j || (_templateObject3$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: fit-content;\n text-decoration: none;\n text-transform: uppercase;\n color: var(--base-color-white);\n cursor: pointer;\n"])));
|
|
6288
6521
|
|
|
@@ -6300,12 +6533,12 @@ var PolicyLinks = function PolicyLinks(_ref) {
|
|
|
6300
6533
|
}));
|
|
6301
6534
|
};
|
|
6302
6535
|
|
|
6303
|
-
var _templateObject$
|
|
6304
|
-
var ContactNewsletterWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
6536
|
+
var _templateObject$H, _templateObject2$r, _templateObject3$k, _templateObject4$f, _templateObject5$b, _templateObject6$8, _templateObject7$4, _templateObject8$3;
|
|
6537
|
+
var ContactNewsletterWrapper = /*#__PURE__*/styled.div(_templateObject$H || (_templateObject$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: calc(50% - 1px) 2px calc(50% - 1px);\n grid-template-rows: 100px;\n gap: 0;\n\n @media ", " {\n & {\n display: grid;\n grid-template-columns: 100%;\n grid-template-rows: min-content min-content;\n gap: var(--footer-vertical-spacing-lg);\n }\n }\n"])), devices.mobile);
|
|
6305
6538
|
var ContactNewsletterSeparator = /*#__PURE__*/styled.div(_templateObject2$r || (_templateObject2$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: 2;\n justify-self: center;\n height: 100%;\n border: 1px solid var(--base-color-white);\n\n @media ", " {\n & {\n grid-column: auto;\n display: none;\n }\n }\n"])), devices.mobile);
|
|
6306
6539
|
var SignUpWrapper = /*#__PURE__*/styled.div(_templateObject3$k || (_templateObject3$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: 1;\n padding-top: 9px;\n justify-self: center;\n display: flex;\n flex-direction: column;\n align-items: center;\n\n @media ", " {\n & {\n grid-column: auto;\n align-items: start;\n justify-self: start;\n padding-top: 0;\n }\n }\n"])), devices.mobile);
|
|
6307
6540
|
var SignUpText = /*#__PURE__*/styled.p(_templateObject4$f || (_templateObject4$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-size: var(--font-size-body-2);\n line-height: var(--line-height-body-2);\n width: 60%;\n margin: 0 auto;\n height: 60px;\n text-align: center;\n\n @media ", " {\n & {\n width: 100%;\n height: auto;\n text-align: left;\n font-size: 14px;\n margin-bottom: var(--footer-vertical-spacing-lg);\n }\n }\n"])), devices.mobile);
|
|
6308
|
-
var ContactWrapper = /*#__PURE__*/styled.div(_templateObject5$
|
|
6541
|
+
var ContactWrapper = /*#__PURE__*/styled.div(_templateObject5$b || (_templateObject5$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: 3;\n justify-self: center;\n display: flex;\n flex-direction: column;\n align-items: center;\n padding-top: 9px;\n\n @media ", " {\n & {\n grid-column: auto;\n align-items: start;\n justify-self: start;\n padding-top: 0;\n }\n }\n"])), devices.mobile);
|
|
6309
6542
|
var MediaLinksWrapper = /*#__PURE__*/styled.div(_templateObject6$8 || (_templateObject6$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n gap: var(--footer-media-gap);\n height: 60px;\n\n @media ", " {\n & {\n height: auto;\n margin-bottom: var(--footer-vertical-spacing-lg);\n }\n }\n"])), devices.mobile);
|
|
6310
6543
|
var MediaIconWrapper = /*#__PURE__*/styled.a(_templateObject7$4 || (_templateObject7$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--footer-media-icon-height);\n width: var(--footer-media-icon-width);\n"])));
|
|
6311
6544
|
var TextLinkWrapper$1 = /*#__PURE__*/styled.div(_templateObject8$3 || (_templateObject8$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n &&& {\n font-family: var(--font-family-overline);\n font-size: var(--font-size-overline-1);\n font-weight: var(--font-weight-overline-1);\n line-height: var(--line-height-overline-1);\n letter-spacing: var(--letter-spacing-overline-1);\n text-transform: var(--text-transform-overline);\n }\n"])));
|
|
@@ -6372,9 +6605,9 @@ var Footer = function Footer(_ref) {
|
|
|
6372
6605
|
}, additionalInfo)))));
|
|
6373
6606
|
};
|
|
6374
6607
|
|
|
6375
|
-
var _templateObject$
|
|
6608
|
+
var _templateObject$I, _templateObject2$s, _templateObject3$l, _templateObject4$g, _templateObject5$c, _templateObject6$9;
|
|
6376
6609
|
var LIST_ITEM_GAP = 32;
|
|
6377
|
-
var AnchorTabbarWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
6610
|
+
var AnchorTabbarWrapper = /*#__PURE__*/styled.div(_templateObject$I || (_templateObject$I = /*#__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) {
|
|
6378
6611
|
var bottomBorder = _ref.bottomBorder;
|
|
6379
6612
|
return bottomBorder ? '2px solid var(--base-color-light-grey)' : 'none';
|
|
6380
6613
|
}, zIndexes.anchor);
|
|
@@ -6391,7 +6624,7 @@ var TabsList = /*#__PURE__*/styled.ul(_templateObject4$g || (_templateObject4$g
|
|
|
6391
6624
|
hasTwoArrows = _ref4.hasTwoArrows;
|
|
6392
6625
|
return tabsOverflow && hasTwoArrows ? 'calc(100% - 50px)' : '100%';
|
|
6393
6626
|
});
|
|
6394
|
-
var ArrowsContainer = /*#__PURE__*/styled.div(_templateObject5$
|
|
6627
|
+
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) {
|
|
6395
6628
|
var fullWidth = _ref5.fullWidth;
|
|
6396
6629
|
return fullWidth ? '74px' : '46px';
|
|
6397
6630
|
});
|
|
@@ -6638,8 +6871,8 @@ var AnchorTabBar = function AnchorTabBar(_ref) {
|
|
|
6638
6871
|
})) : null) : null))));
|
|
6639
6872
|
};
|
|
6640
6873
|
|
|
6641
|
-
var _templateObject$
|
|
6642
|
-
var TitleCTAGridWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
6874
|
+
var _templateObject$J, _templateObject2$t, _templateObject3$m, _templateObject4$h, _templateObject6$a, _templateObject7$5, _templateObject8$4, _templateObject9$2, _templateObject10$2;
|
|
6875
|
+
var TitleCTAGridWrapper = /*#__PURE__*/styled.div(_templateObject$J || (_templateObject$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: ", ";\n top: -1px;\n background-color: var(--base-color-white);\n z-index: ", ";\n"])), function (_ref) {
|
|
6643
6876
|
var sticky = _ref.sticky;
|
|
6644
6877
|
return sticky ? 'sticky' : 'initial';
|
|
6645
6878
|
}, zIndexes.anchor);
|
|
@@ -6699,15 +6932,15 @@ var TitleWithCTA = function TitleWithCTA(_ref) {
|
|
|
6699
6932
|
}, message)));
|
|
6700
6933
|
};
|
|
6701
6934
|
|
|
6702
|
-
var _templateObject$
|
|
6703
|
-
var Wrapper$2 = /*#__PURE__*/styled.div(_templateObject$
|
|
6935
|
+
var _templateObject$K, _templateObject2$u, _templateObject3$n, _templateObject4$i, _templateObject5$d, _templateObject6$b, _templateObject7$6, _templateObject8$5;
|
|
6936
|
+
var Wrapper$2 = /*#__PURE__*/styled.div(_templateObject$K || (_templateObject$K = /*#__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);
|
|
6704
6937
|
var PromoLabelWrapper = /*#__PURE__*/styled.div(_templateObject2$u || (_templateObject2$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: flex-end;\n align-self: flex-end;\n height: 15px;\n"])));
|
|
6705
6938
|
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: 'tnum' on, 'lnum' on, 'liga' off, '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) {
|
|
6706
6939
|
var theme = _ref.theme;
|
|
6707
6940
|
return theme.colors.primary;
|
|
6708
6941
|
}, Colors.White);
|
|
6709
6942
|
var ButtonContainer = /*#__PURE__*/styled.div(_templateObject4$i || (_templateObject4$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 2em;\n width: fit-content;\n"])));
|
|
6710
|
-
var TitleContainer$1 = /*#__PURE__*/styled.div(_templateObject5$
|
|
6943
|
+
var TitleContainer$1 = /*#__PURE__*/styled.div(_templateObject5$d || (_templateObject5$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n & > * {\n margin-top: 0;\n margin-bottom: 0.5em;\n }\n"])));
|
|
6711
6944
|
var OfferTextWrapper = /*#__PURE__*/styled.div(_templateObject6$b || (_templateObject6$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n & > * {\n margin-bottom: 0.5em;\n }\n margin-bottom: 1em;\n"])));
|
|
6712
6945
|
var PriceRow = /*#__PURE__*/styled.div(_templateObject7$6 || (_templateObject7$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-wrap: wrap;\n gap: 6px 12px;\n padding: 5px 0 8px 0;\n"])));
|
|
6713
6946
|
var LineThrough = /*#__PURE__*/styled.div(_templateObject8$5 || (_templateObject8$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-decoration-line: line-through;\n color: var(--base-color-darkgrey);\n"])));
|
|
@@ -6780,8 +7013,8 @@ var UpsellCard = function UpsellCard(_ref) {
|
|
|
6780
7013
|
}), link && /*#__PURE__*/React__default.createElement(ButtonContainer, null, /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, link), truncate(link.text, LENGTH_SMALL_TEXT)))));
|
|
6781
7014
|
};
|
|
6782
7015
|
|
|
6783
|
-
var _templateObject$
|
|
6784
|
-
var Wrapper$3 = /*#__PURE__*/styled.div(_templateObject$
|
|
7016
|
+
var _templateObject$L;
|
|
7017
|
+
var Wrapper$3 = /*#__PURE__*/styled.div(_templateObject$L || (_templateObject$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n gap: 60px 75px;\n grid-template-columns: repeat(2, 1fr);\n width: 100%;\n\n @media ", " {\n padding-left: 0;\n padding-right: 0;\n }\n\n @media ", " {\n width: 100%;\n padding-left: 0;\n padding-right: 0;\n grid-template-columns: 1fr;\n }\n"])), devices.tablet, devices.mobile);
|
|
6785
7018
|
|
|
6786
7019
|
var UpsellCards = function UpsellCards(_ref) {
|
|
6787
7020
|
var upsellCards = _ref.upsellCards;
|
|
@@ -6799,20 +7032,20 @@ var UpsellCards = function UpsellCards(_ref) {
|
|
|
6799
7032
|
}));
|
|
6800
7033
|
};
|
|
6801
7034
|
|
|
6802
|
-
var _templateObject$
|
|
6803
|
-
var UpsellBorderBox = /*#__PURE__*/styled.div(_templateObject$
|
|
7035
|
+
var _templateObject$M, _templateObject2$v, _templateObject3$o;
|
|
7036
|
+
var UpsellBorderBox = /*#__PURE__*/styled.div(_templateObject$M || (_templateObject$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: solid 4px;\n border-color: ", ";\n padding: 80px;\n\n @media ", " {\n & {\n border-left: none;\n border-right: none;\n padding-top: 2.5em;\n padding-left: 0;\n padding-right: 0;\n padding-bottom: 2.5em;\n }\n }\n\n @media ", " {\n & {\n padding: 25px;\n padding-top: 2.5em;\n }\n }\n"])), function (_ref) {
|
|
6804
7037
|
var theme = _ref.theme;
|
|
6805
7038
|
return theme.colors.primary;
|
|
6806
7039
|
}, devices.mobile, devices.tablet);
|
|
6807
7040
|
var TitleContainer$2 = /*#__PURE__*/styled.div(_templateObject2$v || (_templateObject2$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n @media ", " {\n margin-left: 1.5em;\n margin-right: 1.5em;\n }\n"])), devices.mobile);
|
|
6808
7041
|
var TextContainer = /*#__PURE__*/styled.div(_templateObject3$o || (_templateObject3$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 2.5em;\n div > :first-child {\n margin-top: 1.5em;\n }\n\n @media ", " {\n margin-top: 0;\n div > :first-child {\n margin-top: 0.5em;\n }\n }\n\n @media ", " {\n margin-left: 1.5em;\n margin-right: 1.5em;\n & {\n div > :first-child {\n margin-top: 1em;\n }\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
6809
7042
|
|
|
6810
|
-
var _templateObject$
|
|
6811
|
-
var AccordionContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
7043
|
+
var _templateObject$N, _templateObject2$w, _templateObject3$p, _templateObject4$j, _templateObject5$e;
|
|
7044
|
+
var AccordionContainer = /*#__PURE__*/styled.div(_templateObject$N || (_templateObject$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n div {\n overflow: hidden;\n }\n"])));
|
|
6812
7045
|
var LineContainer = /*#__PURE__*/styled.div(_templateObject2$w || (_templateObject2$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 2px;\n background-color: var(--base-color-lightgrey);\n width: 100%;\n"])));
|
|
6813
7046
|
var ChildrenContainer = /*#__PURE__*/styled.div(_templateObject3$p || (_templateObject3$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0px 20px 28px 20px;\n\n @media ", " {\n margin: 12px 0px 24px 0px;\n }\n"])), devices.mobile);
|
|
6814
7047
|
var TitleContainer$3 = /*#__PURE__*/styled.div(_templateObject4$j || (_templateObject4$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n\n && h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n div {\n margin: 21px 20px;\n white-space: break-spaces;\n overflow-wrap: break-word;\n\n @media ", " {\n margin: 12px 20px 12px 0px;\n }\n }\n\n && svg {\n width: var(--navigation-middle-gap);\n height: var(--navigation-middle-gap);\n margin-right: 20px;\n\n @media ", " {\n margin-right: 0px;\n }\n }\n\n :hover {\n cursor: pointer;\n }\n"])), devices.mobile, devices.mobile);
|
|
6815
|
-
var ContentContainer = /*#__PURE__*/styled.div(_templateObject5$
|
|
7048
|
+
var ContentContainer = /*#__PURE__*/styled.div(_templateObject5$e || (_templateObject5$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.2s ease;\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 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 }\n\n & h2 {\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 }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n\n @media ", " {\n transition: 100% 0.2s ease;\n }\n"])), devices.mobile);
|
|
6816
7049
|
|
|
6817
7050
|
var Accordion = function Accordion(_ref) {
|
|
6818
7051
|
var _ref$title = _ref.title,
|
|
@@ -6937,8 +7170,8 @@ var Accordion = function Accordion(_ref) {
|
|
|
6937
7170
|
}, children)), showLine && /*#__PURE__*/React__default.createElement(LineContainer, null));
|
|
6938
7171
|
};
|
|
6939
7172
|
|
|
6940
|
-
var _templateObject$
|
|
6941
|
-
var AccordionsContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
7173
|
+
var _templateObject$O;
|
|
7174
|
+
var AccordionsContainer = /*#__PURE__*/styled.div(_templateObject$O || (_templateObject$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
6942
7175
|
|
|
6943
7176
|
var Accordions = function Accordions(_ref) {
|
|
6944
7177
|
var _ref$items = _ref.items,
|
|
@@ -6956,7 +7189,8 @@ var Accordions = function Accordions(_ref) {
|
|
|
6956
7189
|
visibleStandfirst: accordion.visibleStandfirst,
|
|
6957
7190
|
contentType: accordion.contentType,
|
|
6958
7191
|
displayLevel: accordion.displayLevel,
|
|
6959
|
-
semanticLevel: accordion.semanticLevel
|
|
7192
|
+
semanticLevel: accordion.semanticLevel,
|
|
7193
|
+
initOpen: accordion.initOpen
|
|
6960
7194
|
}, accordion.children);
|
|
6961
7195
|
}));
|
|
6962
7196
|
};
|
|
@@ -6970,8 +7204,8 @@ var Theme = function Theme(_ref) {
|
|
|
6970
7204
|
}, children);
|
|
6971
7205
|
};
|
|
6972
7206
|
|
|
6973
|
-
var _templateObject$
|
|
6974
|
-
var AnnouncementBannerWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
7207
|
+
var _templateObject$P, _templateObject2$x, _templateObject3$q;
|
|
7208
|
+
var AnnouncementBannerWrapper = /*#__PURE__*/styled.div(_templateObject$P || (_templateObject$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 28px 0;\n background-color: ", ";\n color: var(--base-color-white);\n\n @media ", " {\n padding: 20px 0;\n }\n"])), function (_ref) {
|
|
6975
7209
|
var theme = _ref.theme;
|
|
6976
7210
|
return theme.colors.primary;
|
|
6977
7211
|
}, devices.mobile);
|
|
@@ -7013,8 +7247,8 @@ var AnnouncementBanner = function AnnouncementBanner(_ref) {
|
|
|
7013
7247
|
}))))));
|
|
7014
7248
|
};
|
|
7015
7249
|
|
|
7016
|
-
var _templateObject$
|
|
7017
|
-
var AuxiliaryButtonWrapper = /*#__PURE__*/styled(Button)(_templateObject$
|
|
7250
|
+
var _templateObject$Q;
|
|
7251
|
+
var AuxiliaryButtonWrapper = /*#__PURE__*/styled(Button)(_templateObject$Q || (_templateObject$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: ", ";\n height: 20px;\n border: none;\n padding: 0;\n font-family: var(--font-family-buttons);\n font-size: var(--button-font-size);\n font-weight: var(--button-font-weight);\n color: var(--base-color-", ");\n width: fit-content;\n display: flex;\n align-items: flex-start;\n justify-content: center;\n cursor: pointer;\n text-decoration: none;\n box-sizing: border-box;\n\n .auxiliaryButtonIcon {\n width: 12px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n }\n"])), function (_ref) {
|
|
7018
7252
|
var bgColor = _ref.bgColor,
|
|
7019
7253
|
theme = _ref.theme;
|
|
7020
7254
|
return bgColor ? "var(--base-color-" + bgColor + ")" : theme.colors.auxiliaryButton;
|
|
@@ -7035,11 +7269,11 @@ var AuxiliaryButton = function AuxiliaryButton(_ref) {
|
|
|
7035
7269
|
}), children);
|
|
7036
7270
|
};
|
|
7037
7271
|
|
|
7038
|
-
var _templateObject$
|
|
7272
|
+
var _templateObject$R, _templateObject2$y, _templateObject3$r, _templateObject4$k, _templateObject5$f, _templateObject6$c, _templateObject7$7, _templateObject8$6, _templateObject9$3, _templateObject10$3, _templateObject11$1, _templateObject12, _templateObject13, _templateObject14;
|
|
7039
7273
|
var LENGTH_LARGE_TEXT = 28;
|
|
7040
7274
|
var LENGTH_SMALL_TEXT$1 = 19;
|
|
7041
7275
|
var LENGTH_TEXT_TABLET = 10;
|
|
7042
|
-
var CardContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
7276
|
+
var CardContainer = /*#__PURE__*/styled.div(_templateObject$R || (_templateObject$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: ", ";\n position: relative;\n ", "\n\n .targetLink {\n text-decoration: none;\n color: inherit;\n }\n"])), function (_ref) {
|
|
7043
7277
|
var isCardClickable = _ref.isCardClickable;
|
|
7044
7278
|
return isCardClickable ? 'pointer' : 'default';
|
|
7045
7279
|
}, function (_ref2) {
|
|
@@ -7060,7 +7294,7 @@ var ContentContainer$2 = /*#__PURE__*/styled.div(_templateObject4$k || (_templat
|
|
|
7060
7294
|
var fullWidth = _ref5.fullWidth;
|
|
7061
7295
|
return fullWidth ? '0' : '20px';
|
|
7062
7296
|
});
|
|
7063
|
-
var TitleContainer$4 = /*#__PURE__*/styled.div(_templateObject5$
|
|
7297
|
+
var TitleContainer$4 = /*#__PURE__*/styled.div(_templateObject5$f || (_templateObject5$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: calc(-1 * var(--editorial-margin-between)) 0 calc(-1 * var(--editorial-margin-between)) 0;\n\n @media ", " {\n display: none;\n }\n"])), devices.mobileAndTablet);
|
|
7064
7298
|
var TitleContainerMobile = /*#__PURE__*/styled.div(_templateObject6$c || (_templateObject6$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: calc(-1 * var(--editorial-margin-between)) 0 calc(-1 * var(--editorial-margin-between)) 0;\n display: none;\n\n @media ", " {\n display: block;\n }\n"])), devices.mobileAndTablet);
|
|
7065
7299
|
var TextContainer$1 = /*#__PURE__*/styled.div(_templateObject7$7 || (_templateObject7$7 = /*#__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-top: var(--editorial-spacing-hover);\n padding: 0;\n white-space: break-spaces;\n overflow-wrap: break-word;\n\n em {\n font-family: var(--font-family-body-italics);\n }\n"])));
|
|
7066
7300
|
var HighlightTextContainer = /*#__PURE__*/styled(TextContainer$1)(_templateObject8$6 || (_templateObject8$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-primary);\n margin-top: 4px;\n"])));
|
|
@@ -7321,9 +7555,9 @@ var Card = function Card(_ref) {
|
|
|
7321
7555
|
dangerouslySetInnerHTML: {
|
|
7322
7556
|
__html: truncatedText
|
|
7323
7557
|
}
|
|
7324
|
-
}), highlightText && /*#__PURE__*/React__default.createElement(HighlightTextContainer, null, /*#__PURE__*/React__default.createElement(BodyText, {
|
|
7558
|
+
}))), highlightText && /*#__PURE__*/React__default.createElement(HighlightTextContainer, null, /*#__PURE__*/React__default.createElement(BodyText, {
|
|
7325
7559
|
level: 1
|
|
7326
|
-
}, highlightText))
|
|
7560
|
+
}, highlightText)), auxiliaryCTA && /*#__PURE__*/React__default.createElement(ExtraActionsContainer, {
|
|
7327
7561
|
fullWidth: fullWidth
|
|
7328
7562
|
}, /*#__PURE__*/React__default.createElement(AuxiliaryButton, Object.assign({}, auxiliaryCTA), auxiliaryCTA.text)), links && /*#__PURE__*/React__default.createElement(ButtonsContainer$1, {
|
|
7329
7563
|
ref: node,
|
|
@@ -7337,8 +7571,8 @@ var Card = function Card(_ref) {
|
|
|
7337
7571
|
}, firstButton && /*#__PURE__*/React__default.createElement(FirstButtonComponent, Object.assign({}, restFirstButton), primaryButtonTextTruncate), secondButton && /*#__PURE__*/React__default.createElement(SecondButtonComponent, Object.assign({}, restSecondButton), tertiaryButtonTextTruncate)));
|
|
7338
7572
|
};
|
|
7339
7573
|
|
|
7340
|
-
var _templateObject$
|
|
7341
|
-
var CardsContainer = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
7574
|
+
var _templateObject$S, _templateObject2$z;
|
|
7575
|
+
var CardsContainer = /*#__PURE__*/styled(Grid)(_templateObject$S || (_templateObject$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: var(--line-height-people-listing-gap) var(--grid-column-gap);\n\n @media ", " {\n grid-row-gap: var(--cards-spacing-stack);\n }\n"])), devices.mobile);
|
|
7342
7576
|
var GridItemContainer = /*#__PURE__*/styled(GridItem)(_templateObject2$z || (_templateObject2$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n grid-column: 1 / span 14;\n }\n"])), devices.mobile);
|
|
7343
7577
|
|
|
7344
7578
|
var Cards = function Cards(_ref) {
|
|
@@ -7384,8 +7618,8 @@ var Cards = function Cards(_ref) {
|
|
|
7384
7618
|
}));
|
|
7385
7619
|
};
|
|
7386
7620
|
|
|
7387
|
-
var _templateObject$
|
|
7388
|
-
var ContentWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
7621
|
+
var _templateObject$T, _templateObject2$A, _templateObject3$s, _templateObject4$l, _templateObject5$g;
|
|
7622
|
+
var ContentWrapper = /*#__PURE__*/styled.div(_templateObject$T || (_templateObject$T = /*#__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);
|
|
7389
7623
|
var Wrapper$4 = /*#__PURE__*/styled.div(_templateObject2$A || (_templateObject2$A = /*#__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) {
|
|
7390
7624
|
var hideBottomBorder = _ref.hideBottomBorder;
|
|
7391
7625
|
return "border-bottom: " + (hideBottomBorder ? 'none' : '2px solid var(--base-color-midgrey)') + ";";
|
|
@@ -7395,7 +7629,7 @@ var Wrapper$4 = /*#__PURE__*/styled.div(_templateObject2$A || (_templateObject2$
|
|
|
7395
7629
|
}, devices.mobileAndTablet);
|
|
7396
7630
|
var AddressWrapperDesktop = /*#__PURE__*/styled.div(_templateObject3$s || (_templateObject3$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n display: none;\n }\n"])), devices.mobile);
|
|
7397
7631
|
var AddressWrapperMobile = /*#__PURE__*/styled.div(_templateObject4$l || (_templateObject4$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n\n & > div {\n margin-bottom: 2px;\n }\n\n @media ", " {\n display: block;\n }\n"])), devices.mobile);
|
|
7398
|
-
var DetailsWrapper = /*#__PURE__*/styled.div(_templateObject5$
|
|
7632
|
+
var DetailsWrapper = /*#__PURE__*/styled.div(_templateObject5$g || (_templateObject5$g = /*#__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);
|
|
7399
7633
|
|
|
7400
7634
|
var divideAddressString = function divideAddressString(address) {
|
|
7401
7635
|
return address.split(',').map(function (chunk, i) {
|
|
@@ -7453,8 +7687,8 @@ var ContactCard = function ContactCard(_ref) {
|
|
|
7453
7687
|
}, addressString)), /*#__PURE__*/React__default.createElement(AddressWrapperMobile, null, divideAddressString(addressString)))))));
|
|
7454
7688
|
};
|
|
7455
7689
|
|
|
7456
|
-
var _templateObject$
|
|
7457
|
-
var BodyTextRelative = /*#__PURE__*/styled(BodyText)(_templateObject$
|
|
7690
|
+
var _templateObject$U, _templateObject2$B, _templateObject3$t, _templateObject4$m, _templateObject5$h, _templateObject6$d, _templateObject7$8;
|
|
7691
|
+
var BodyTextRelative = /*#__PURE__*/styled(BodyText)(_templateObject$U || (_templateObject$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
|
|
7458
7692
|
var ContentSummaryWrapper = /*#__PURE__*/styled.article(_templateObject2$B || (_templateObject2$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n position: relative;\n justify-items: start;\n align-items: center;\n margin: 20px 0;\n gap: 24px;\n cursor: ", ";\n\n @media ", " {\n display: flex;\n flex-direction: column;\n gap: 24px;\n }\n"])), function (props) {
|
|
7459
7693
|
return props.clickable ? 'pointer' : 'default';
|
|
7460
7694
|
}, devices.mobile);
|
|
@@ -7462,7 +7696,7 @@ var ContentSummaryImageWrapper = /*#__PURE__*/styled.div(_templateObject3$t || (
|
|
|
7462
7696
|
var ContentSummaryTextWrapper = /*#__PURE__*/styled.div(_templateObject4$m || (_templateObject4$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: ", ";\n display: flex;\n flex-direction: column;\n justify-content: space-around;\n gap: 22px;\n\n & > * {\n margin-block-start: 0;\n margin-block-end: 0;\n }\n\n @media ", " {\n margin: 0 20px;\n gap: 12px;\n }\n\n & .content-summary-text-link {\n height: unset;\n }\n"])), function (props) {
|
|
7463
7697
|
return props.showImage ? 2 : '1 / span 4';
|
|
7464
7698
|
}, devices.mobile);
|
|
7465
|
-
var ContentSummaryTitleWrapper = /*#__PURE__*/styled.div(_templateObject5$
|
|
7699
|
+
var ContentSummaryTitleWrapper = /*#__PURE__*/styled.div(_templateObject5$h || (_templateObject5$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n & > * {\n margin: 0;\n }\n\n @media ", " {\n & > * {\n font-size: var(--font-size-header-5);\n font-weight: var(--font-weight-header-5);\n }\n }\n"])), devices.mobile);
|
|
7466
7700
|
var BodyTextLimit = /*#__PURE__*/styled.div(_templateObject6$d || (_templateObject6$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: block;\n position: relative;\n"])));
|
|
7467
7701
|
var ContentSummaryBodyTextWrapper = /*#__PURE__*/styled.div(_templateObject7$8 || (_templateObject7$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n & p:not(:last-child):after {\n content: '\\A\\A';\n white-space: pre;\n }\n\n ", "\n"], ["\n & p:not(:last-child):after {\n content: '\\\\A\\\\A';\n white-space: pre;\n }\n\n ", "\n"])), function (props) {
|
|
7468
7702
|
return !!props.truncate && "\n overflow: hidden;\n position: relative;\n display: -webkit-box;\n -webkit-line-clamp: " + props.truncate + ";\n -webkit-box-orient: vertical;\n text-overflow: ellipsis;\n min-height: 1em;\n max-height: 3em;\n ";
|
|
@@ -7536,8 +7770,8 @@ var ContentSummary = function ContentSummary(_ref) {
|
|
|
7536
7770
|
}), link.text)));
|
|
7537
7771
|
};
|
|
7538
7772
|
|
|
7539
|
-
var _templateObject$
|
|
7540
|
-
var EditorialGrid = /*#__PURE__*/styled.div(_templateObject$
|
|
7773
|
+
var _templateObject$V, _templateObject2$C, _templateObject3$u, _templateObject4$n, _templateObject5$i;
|
|
7774
|
+
var EditorialGrid = /*#__PURE__*/styled.div(_templateObject$V || (_templateObject$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: repeat(12, minmax(0, 1fr));\n gap: var(--grid-column-gap);\n grid-template-areas: ", ";\n\n @media ", " {\n & {\n display: grid;\n grid-template-columns: 100%;\n grid-template-rows: min-content 24px min-content;\n grid-template-areas:\n 'row1'\n '.'\n 'row2';\n }\n }\n"])), function (_ref) {
|
|
7541
7775
|
var imageToLeft = _ref.imageToLeft;
|
|
7542
7776
|
return imageToLeft ? "'left left left left left . right right right right right right'" : "'left left left left left left . right right right right right'";
|
|
7543
7777
|
}, devices.mobile);
|
|
@@ -7550,7 +7784,7 @@ var EditorialTextWrapper = /*#__PURE__*/styled.div(_templateObject3$u || (_templ
|
|
|
7550
7784
|
return imageToLeft ? 'right' : 'left';
|
|
7551
7785
|
}, devices.mobile);
|
|
7552
7786
|
var EditorialSubtitle = /*#__PURE__*/styled.span(_templateObject4$n || (_templateObject4$n = /*#__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"])));
|
|
7553
|
-
var EditorialText = /*#__PURE__*/styled.div(_templateObject5$
|
|
7787
|
+
var EditorialText = /*#__PURE__*/styled.div(_templateObject5$i || (_templateObject5$i = /*#__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 em {\n font-family: var(--font-family-body-italics);\n }\n"])));
|
|
7554
7788
|
|
|
7555
7789
|
var Editorial = function Editorial(_ref) {
|
|
7556
7790
|
var _ref$imagePosition = _ref.imagePosition,
|
|
@@ -7614,8 +7848,8 @@ var BackgroundColour;
|
|
|
7614
7848
|
BackgroundColour["White"] = "white";
|
|
7615
7849
|
})(BackgroundColour || (BackgroundColour = {}));
|
|
7616
7850
|
|
|
7617
|
-
var _templateObject$
|
|
7618
|
-
var InfoContent = /*#__PURE__*/styled('div')(_templateObject$
|
|
7851
|
+
var _templateObject$W, _templateObject2$D, _templateObject3$v, _templateObject4$o;
|
|
7852
|
+
var InfoContent = /*#__PURE__*/styled('div')(_templateObject$W || (_templateObject$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\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 -webkit-letter-spacing: var(--letter-spacing-altHeader-6);\n -moz-letter-spacing: var(--letter-spacing-altHeader-6);\n -ms-letter-spacing: var(--letter-spacing-altHeader-6);\n letter-spacing: var(--letter-spacing-altHeader-6);\n line-height: var(--line-height-altHeader-6);\n word-break: var(--word-break-altHeader);\n"])));
|
|
7619
7853
|
var InfoTitle = /*#__PURE__*/styled('div')(_templateObject2$D || (_templateObject2$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n * {\n margin-block: 0;\n }\n"])));
|
|
7620
7854
|
var InfoCTAWrapper = /*#__PURE__*/styled('div')(_templateObject3$v || (_templateObject3$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 32px 0;\n\n ", "}\n"])), function (props) {
|
|
7621
7855
|
if (!props.infoThemed) {
|
|
@@ -7741,8 +7975,8 @@ var Information = function Information(_ref) {
|
|
|
7741
7975
|
}))));
|
|
7742
7976
|
};
|
|
7743
7977
|
|
|
7744
|
-
var _templateObject$
|
|
7745
|
-
var PageHeadingWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
7978
|
+
var _templateObject$X, _templateObject2$E, _templateObject3$w, _templateObject4$p, _templateObject5$j, _templateObject6$e, _templateObject7$9, _templateObject8$7;
|
|
7979
|
+
var PageHeadingWrapper = /*#__PURE__*/styled.div(_templateObject$X || (_templateObject$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-bottom: 80px;\n background-color: ", ";\n color: var(--base-color-white);\n\n ", ";\n\n h2 {\n margin: 0;\n padding: 0;\n }\n\n @media ", " {\n padding-bottom: 0;\n }\n"])), function (_ref) {
|
|
7746
7980
|
var theme = _ref.theme;
|
|
7747
7981
|
return theme.colors.primary;
|
|
7748
7982
|
}, function (_ref2) {
|
|
@@ -7758,8 +7992,8 @@ var ChildrenWrapper = /*#__PURE__*/styled.div(_templateObject4$p || (_templateOb
|
|
|
7758
7992
|
var isPageHeadingWithoutTitle = _ref4.isPageHeadingWithoutTitle;
|
|
7759
7993
|
return isPageHeadingWithoutTitle && "\n margin: 10px 0;\n ";
|
|
7760
7994
|
}, devices.mobile);
|
|
7761
|
-
var TextWrapper = /*#__PURE__*/styled.div(_templateObject5$
|
|
7762
|
-
var LogoWrapper$
|
|
7995
|
+
var TextWrapper = /*#__PURE__*/styled.div(_templateObject5$j || (_templateObject5$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: text;\n align-self: end;\n margin-top: 12px;\n\n h6 {\n margin: 0;\n padding: 0;\n }\n"])));
|
|
7996
|
+
var LogoWrapper$1 = /*#__PURE__*/styled.div(_templateObject6$e || (_templateObject6$e = /*#__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 @media ", " {\n & {\n align-self: start;\n margin-top: 0;\n }\n }\n"])), devices.mobile);
|
|
7763
7997
|
var ButtonWrapper$1 = /*#__PURE__*/styled.div(_templateObject7$9 || (_templateObject7$9 = /*#__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);
|
|
7764
7998
|
var PageHeadingText = /*#__PURE__*/styled.div(_templateObject8$7 || (_templateObject8$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\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 font-feature-settings: var(--font-feature-settings-altHeader);\n font-family: var(--font-family-altHeader);\n text-transform: var(--text-transform-altHeader);\n word-break: var(--word-break-altHeader);\n"])));
|
|
7765
7999
|
|
|
@@ -7769,14 +8003,20 @@ var PageHeading = function PageHeading(_ref) {
|
|
|
7769
8003
|
link = _ref.link,
|
|
7770
8004
|
_ref$sponsor = _ref.sponsor,
|
|
7771
8005
|
sponsor = _ref$sponsor === void 0 ? false : _ref$sponsor,
|
|
7772
|
-
children = _ref.children
|
|
8006
|
+
children = _ref.children,
|
|
8007
|
+
_ref$semanticLevel = _ref.semanticLevel,
|
|
8008
|
+
semanticLevel = _ref$semanticLevel === void 0 ? 1 : _ref$semanticLevel,
|
|
8009
|
+
_ref$copyCharLimit = _ref.copyCharLimit,
|
|
8010
|
+
copyCharLimit = _ref$copyCharLimit === void 0 ? 250 : _ref$copyCharLimit,
|
|
8011
|
+
_ref$titleCharLimit = _ref.titleCharLimit,
|
|
8012
|
+
titleCharLimit = _ref$titleCharLimit === void 0 ? 40 : _ref$titleCharLimit;
|
|
7773
8013
|
|
|
7774
8014
|
var _ref2 = link || {},
|
|
7775
8015
|
linkText = _ref2.text,
|
|
7776
8016
|
restLink = _objectWithoutPropertiesLoose(_ref2, ["text"]);
|
|
7777
8017
|
|
|
7778
|
-
var truncatedText = text == null ? void 0 : text.substring(0,
|
|
7779
|
-
var truncatedTitle = title && title.substring(0,
|
|
8018
|
+
var truncatedText = text == null ? void 0 : text.substring(0, copyCharLimit);
|
|
8019
|
+
var truncatedTitle = title && title.substring(0, titleCharLimit);
|
|
7780
8020
|
var isTitleUnAvailable = !title;
|
|
7781
8021
|
return /*#__PURE__*/React__default.createElement(PageHeadingWrapper, {
|
|
7782
8022
|
"data-testid": "page-heading-wrapper",
|
|
@@ -7787,14 +8027,15 @@ var PageHeading = function PageHeading(_ref) {
|
|
|
7787
8027
|
}, children ? /*#__PURE__*/React__default.createElement(ChildrenWrapper, {
|
|
7788
8028
|
isPageHeadingWithoutTitle: isTitleUnAvailable
|
|
7789
8029
|
}, children) : null, !isTitleUnAvailable && /*#__PURE__*/React__default.createElement(Header, {
|
|
7790
|
-
level: 2
|
|
8030
|
+
level: 2,
|
|
8031
|
+
semanticLevel: semanticLevel
|
|
7791
8032
|
}, truncatedTitle)), text ? /*#__PURE__*/React__default.createElement(TextWrapper, {
|
|
7792
8033
|
"data-testid": "page-heading-text"
|
|
7793
8034
|
}, /*#__PURE__*/React__default.createElement(PageHeadingText, {
|
|
7794
8035
|
dangerouslySetInnerHTML: {
|
|
7795
8036
|
__html: truncatedText
|
|
7796
8037
|
}
|
|
7797
|
-
})) : null, sponsor ? /*#__PURE__*/React__default.createElement(LogoWrapper$
|
|
8038
|
+
})) : null, sponsor ? /*#__PURE__*/React__default.createElement(LogoWrapper$1, {
|
|
7798
8039
|
"data-testid": "page-heading-sponsor"
|
|
7799
8040
|
}, /*#__PURE__*/React__default.createElement(Sponsorship, null)) : null, link ? /*#__PURE__*/React__default.createElement(ButtonWrapper$1, {
|
|
7800
8041
|
"data-testid": "page-heading-link"
|
|
@@ -7830,15 +8071,17 @@ var PageHeadingCinema = function PageHeadingCinema(_ref) {
|
|
|
7830
8071
|
theme: ThemeType.Cinema
|
|
7831
8072
|
}, /*#__PURE__*/React__default.createElement(PageHeading, Object.assign({}, rest, {
|
|
7832
8073
|
link: cinemaLink
|
|
7833
|
-
}), /*#__PURE__*/React__default.createElement(CinemaBadge,
|
|
8074
|
+
}), /*#__PURE__*/React__default.createElement(CinemaBadge, {
|
|
8075
|
+
align: "left"
|
|
8076
|
+
})));
|
|
7834
8077
|
};
|
|
7835
8078
|
|
|
7836
|
-
var _templateObject$
|
|
7837
|
-
var ImpactWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
8079
|
+
var _templateObject$Y, _templateObject2$F, _templateObject3$x, _templateObject4$q, _templateObject5$k, _templateObject6$f, _templateObject7$a, _templateObject8$8;
|
|
8080
|
+
var ImpactWrapper = /*#__PURE__*/styled.div(_templateObject$Y || (_templateObject$Y = /*#__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);
|
|
7838
8081
|
var ImpactHeaderImageWrapper = /*#__PURE__*/styled.div(_templateObject2$F || (_templateObject2$F = /*#__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);
|
|
7839
8082
|
var ImpactGrid = /*#__PURE__*/styled(Grid)(_templateObject3$x || (_templateObject3$x = /*#__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);
|
|
7840
8083
|
var SponsorWrapper = /*#__PURE__*/styled.div(_templateObject4$q || (_templateObject4$q = /*#__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);
|
|
7841
|
-
var LogoWrapper$
|
|
8084
|
+
var LogoWrapper$2 = /*#__PURE__*/styled.div(_templateObject5$k || (_templateObject5$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: logo;\n align-self: end;\n"])));
|
|
7842
8085
|
var TextWrapper$1 = /*#__PURE__*/styled.div(_templateObject6$f || (_templateObject6$f = /*#__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);
|
|
7843
8086
|
var ButtonWrapper$2 = /*#__PURE__*/styled.div(_templateObject7$a || (_templateObject7$a = /*#__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);
|
|
7844
8087
|
var ScrollDownWrapper = /*#__PURE__*/styled.div(_templateObject8$8 || (_templateObject8$8 = /*#__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);
|
|
@@ -7854,7 +8097,9 @@ var PageHeadingImpact = function PageHeadingImpact(_ref) {
|
|
|
7854
8097
|
bgUrlDesktop = _ref.bgUrlDesktop,
|
|
7855
8098
|
bgUrlDevice = _ref.bgUrlDevice,
|
|
7856
8099
|
_ref$bgImageAltText = _ref.bgImageAltText,
|
|
7857
|
-
bgImageAltText = _ref$bgImageAltText === void 0 ? '' : _ref$bgImageAltText
|
|
8100
|
+
bgImageAltText = _ref$bgImageAltText === void 0 ? '' : _ref$bgImageAltText,
|
|
8101
|
+
_ref$semanticLevel = _ref.semanticLevel,
|
|
8102
|
+
semanticLevel = _ref$semanticLevel === void 0 ? 3 : _ref$semanticLevel;
|
|
7858
8103
|
var truncatedText = text && text.substring(0, 75);
|
|
7859
8104
|
|
|
7860
8105
|
var _ref2 = link || {},
|
|
@@ -7885,12 +8130,13 @@ var PageHeadingImpact = function PageHeadingImpact(_ref) {
|
|
|
7885
8130
|
src: bgUrlDesktop,
|
|
7886
8131
|
alt: bgImageAltText,
|
|
7887
8132
|
"data-testid": "impact-image"
|
|
7888
|
-
}))), /*#__PURE__*/React__default.createElement(ImpactGrid, null, children ? /*#__PURE__*/React__default.createElement(LogoWrapper$
|
|
8133
|
+
}))), /*#__PURE__*/React__default.createElement(ImpactGrid, null, children ? /*#__PURE__*/React__default.createElement(LogoWrapper$2, {
|
|
7889
8134
|
"data-testid": "impact-logo"
|
|
7890
8135
|
}, children) : null, text ? /*#__PURE__*/React__default.createElement(TextWrapper$1, {
|
|
7891
8136
|
"data-testid": "impact-text"
|
|
7892
8137
|
}, /*#__PURE__*/React__default.createElement(Header, {
|
|
7893
|
-
level: 3
|
|
8138
|
+
level: 3,
|
|
8139
|
+
semanticLevel: semanticLevel
|
|
7894
8140
|
}, truncatedText)) : null, link ? /*#__PURE__*/React__default.createElement(ButtonWrapper$2, {
|
|
7895
8141
|
"data-testid": "impact-link"
|
|
7896
8142
|
}, /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, restLink), linkText)) : null), scrollHref ? /*#__PURE__*/React__default.createElement(ScrollDownWrapper, {
|
|
@@ -7904,8 +8150,8 @@ var PageHeadingImpact = function PageHeadingImpact(_ref) {
|
|
|
7904
8150
|
}, "Scroll Down")) : null);
|
|
7905
8151
|
};
|
|
7906
8152
|
|
|
7907
|
-
var _templateObject$
|
|
7908
|
-
var PanelGrid = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
8153
|
+
var _templateObject$Z, _templateObject2$G, _templateObject3$y, _templateObject4$r, _templateObject5$l;
|
|
8154
|
+
var PanelGrid = /*#__PURE__*/styled(Grid)(_templateObject$Z || (_templateObject$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 0 var(--grid-column-gap);\n\n ", "\n\n @media ", " {\n grid-template-rows: 48px max-content max-content;\n }\n"])), function (_ref) {
|
|
7909
8155
|
var color = _ref.color;
|
|
7910
8156
|
return "\n background-color: " + (color ? "var(--base-color-" + color + ")" : 'var(--base-color-core)') + ";\n color: " + (color === Colors.White ? 'var(--base-color-black)' : 'var(--base-color-white)') + ";\n ";
|
|
7911
8157
|
}, devices.mobileAndTablet);
|
|
@@ -7918,7 +8164,7 @@ var LeftPanel = /*#__PURE__*/styled.div(_templateObject2$G || (_templateObject2$
|
|
|
7918
8164
|
});
|
|
7919
8165
|
var RightPanel = /*#__PURE__*/styled.div(_templateObject3$y || (_templateObject3$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 1 / 7 / 3 / 17;\n position: relative;\n height: 100%;\n width: 100%;\n background-color: var(--base-color-black);\n\n @media ", " {\n grid-area: 2 / 1 / 3 / 15;\n }\n"])), devices.mobileAndTablet);
|
|
7920
8166
|
var InfoWrapper$1 = /*#__PURE__*/styled.div(_templateObject4$r || (_templateObject4$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 36px;\n max-height: 33vw;\n overflow: hidden;\n\n :first-child * {\n margin-block-start: 0;\n }\n\n @media ", " {\n margin: 36px 20px;\n max-height: unset;\n }\n"])), devices.mobileAndTablet);
|
|
7921
|
-
var ScrollDownWrapper$1 = /*#__PURE__*/styled.div(_templateObject5$
|
|
8167
|
+
var ScrollDownWrapper$1 = /*#__PURE__*/styled.div(_templateObject5$l || (_templateObject5$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0 0 25px 36px;\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\n :hover {\n border: none;\n\n > span {\n animation: UpDown 1500ms linear infinite;\n }\n }\n }\n\n @media ", " {\n display: none;\n }\n"])), devices.mobileAndTablet);
|
|
7922
8168
|
|
|
7923
8169
|
var PageHeadingPanel = function PageHeadingPanel(_ref) {
|
|
7924
8170
|
var _image$src, _image$alt;
|
|
@@ -7949,8 +8195,8 @@ var PageHeadingPanel = function PageHeadingPanel(_ref) {
|
|
|
7949
8195
|
}))));
|
|
7950
8196
|
};
|
|
7951
8197
|
|
|
7952
|
-
var _templateObject$
|
|
7953
|
-
var StreamWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
8198
|
+
var _templateObject$_;
|
|
8199
|
+
var StreamWrapper = /*#__PURE__*/styled.div(_templateObject$_ || (_templateObject$_ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h2::selection,\n div::selection {\n color: #1866dc;\n background-color: #fff;\n }\n"])));
|
|
7954
8200
|
|
|
7955
8201
|
var PageHeadingStream = function PageHeadingStream(_ref) {
|
|
7956
8202
|
var link = _ref.link,
|
|
@@ -7965,14 +8211,16 @@ var PageHeadingStream = function PageHeadingStream(_ref) {
|
|
|
7965
8211
|
theme: ThemeType.Stream
|
|
7966
8212
|
}, /*#__PURE__*/React__default.createElement(StreamWrapper, null, /*#__PURE__*/React__default.createElement(PageHeading, Object.assign({}, rest, {
|
|
7967
8213
|
link: streamLink
|
|
7968
|
-
}), /*#__PURE__*/React__default.createElement(StreamBadge,
|
|
8214
|
+
}), /*#__PURE__*/React__default.createElement(StreamBadge, {
|
|
8215
|
+
align: "left"
|
|
8216
|
+
}))));
|
|
7969
8217
|
};
|
|
7970
8218
|
|
|
7971
|
-
var _templateObject
|
|
7972
|
-
var BrandingTextBlock = /*#__PURE__*/styled.div(_templateObject
|
|
8219
|
+
var _templateObject$$, _templateObject2$H, _templateObject3$z, _templateObject5$m, _templateObject6$g, _templateObject7$b, _templateObject8$9, _templateObject9$4, _templateObject10$4;
|
|
8220
|
+
var BrandingTextBlock = /*#__PURE__*/styled.div(_templateObject$$ || (_templateObject$$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-overline-4);\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);
|
|
7973
8221
|
var BrandingTextBody = /*#__PURE__*/styled.p(_templateObject2$H || (_templateObject2$H = /*#__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"])));
|
|
7974
8222
|
var ComapctHeaderWrapper = /*#__PURE__*/styled.div(_templateObject3$z || (_templateObject3$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n display: block;\n"])));
|
|
7975
|
-
var CompactHeaderAssetWrapper = /*#__PURE__*/styled.div(_templateObject5$
|
|
8223
|
+
var CompactHeaderAssetWrapper = /*#__PURE__*/styled.div(_templateObject5$m || (_templateObject5$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 37.5vw;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-color: #000;\n img {\n position: relative;\n height: 100%;\n width: 100%;\n object-fit: cover;\n }\n video {\n position: absolute;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n object-fit: contain;\n @media ", " {\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n margin: auto;\n height: auto;\n max-height: 100vh;\n width: 100%;\n object-fit: contain;\n }\n }\n @media ", " {\n height: 85vw;\n max-height: 100vh;\n }\n"])), devices.mobile, devices.mobile);
|
|
7976
8224
|
var CompactHeaderCopyWrapper = /*#__PURE__*/styled(Grid)(_templateObject6$g || (_templateObject6$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n height: 160px;\n grid-template-rows: min-content min-content;\n grid-template-rows: min-content min-content;\n grid-template-columns: [logo] 1fr [title] 3fr [cta] 1fr;\n align-content: center;\n gap: 0;\n background-color: ", ";\n color: ", ";\n\n svg {\n max-width: 155px;\n fill: ", ";\n }\n\n h1::selection,\n div::selection {\n ", ";\n }\n\n @media ", " {\n display: flex;\n flex-direction: column;\n height: auto;\n padding: 32px 20px;\n }\n"])), function (_ref) {
|
|
7977
8225
|
var invert = _ref.invert,
|
|
7978
8226
|
theme = _ref.theme;
|
|
@@ -8073,18 +8321,10 @@ var renderBranding = function renderBranding(brandingStyle, invert, brandingText
|
|
|
8073
8321
|
}, truncate(stripAllHtmlTags(brandingText), 25));
|
|
8074
8322
|
|
|
8075
8323
|
case 'StreamLogo':
|
|
8076
|
-
return /*#__PURE__*/React__default.createElement(
|
|
8077
|
-
color: color,
|
|
8078
|
-
fontSize: 12,
|
|
8079
|
-
productName: TextLogoProduct.Stream
|
|
8080
|
-
});
|
|
8324
|
+
return /*#__PURE__*/React__default.createElement(StreamBadge, null);
|
|
8081
8325
|
|
|
8082
8326
|
case 'CinemaLogo':
|
|
8083
|
-
return /*#__PURE__*/React__default.createElement(
|
|
8084
|
-
color: color,
|
|
8085
|
-
fontSize: 12,
|
|
8086
|
-
productName: TextLogoProduct.Cinema
|
|
8087
|
-
});
|
|
8327
|
+
return /*#__PURE__*/React__default.createElement(CinemaBadge, null);
|
|
8088
8328
|
|
|
8089
8329
|
default:
|
|
8090
8330
|
return null;
|
|
@@ -8103,7 +8343,7 @@ var CompactHeaderBranding = function CompactHeaderBranding(_ref) {
|
|
|
8103
8343
|
var isIOS = function isIOS() {
|
|
8104
8344
|
try {
|
|
8105
8345
|
console.warn('Do not use this on server side rendering, it may throw an error.');
|
|
8106
|
-
if (typeof navigator === undefined) return false;
|
|
8346
|
+
if (typeof navigator === 'undefined') return false;
|
|
8107
8347
|
return ['iPad Simulator', 'iPhone Simulator', 'iPod Simulator', 'iPad', 'iPhone', 'iPod'].includes(navigator.platform) || // iPad on iOS 13 detection
|
|
8108
8348
|
navigator.userAgent.includes('Mac') && 'ontouchend' in document;
|
|
8109
8349
|
} catch (e) {
|
|
@@ -8119,7 +8359,7 @@ var useIOS = function useIOS() {
|
|
|
8119
8359
|
setIOS = _useState[1];
|
|
8120
8360
|
|
|
8121
8361
|
useEffect(function () {
|
|
8122
|
-
if (typeof navigator === undefined) return;
|
|
8362
|
+
if (typeof navigator === 'undefined') return;
|
|
8123
8363
|
setIOS(isIOS());
|
|
8124
8364
|
}, []);
|
|
8125
8365
|
return IOS;
|
|
@@ -8258,7 +8498,11 @@ var PageHeadingCompact = function PageHeadingCompact(_ref4) {
|
|
|
8258
8498
|
_ref4$brandingStyle = _ref4.brandingStyle,
|
|
8259
8499
|
brandingStyle = _ref4$brandingStyle === void 0 ? 'BlockText' : _ref4$brandingStyle,
|
|
8260
8500
|
brandingText = _ref4.brandingText,
|
|
8261
|
-
brandingLink = _ref4.brandingLink
|
|
8501
|
+
brandingLink = _ref4.brandingLink,
|
|
8502
|
+
_ref4$showCopy = _ref4.showCopy,
|
|
8503
|
+
showCopy = _ref4$showCopy === void 0 ? true : _ref4$showCopy,
|
|
8504
|
+
_ref4$semanticLevel = _ref4.semanticLevel,
|
|
8505
|
+
semanticLevel = _ref4$semanticLevel === void 0 ? 1 : _ref4$semanticLevel;
|
|
8262
8506
|
|
|
8263
8507
|
var _ref5 = link || {},
|
|
8264
8508
|
linkText = _ref5.text,
|
|
@@ -8284,7 +8528,7 @@ var PageHeadingCompact = function PageHeadingCompact(_ref4) {
|
|
|
8284
8528
|
})) : /*#__PURE__*/React__default.createElement(Sponsorship, null)) : null, /*#__PURE__*/React__default.createElement(CompactHeaderAssetWrapper, null, /*#__PURE__*/React__default.createElement(CompactHeaderVideo, {
|
|
8285
8529
|
video: video,
|
|
8286
8530
|
poster: poster
|
|
8287
|
-
})), /*#__PURE__*/React__default.createElement(CompactHeaderCopyWrapper, {
|
|
8531
|
+
})), showCopy && /*#__PURE__*/React__default.createElement(CompactHeaderCopyWrapper, {
|
|
8288
8532
|
className: "page-heading-compact__background",
|
|
8289
8533
|
invert: invert
|
|
8290
8534
|
}, /*#__PURE__*/React__default.createElement(CompactHeaderBranding, {
|
|
@@ -8294,15 +8538,15 @@ var PageHeadingCompact = function PageHeadingCompact(_ref4) {
|
|
|
8294
8538
|
invert: invert
|
|
8295
8539
|
}), /*#__PURE__*/React__default.createElement(CompactHeaderTitleWrapper, null, /*#__PURE__*/React__default.createElement(Header, {
|
|
8296
8540
|
level: titleSize,
|
|
8297
|
-
semanticLevel:
|
|
8541
|
+
semanticLevel: semanticLevel
|
|
8298
8542
|
}, title && truncate(title, 40))), link && /*#__PURE__*/React__default.createElement(CompactHeaderCTAWrapper, null, /*#__PURE__*/React__default.createElement(PrimaryButtonWithInversion, Object.assign({}, restLink, {
|
|
8299
8543
|
invert: invert,
|
|
8300
8544
|
className: "page-heading-compact__button"
|
|
8301
8545
|
}), linkText))));
|
|
8302
8546
|
};
|
|
8303
8547
|
|
|
8304
|
-
var _templateObject
|
|
8305
|
-
var MorePages = /*#__PURE__*/styled.span(_templateObject
|
|
8548
|
+
var _templateObject$10, _templateObject2$I, _templateObject3$A, _templateObject4$s;
|
|
8549
|
+
var MorePages = /*#__PURE__*/styled.span(_templateObject$10 || (_templateObject$10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: not-allowed;\n pointer-events: none;\n"])));
|
|
8306
8550
|
var PageNumberWrapper = /*#__PURE__*/styled.ol(_templateObject2$I || (_templateObject2$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: center;\n margin-top: 40px;\n margin-bottom: 40px;\n flex-wrap: nowrap;\n flex-direction: row;\n list-style: none;\n padding: 0;\n max-width: fit-content;\n margin: auto;\n li {\n font-size: var(--font-size-subtitle-1);\n font-weight: var(--font-weight-body-1);\n line-height: var(--line-height-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n margin-left: 16px;\n color: var(--base-color-dark-grey);\n display: flex;\n align-items: center;\n border-bottom: 1px solid rgba(0, 0, 0, 0);\n }\n"]))); // PageNumber extends bodyText but uses subtitle-1 font size
|
|
8307
8551
|
|
|
8308
8552
|
var PageNumber = /*#__PURE__*/styled.a(_templateObject3$A || (_templateObject3$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: inherit;\n margin: 0;\n border-bottom: 1px solid transparent;\n line-height: var(--base-line-height);\n text-decoration: none;\n font-family: var(--font-family-body-1);\n :hover {\n color: var(--base-color-core);\n border-bottom: 1px solid var(--base-color-core);\n svg > path {\n fill: var(--base-color-core);\n }\n }\n /* active state - string used because react returns error for bool */\n ", "\n"])), function (_ref) {
|
|
@@ -8378,12 +8622,12 @@ var Pagination = function Pagination(_ref) {
|
|
|
8378
8622
|
}))));
|
|
8379
8623
|
};
|
|
8380
8624
|
|
|
8381
|
-
var _templateObject$
|
|
8382
|
-
var PeopleListingGrid = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
8625
|
+
var _templateObject$11, _templateObject2$J, _templateObject3$B, _templateObject4$t, _templateObject5$n, _templateObject6$h;
|
|
8626
|
+
var PeopleListingGrid = /*#__PURE__*/styled(Grid)(_templateObject$11 || (_templateObject$11 = /*#__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);
|
|
8383
8627
|
var PersonWrapper = /*#__PURE__*/styled.div(_templateObject2$J || (_templateObject2$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: 60px 1fr;\n grid-template-areas: 'headshot role-person';\n grid-column-gap: 10px;\n"])));
|
|
8384
8628
|
var HeadshotWrapper = /*#__PURE__*/styled.div(_templateObject3$B || (_templateObject3$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n grid-area: headshot;\n img {\n width: 60px;\n height: 60px;\n }\n"])));
|
|
8385
8629
|
var RoleWrapper = /*#__PURE__*/styled.div(_templateObject4$t || (_templateObject4$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n overflow-wrap: break-word;\n margin-bottom: 4px;\n"])));
|
|
8386
|
-
var TextWrapper$2 = /*#__PURE__*/styled.div(_templateObject5$
|
|
8630
|
+
var TextWrapper$2 = /*#__PURE__*/styled.div(_templateObject5$n || (_templateObject5$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: role-person;\n"])));
|
|
8387
8631
|
var PersonLink = /*#__PURE__*/styled.a(_templateObject6$h || (_templateObject6$h = /*#__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"])));
|
|
8388
8632
|
|
|
8389
8633
|
var Person = function Person(_ref) {
|
|
@@ -8435,11 +8679,11 @@ var PeopleListing = function PeopleListing(_ref) {
|
|
|
8435
8679
|
}));
|
|
8436
8680
|
};
|
|
8437
8681
|
|
|
8438
|
-
var _templateObject$
|
|
8439
|
-
var ReplacementWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
8682
|
+
var _templateObject$12, _templateObject2$K, _templateObject3$C, _templateObject4$u;
|
|
8683
|
+
var ReplacementWrapper = /*#__PURE__*/styled.div(_templateObject$12 || (_templateObject$12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n"])));
|
|
8440
8684
|
var CreditListingWrapper = /*#__PURE__*/styled(PeopleListingGrid)(_templateObject2$K || (_templateObject2$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n p {\n line-height: 1.5;\n }\n"])));
|
|
8441
|
-
var DescriptionWrapper = /*#__PURE__*/styled.div(_templateObject3$C || (_templateObject3$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n p {\n line-height:
|
|
8442
|
-
var RoleWrapper$1 = /*#__PURE__*/styled.div(_templateObject4$u || (_templateObject4$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n overflow-wrap: break-word;\n
|
|
8685
|
+
var DescriptionWrapper = /*#__PURE__*/styled.div(_templateObject3$C || (_templateObject3$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n p {\n line-height: 1.5;\n margin-bottom: 4px;\n }\n"])));
|
|
8686
|
+
var RoleWrapper$1 = /*#__PURE__*/styled.div(_templateObject4$u || (_templateObject4$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n overflow-wrap: break-word;\n"])));
|
|
8443
8687
|
|
|
8444
8688
|
var getConcatenatedPropLength = function getConcatenatedPropLength(array, prop) {
|
|
8445
8689
|
return array.reduce(function (acc, item) {
|
|
@@ -8450,12 +8694,18 @@ var getConcatenatedPropLength = function getConcatenatedPropLength(array, prop)
|
|
|
8450
8694
|
var concatenateMusicTitle = function concatenateMusicTitle(musicTitle) {
|
|
8451
8695
|
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, musicTitle.map(function (title, index) {
|
|
8452
8696
|
if (musicTitle.length > 1 && index === musicTitle.length - 1) {
|
|
8453
|
-
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, ' ', "and ", /*#__PURE__*/React__default.createElement("i",
|
|
8697
|
+
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, ' ', "and ", /*#__PURE__*/React__default.createElement("i", {
|
|
8698
|
+
key: index
|
|
8699
|
+
}, title));
|
|
8454
8700
|
} else if (index > 0) {
|
|
8455
|
-
return /*#__PURE__*/React__default.createElement("i",
|
|
8701
|
+
return /*#__PURE__*/React__default.createElement("i", {
|
|
8702
|
+
key: index
|
|
8703
|
+
}, ", ", title);
|
|
8456
8704
|
}
|
|
8457
8705
|
|
|
8458
|
-
return /*#__PURE__*/React__default.createElement("i",
|
|
8706
|
+
return /*#__PURE__*/React__default.createElement("i", {
|
|
8707
|
+
key: index
|
|
8708
|
+
}, title);
|
|
8459
8709
|
}));
|
|
8460
8710
|
};
|
|
8461
8711
|
|
|
@@ -8507,14 +8757,14 @@ var CreditListing = function CreditListing(_ref) {
|
|
|
8507
8757
|
}));
|
|
8508
8758
|
};
|
|
8509
8759
|
|
|
8510
|
-
var _templateObject$
|
|
8760
|
+
var _templateObject$13, _templateObject2$L, _templateObject3$D, _templateObject4$v, _templateObject5$o, _templateObject6$i, _templateObject7$c, _templateObject8$a, _templateObject9$5, _templateObject10$5, _templateObject11$2, _templateObject12$1, _templateObject13$1, _templateObject14$1, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21;
|
|
8511
8761
|
var LENGTH_TEXT = 28;
|
|
8512
8762
|
var LENGTH_TEXT_TABLET$1 = 12;
|
|
8513
8763
|
var GridTemplateImageToLeft = "'left left left left left left left left . right right right right right . .'";
|
|
8514
8764
|
var GridTemplateImageToRight = "'. . left left left left left . right right right right right right right right'";
|
|
8515
8765
|
var GridTemplateAsCard = "'. . left left left left left right right right right right right right . . '";
|
|
8516
8766
|
var GridTemplateAsCardTablet = "'. . left left left left left left left right right right right right . . '";
|
|
8517
|
-
var PromoWithTagsGrid = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
8767
|
+
var PromoWithTagsGrid = /*#__PURE__*/styled(Grid)(_templateObject$13 || (_templateObject$13 = /*#__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\n /* Overwrite template for card */\n ", "\n"])), function (_ref) {
|
|
8518
8768
|
var imageToLeft = _ref.imageToLeft;
|
|
8519
8769
|
return imageToLeft ? GridTemplateImageToLeft : GridTemplateImageToRight;
|
|
8520
8770
|
}, devices.tablet, function (_ref2) {
|
|
@@ -8563,7 +8813,7 @@ var ButtonsContainer$2 = /*#__PURE__*/styled.div(_templateObject4$v || (_templat
|
|
|
8563
8813
|
|
|
8564
8814
|
return '';
|
|
8565
8815
|
});
|
|
8566
|
-
var PromoWithTagsTagWrapper = /*#__PURE__*/styled.div(_templateObject5$
|
|
8816
|
+
var PromoWithTagsTagWrapper = /*#__PURE__*/styled.div(_templateObject5$o || (_templateObject5$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: ", ";\n"])), function (_ref10) {
|
|
8567
8817
|
var marginBottom = _ref10.marginBottom;
|
|
8568
8818
|
return marginBottom + "px";
|
|
8569
8819
|
});
|
|
@@ -8785,10 +9035,10 @@ var PromoWithTags = function PromoWithTags(_ref) {
|
|
|
8785
9035
|
}))));
|
|
8786
9036
|
};
|
|
8787
9037
|
|
|
8788
|
-
var _templateObject$
|
|
9038
|
+
var _templateObject$14, _templateObject2$M, _templateObject3$E, _templateObject4$w, _templateObject5$p, _templateObject6$j, _templateObject7$d;
|
|
8789
9039
|
var LENGTH_TEXT$2 = 28;
|
|
8790
9040
|
var LENGTH_TEXT_TABLET$2 = 10;
|
|
8791
|
-
var PromoWithTitleGrid = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
9041
|
+
var PromoWithTitleGrid = /*#__PURE__*/styled(Grid)(_templateObject$14 || (_templateObject$14 = /*#__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) {
|
|
8792
9042
|
var imageToLeft = _ref.imageToLeft;
|
|
8793
9043
|
return imageToLeft ? "'left left left left left left left left . right right right right right . .'" : "'. . left left left left left . right right right right right right right right'";
|
|
8794
9044
|
}, devices.tablet, function (_ref2) {
|
|
@@ -8804,7 +9054,7 @@ var PromoWithTitleContentWrapper = /*#__PURE__*/styled.div(_templateObject3$E ||
|
|
|
8804
9054
|
return imageToLeft ? 'right' : 'left';
|
|
8805
9055
|
}, devices.mobile);
|
|
8806
9056
|
var PromoWithTitleContainer = /*#__PURE__*/styled.div(_templateObject4$w || (_templateObject4$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h2,\n h3 {\n margin: 0 0 32px;\n\n @media ", " {\n & {\n margin: 0 0 24px;\n }\n }\n }\n"])), devices.mobile);
|
|
8807
|
-
var PromoWithTitleSubtitle = /*#__PURE__*/styled.span(_templateObject5$
|
|
9057
|
+
var PromoWithTitleSubtitle = /*#__PURE__*/styled.span(_templateObject5$p || (_templateObject5$p = /*#__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"])));
|
|
8808
9058
|
var PromoWithTitleText = /*#__PURE__*/styled.div(_templateObject6$j || (_templateObject6$j = /*#__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: ", ";\n }\n\n &:visited {\n color: ", ";\n }\n\n &:hover {\n color: ", ";\n }\n }\n"])), function (_ref5) {
|
|
8809
9059
|
var theme = _ref5.theme;
|
|
8810
9060
|
return theme.colors.black;
|
|
@@ -8841,8 +9091,8 @@ var ButtonsContainer$3 = /*#__PURE__*/styled.div(_templateObject7$d || (_templat
|
|
|
8841
9091
|
return '';
|
|
8842
9092
|
});
|
|
8843
9093
|
|
|
8844
|
-
var _templateObject$
|
|
8845
|
-
var VideoContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
9094
|
+
var _templateObject$15;
|
|
9095
|
+
var VideoContainer = /*#__PURE__*/styled.div(_templateObject$15 || (_templateObject$15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n aspect-ratio: ", ";\n\n @supports not (aspect-ratio: ", ") {\n width: 100%;\n padding-top: ", "%;\n }\n\n video {\n display: block;\n width: 100%;\n height: 100%;\n object-fit: cover;\n\n @supports not (aspect-ratio: ", ") {\n position: absolute;\n top: 0;\n left: 0;\n }\n }\n"])), function (_ref) {
|
|
8846
9096
|
var _ref$aspectRatio = _ref.aspectRatio,
|
|
8847
9097
|
aspectRatio = _ref$aspectRatio === void 0 ? AspectRatio['1:1'] : _ref$aspectRatio;
|
|
8848
9098
|
return aspectRatio;
|
|
@@ -8854,6 +9104,10 @@ var VideoContainer = /*#__PURE__*/styled.div(_templateObject$14 || (_templateObj
|
|
|
8854
9104
|
var _ref3$aspectRatio = _ref3.aspectRatio,
|
|
8855
9105
|
aspectRatio = _ref3$aspectRatio === void 0 ? AspectRatio['1:1'] : _ref3$aspectRatio;
|
|
8856
9106
|
return AspectRatioLegacy[aspectRatio];
|
|
9107
|
+
}, function (_ref4) {
|
|
9108
|
+
var _ref4$aspectRatio = _ref4.aspectRatio,
|
|
9109
|
+
aspectRatio = _ref4$aspectRatio === void 0 ? AspectRatio['1:1'] : _ref4$aspectRatio;
|
|
9110
|
+
return aspectRatio;
|
|
8857
9111
|
});
|
|
8858
9112
|
|
|
8859
9113
|
var getAspectRatioFromVideo = function getAspectRatioFromVideo(video) {
|
|
@@ -8870,17 +9124,50 @@ var getAspectRatioFromVideo = function getAspectRatioFromVideo(video) {
|
|
|
8870
9124
|
return AspectRatio[aspectRatioKey] || AspectRatio['16:9'];
|
|
8871
9125
|
};
|
|
8872
9126
|
|
|
9127
|
+
/**
|
|
9128
|
+
* Generates a random string in the format XXX-XXX.
|
|
9129
|
+
* Does not meet UUID standards.
|
|
9130
|
+
* To be used where only a small number of unique IDs are required, e.g. DOM element IDs.
|
|
9131
|
+
*
|
|
9132
|
+
* @return {string} A random string in the format XXX-XXX.
|
|
9133
|
+
*/
|
|
9134
|
+
var generateDomElementId = function generateDomElementId() {
|
|
9135
|
+
var randomPart = Math.floor(100 + Math.random() * 900).toString();
|
|
9136
|
+
var datePart = Date.now().toString().slice(-3);
|
|
9137
|
+
return randomPart + "-" + datePart;
|
|
9138
|
+
};
|
|
9139
|
+
|
|
8873
9140
|
var VideoWithControls$1 = function VideoWithControls(_ref) {
|
|
8874
9141
|
var video = _ref.video,
|
|
8875
9142
|
settings = _ref.settings;
|
|
8876
|
-
var
|
|
8877
|
-
autoPlay = settings.autoPlay;
|
|
9143
|
+
var videoRef = useRef(null);
|
|
8878
9144
|
|
|
8879
9145
|
var _useState = useState(AspectRatio['16:9']),
|
|
8880
9146
|
aspectRatio = _useState[0],
|
|
8881
9147
|
setAspectRatio = _useState[1];
|
|
8882
9148
|
|
|
8883
|
-
var
|
|
9149
|
+
var _React$useState = React__default.useState(false),
|
|
9150
|
+
isVideoReady = _React$useState[0],
|
|
9151
|
+
setIsVideoReady = _React$useState[1];
|
|
9152
|
+
|
|
9153
|
+
var muted = settings.muted,
|
|
9154
|
+
autoPlay = settings.autoPlay;
|
|
9155
|
+
React__default.useEffect(function () {
|
|
9156
|
+
var changeVideoReadiness = function changeVideoReadiness() {
|
|
9157
|
+
setIsVideoReady(true);
|
|
9158
|
+
};
|
|
9159
|
+
|
|
9160
|
+
if (videoRef.current) {
|
|
9161
|
+
videoRef.current.addEventListener('canplay', changeVideoReadiness);
|
|
9162
|
+
return function () {
|
|
9163
|
+
var _videoRef$current;
|
|
9164
|
+
|
|
9165
|
+
return (_videoRef$current = videoRef.current) == null ? void 0 : _videoRef$current.removeEventListener('canplay', changeVideoReadiness);
|
|
9166
|
+
};
|
|
9167
|
+
}
|
|
9168
|
+
|
|
9169
|
+
return undefined;
|
|
9170
|
+
}, []);
|
|
8884
9171
|
|
|
8885
9172
|
var handleMetadataLoaded = function handleMetadataLoaded() {
|
|
8886
9173
|
if (videoRef.current) {
|
|
@@ -8889,18 +9176,24 @@ var VideoWithControls$1 = function VideoWithControls(_ref) {
|
|
|
8889
9176
|
}
|
|
8890
9177
|
};
|
|
8891
9178
|
|
|
8892
|
-
var
|
|
9179
|
+
var videoElementId = useMemo(function () {
|
|
9180
|
+
return "video-id-" + generateDomElementId();
|
|
9181
|
+
}, []);
|
|
9182
|
+
var clonedVideo = /*#__PURE__*/cloneElement(video, _extends({
|
|
9183
|
+
playsInline: true
|
|
9184
|
+
}, muted ? {
|
|
8893
9185
|
muted: true
|
|
8894
9186
|
} : {}, autoPlay && muted ? {
|
|
8895
9187
|
autoPlay: true
|
|
8896
9188
|
} : {}, {
|
|
8897
9189
|
height: '100%',
|
|
8898
9190
|
width: '100%',
|
|
8899
|
-
onLoadedMetadata: handleMetadataLoaded
|
|
9191
|
+
onLoadedMetadata: handleMetadataLoaded,
|
|
9192
|
+
id: videoElementId
|
|
8900
9193
|
}, {
|
|
9194
|
+
poster: autoPlay && isVideoReady ? undefined : video.props.poster,
|
|
8901
9195
|
ref: videoRef
|
|
8902
9196
|
}));
|
|
8903
|
-
var videoElementId = clonedVideo.props.id;
|
|
8904
9197
|
var videoContainerId = "video-container-for-" + videoElementId;
|
|
8905
9198
|
|
|
8906
9199
|
var videoControlsProps = _extends({}, settings, {
|
|
@@ -8908,14 +9201,12 @@ var VideoWithControls$1 = function VideoWithControls(_ref) {
|
|
|
8908
9201
|
videoContainerId: videoContainerId
|
|
8909
9202
|
});
|
|
8910
9203
|
|
|
8911
|
-
|
|
8912
|
-
setAspectRatio(AspectRatio['16:9']);
|
|
8913
|
-
}, [video.props.src]);
|
|
9204
|
+
var showVideoControls = autoPlay ? isVideoReady : true;
|
|
8914
9205
|
return /*#__PURE__*/React__default.createElement(VideoContainer, {
|
|
8915
9206
|
aspectRatio: aspectRatio,
|
|
8916
9207
|
id: videoContainerId,
|
|
8917
|
-
"data-testid":
|
|
8918
|
-
}, clonedVideo, /*#__PURE__*/React__default.createElement(VideoControls, Object.assign({}, videoControlsProps)));
|
|
9208
|
+
"data-testid": 'video-container'
|
|
9209
|
+
}, clonedVideo, showVideoControls && /*#__PURE__*/React__default.createElement(VideoControls, Object.assign({}, videoControlsProps)));
|
|
8919
9210
|
};
|
|
8920
9211
|
|
|
8921
9212
|
var PromoChild = function PromoChild(_ref) {
|
|
@@ -8949,7 +9240,8 @@ var PromoWithTitle = function PromoWithTitle(_ref) {
|
|
|
8949
9240
|
text = _ref.text,
|
|
8950
9241
|
links = _ref.links,
|
|
8951
9242
|
children = _ref.children,
|
|
8952
|
-
videoSettings = _ref.videoSettings
|
|
9243
|
+
videoSettings = _ref.videoSettings,
|
|
9244
|
+
titleSemanticLevel = _ref.titleSemanticLevel;
|
|
8953
9245
|
|
|
8954
9246
|
var truncate = function truncate(str, n) {
|
|
8955
9247
|
return str.length >= n ? str.substr(0, n) : str;
|
|
@@ -8990,7 +9282,8 @@ var PromoWithTitle = function PromoWithTitle(_ref) {
|
|
|
8990
9282
|
"data-testid": "content-wrapper",
|
|
8991
9283
|
imageToLeft: imageToLeft
|
|
8992
9284
|
}, /*#__PURE__*/React__default.createElement(PromoWithTitleContainer, null, /*#__PURE__*/React__default.createElement(Header, {
|
|
8993
|
-
level: titleLevel
|
|
9285
|
+
level: titleLevel,
|
|
9286
|
+
semanticLevel: titleSemanticLevel != null ? titleSemanticLevel : titleLevel
|
|
8994
9287
|
}, title)), subtitle ? /*#__PURE__*/React__default.createElement(PromoWithTitleSubtitle, null, subtitle) : null, /*#__PURE__*/React__default.createElement(PromoWithTitleText, {
|
|
8995
9288
|
dangerouslySetInnerHTML: {
|
|
8996
9289
|
__html: text
|
|
@@ -9002,8 +9295,8 @@ var PromoWithTitle = function PromoWithTitle(_ref) {
|
|
|
9002
9295
|
}, primaryButton ? /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, restPrimaryButton), primaryButtonTextTruncate) : null, tertiaryButton ? /*#__PURE__*/React__default.createElement(Button$1, Object.assign({}, restTertiaryButton), tertiaryButtonTextTruncate) : null) : null));
|
|
9003
9296
|
};
|
|
9004
9297
|
|
|
9005
|
-
var _templateObject$
|
|
9006
|
-
var RadioGroupContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
9298
|
+
var _templateObject$16;
|
|
9299
|
+
var RadioGroupContainer = /*#__PURE__*/styled.div(_templateObject$16 || (_templateObject$16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 30px;\n"])));
|
|
9007
9300
|
|
|
9008
9301
|
/**
|
|
9009
9302
|
* DEPRECATED. Use RadioGroup2 instead
|
|
@@ -9061,8 +9354,8 @@ var RadioGroup = function RadioGroup(_ref) {
|
|
|
9061
9354
|
})));
|
|
9062
9355
|
};
|
|
9063
9356
|
|
|
9064
|
-
var _templateObject$
|
|
9065
|
-
var Container$3 = /*#__PURE__*/styled.div(_templateObject$
|
|
9357
|
+
var _templateObject$17, _templateObject2$N, _templateObject3$F;
|
|
9358
|
+
var Container$3 = /*#__PURE__*/styled.div(_templateObject$17 || (_templateObject$17 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
9066
9359
|
var RadioGroup$1 = /*#__PURE__*/styled.div(_templateObject2$N || (_templateObject2$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: flex-start;\n justify-content: flex-start;\n flex-direction: ", ";\n gap: ", ";\n"])), function (_ref) {
|
|
9067
9360
|
var horizontalMode = _ref.horizontalMode;
|
|
9068
9361
|
if (horizontalMode) return 'row';
|
|
@@ -9071,7 +9364,7 @@ var RadioGroup$1 = /*#__PURE__*/styled.div(_templateObject2$N || (_templateObjec
|
|
|
9071
9364
|
var gap = _ref2.gap;
|
|
9072
9365
|
return gap + "px";
|
|
9073
9366
|
});
|
|
9074
|
-
var ErrorLabel$
|
|
9367
|
+
var ErrorLabel$4 = /*#__PURE__*/styled.div(_templateObject3$F || (_templateObject3$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 20px;\n color: ", ";\n"])), function (_ref3) {
|
|
9075
9368
|
var darkMode = _ref3.darkMode;
|
|
9076
9369
|
if (darkMode) return 'var(--base-color-white)';
|
|
9077
9370
|
return 'var(--base-color-errorstate)';
|
|
@@ -9143,7 +9436,7 @@ var RadioGroup2 = function RadioGroup2(_ref) {
|
|
|
9143
9436
|
error: error !== undefined ? '' : undefined,
|
|
9144
9437
|
onChange: changeHandler
|
|
9145
9438
|
}, radio.content);
|
|
9146
|
-
})), !!error && /*#__PURE__*/React__default.createElement(ErrorLabel$
|
|
9439
|
+
})), !!error && /*#__PURE__*/React__default.createElement(ErrorLabel$4, {
|
|
9147
9440
|
darkMode: darkMode,
|
|
9148
9441
|
"data-testid": "radio-group-error-label"
|
|
9149
9442
|
}, /*#__PURE__*/React__default.createElement(AltHeader, {
|
|
@@ -9151,8 +9444,8 @@ var RadioGroup2 = function RadioGroup2(_ref) {
|
|
|
9151
9444
|
}, error)));
|
|
9152
9445
|
};
|
|
9153
9446
|
|
|
9154
|
-
var _templateObject$
|
|
9155
|
-
var StatusBannerWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
9447
|
+
var _templateObject$18, _templateObject2$O, _templateObject3$G;
|
|
9448
|
+
var StatusBannerWrapper = /*#__PURE__*/styled.div(_templateObject$18 || (_templateObject$18 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 26px 150px;\n display: flex;\n justify-content: space-between;\n background-color: var(--base-color-lightgrey);\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);
|
|
9156
9449
|
var ContentContainer$3 = /*#__PURE__*/styled.div(_templateObject2$O || (_templateObject2$O = /*#__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"])));
|
|
9157
9450
|
var SvgContainer$3 = /*#__PURE__*/styled.div(_templateObject3$G || (_templateObject3$G = /*#__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);
|
|
9158
9451
|
|
|
@@ -9216,14 +9509,15 @@ var StatusBanner = function StatusBanner(_ref) {
|
|
|
9216
9509
|
})))));
|
|
9217
9510
|
};
|
|
9218
9511
|
|
|
9219
|
-
var _templateObject$
|
|
9220
|
-
var SectionTitleWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
9512
|
+
var _templateObject$19;
|
|
9513
|
+
var SectionTitleWrapper = /*#__PURE__*/styled.div(_templateObject$19 || (_templateObject$19 = /*#__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);
|
|
9221
9514
|
|
|
9222
9515
|
var SectionTitle = function SectionTitle(_ref) {
|
|
9223
9516
|
var title = _ref.title,
|
|
9224
9517
|
_ref$size = _ref.size,
|
|
9225
9518
|
size = _ref$size === void 0 ? 'small' : _ref$size,
|
|
9226
|
-
description = _ref.description
|
|
9519
|
+
description = _ref.description,
|
|
9520
|
+
semanticLevel = _ref.semanticLevel;
|
|
9227
9521
|
var headingLevel = size === 'large' ? 1 : 2;
|
|
9228
9522
|
return /*#__PURE__*/React__default.createElement(SectionTitleWrapper, null, /*#__PURE__*/React__default.createElement(Grid, null, /*#__PURE__*/React__default.createElement(GridItem, {
|
|
9229
9523
|
columnStartDesktop: 3,
|
|
@@ -9231,7 +9525,8 @@ var SectionTitle = function SectionTitle(_ref) {
|
|
|
9231
9525
|
columnStartDevice: 2,
|
|
9232
9526
|
columnSpanDevice: 12
|
|
9233
9527
|
}, /*#__PURE__*/React__default.createElement(Header, {
|
|
9234
|
-
level: headingLevel
|
|
9528
|
+
level: headingLevel,
|
|
9529
|
+
semanticLevel: semanticLevel != null ? semanticLevel : headingLevel
|
|
9235
9530
|
}, title)), description && /*#__PURE__*/React__default.createElement(GridItem, {
|
|
9236
9531
|
columnStartDesktop: 3,
|
|
9237
9532
|
columnSpanDesktop: 8,
|
|
@@ -9243,8 +9538,8 @@ var SectionTitle = function SectionTitle(_ref) {
|
|
|
9243
9538
|
}, description))));
|
|
9244
9539
|
};
|
|
9245
9540
|
|
|
9246
|
-
var _templateObject$
|
|
9247
|
-
var stateStyles = /*#__PURE__*/css(_templateObject$
|
|
9541
|
+
var _templateObject$1a, _templateObject2$P, _templateObject3$H, _templateObject4$x, _templateObject5$q, _templateObject6$k, _templateObject7$e, _templateObject8$b, _templateObject9$6, _templateObject10$6, _templateObject11$3;
|
|
9542
|
+
var stateStyles = /*#__PURE__*/css(_templateObject$1a || (_templateObject$1a = /*#__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) {
|
|
9248
9543
|
var theme = _ref.theme;
|
|
9249
9544
|
return "3px solid " + theme.colors.lapisLazuli;
|
|
9250
9545
|
}, function (_ref2) {
|
|
@@ -9267,7 +9562,7 @@ var ArrowIcon = /*#__PURE__*/styled(Icon).attrs(function (_ref5) {
|
|
|
9267
9562
|
color: theme.colors.black,
|
|
9268
9563
|
title: 'Select Arrow'
|
|
9269
9564
|
};
|
|
9270
|
-
})(_templateObject5$
|
|
9565
|
+
})(_templateObject5$q || (_templateObject5$q = /*#__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"])));
|
|
9271
9566
|
var Wrapper$5 = /*#__PURE__*/styled.div(_templateObject6$k || (_templateObject6$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n height: initial;\n\n display: flex;\n flex-direction: column;\n gap: 20px;\n"])), noMarginAndPaddingStyles);
|
|
9272
9567
|
var SelectWrapper = /*#__PURE__*/styled.div(_templateObject7$e || (_templateObject7$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n height: inherit;\n"])), noMarginAndPaddingStyles);
|
|
9273
9568
|
var Options = /*#__PURE__*/styled.div(_templateObject8$b || (_templateObject8$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n z-index: 1;\n\n ", "\n ", "\n"])), noMarginAndPaddingStyles, borderStyles);
|
|
@@ -9666,8 +9961,8 @@ function Select(_ref3) {
|
|
|
9666
9961
|
}))), /*#__PURE__*/React__default.createElement(ArrowIcon, null)));
|
|
9667
9962
|
}
|
|
9668
9963
|
|
|
9669
|
-
var _templateObject$
|
|
9670
|
-
var Container$4 = /*#__PURE__*/styled.div(_templateObject$
|
|
9964
|
+
var _templateObject$1b, _templateObject2$Q, _templateObject3$I, _templateObject4$y;
|
|
9965
|
+
var Container$4 = /*#__PURE__*/styled.div(_templateObject$1b || (_templateObject$1b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
9671
9966
|
var SelectWrapper$1 = /*#__PURE__*/styled.div(_templateObject2$Q || (_templateObject2$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n width: auto;\n max-width: ", ";\n\n .chord-select__control {\n min-height: 48px;\n border-radius: 0;\n transition: none;\n border: ", ";\n &:hover {\n border-color: ", ";\n }\n }\n .chord-select__control--is-focused {\n border-color: var(--base-color-darkgrey);\n box-shadow: ", ";\n }\n .chord-select__control--menu-is-open {\n .chord-select__indicator {\n svg {\n transform: rotate(180deg);\n }\n }\n }\n .chord-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 .chord-select__single-value,\n .chord-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 .chord-select__placeholder {\n color: var(--base-color-darkgrey);\n }\n .chord-select__single-value {\n color: var(--base-color-black);\n }\n .chord-select__value-container {\n padding-left: 20px;\n padding-right: 20px;\n padding-top: 1px;\n padding-bottom: 0px;\n }\n .chord-select--is-disabled {\n .chord-select__control {\n border: 1px solid var(--base-color-lightgrey);\n background: var(--base-color-lightgrey);\n }\n .chord-select__indicator,\n .chord-select__single-value {\n color: var(--base-color-darkgrey);\n }\n }\n .chord-select__menu {\n margin-top: -1px;\n box-shadow: none;\n border-radius: 0;\n border: 1px solid var(--base-color-darkgrey);\n background: var(--base-color-lightgrey);\n }\n .chord-select__menu-list {\n padding-top: 0;\n padding-bottom: 0;\n }\n .chord-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 &.chord-select__option--is-focused {\n background: var(--base-color-midgrey);\n }\n }\n .chord-select__option--is-selected {\n color: var(--base-color-black);\n background: none;\n }\n .chord-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 .chord-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 .chord-select__menu-notice--loading {\n font-style: italic;\n }\n"])), function (_ref) {
|
|
9672
9967
|
var width = _ref.width;
|
|
9673
9968
|
if (!width) return 'none';
|
|
@@ -9685,12 +9980,12 @@ var SelectWrapper$1 = /*#__PURE__*/styled.div(_templateObject2$Q || (_templateOb
|
|
|
9685
9980
|
if (darkMode) return "0 0 0 4px var(--base-color-lemonchiffon)";
|
|
9686
9981
|
return "0 0 0 3px var(--base-color-lapislazuli)";
|
|
9687
9982
|
});
|
|
9688
|
-
var TextLabel$
|
|
9983
|
+
var TextLabel$4 = /*#__PURE__*/styled.div(_templateObject3$I || (_templateObject3$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0 0 20px;\n color: ", ";\n"])), function (_ref5) {
|
|
9689
9984
|
var darkMode = _ref5.darkMode;
|
|
9690
9985
|
if (darkMode) return "var(--base-color-white)";
|
|
9691
9986
|
return "var(--base-color-black)";
|
|
9692
9987
|
});
|
|
9693
|
-
var ErrorLabel$
|
|
9988
|
+
var ErrorLabel$5 = /*#__PURE__*/styled.div(_templateObject4$y || (_templateObject4$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 20px 0 0;\n color: ", ";\n"])), function (_ref6) {
|
|
9694
9989
|
var darkMode = _ref6.darkMode;
|
|
9695
9990
|
if (darkMode) return "var(--base-color-white)";
|
|
9696
9991
|
return "var(--base-color-errorstate)";
|
|
@@ -9707,7 +10002,7 @@ var WrapperComponent = function WrapperComponent(_ref) {
|
|
|
9707
10002
|
width = _ref.width,
|
|
9708
10003
|
darkMode = _ref.darkMode,
|
|
9709
10004
|
children = _ref.children;
|
|
9710
|
-
return /*#__PURE__*/React__default.createElement(Container$4, null, /*#__PURE__*/React__default.createElement("label", null, !!label && /*#__PURE__*/React__default.createElement(TextLabel$
|
|
10005
|
+
return /*#__PURE__*/React__default.createElement(Container$4, null, /*#__PURE__*/React__default.createElement("label", null, !!label && /*#__PURE__*/React__default.createElement(TextLabel$4, {
|
|
9711
10006
|
darkMode: darkMode,
|
|
9712
10007
|
"data-testid": "select2-text-label"
|
|
9713
10008
|
}, /*#__PURE__*/React__default.createElement(AltHeader, {
|
|
@@ -9716,7 +10011,7 @@ var WrapperComponent = function WrapperComponent(_ref) {
|
|
|
9716
10011
|
width: width,
|
|
9717
10012
|
error: error,
|
|
9718
10013
|
darkMode: darkMode
|
|
9719
|
-
}, children)), !!error && /*#__PURE__*/React__default.createElement(ErrorLabel$
|
|
10014
|
+
}, children)), !!error && /*#__PURE__*/React__default.createElement(ErrorLabel$5, {
|
|
9720
10015
|
darkMode: darkMode,
|
|
9721
10016
|
"data-testid": "select2-error-label"
|
|
9722
10017
|
}, /*#__PURE__*/React__default.createElement(AltHeader, {
|
|
@@ -9806,8 +10101,8 @@ var SelectComponent$1 = function SelectComponent(_ref) {
|
|
|
9806
10101
|
})));
|
|
9807
10102
|
};
|
|
9808
10103
|
|
|
9809
|
-
var _templateObject$
|
|
9810
|
-
var TextContainer$2 = /*#__PURE__*/styled.div(_templateObject$
|
|
10104
|
+
var _templateObject$1c;
|
|
10105
|
+
var TextContainer$2 = /*#__PURE__*/styled.div(_templateObject$1c || (_templateObject$1c = /*#__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) {
|
|
9811
10106
|
var theme = _ref.theme;
|
|
9812
10107
|
return theme.colors.primary;
|
|
9813
10108
|
});
|
|
@@ -9835,8 +10130,8 @@ var TextOnly = function TextOnly(_ref) {
|
|
|
9835
10130
|
})));
|
|
9836
10131
|
};
|
|
9837
10132
|
|
|
9838
|
-
var _templateObject$
|
|
9839
|
-
var Wrapper$6 = /*#__PURE__*/styled.div(_templateObject$
|
|
10133
|
+
var _templateObject$1d, _templateObject2$R;
|
|
10134
|
+
var Wrapper$6 = /*#__PURE__*/styled.div(_templateObject$1d || (_templateObject$1d = /*#__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"])), ImageAspectRatioWrapper, function (_ref) {
|
|
9840
10135
|
var _ref$aspectRatio = _ref.aspectRatio,
|
|
9841
10136
|
aspectRatio = _ref$aspectRatio === void 0 ? AspectRatio['1:1'] : _ref$aspectRatio;
|
|
9842
10137
|
return aspectRatio;
|
|
@@ -9884,8 +10179,8 @@ var ImageWithCaption = function ImageWithCaption(_ref) {
|
|
|
9884
10179
|
}, children), /*#__PURE__*/React__default.createElement(CaptionWrapper, null, caption));
|
|
9885
10180
|
};
|
|
9886
10181
|
|
|
9887
|
-
var _templateObject$
|
|
9888
|
-
var TextWrapper$3 = /*#__PURE__*/styled.div(_templateObject$
|
|
10182
|
+
var _templateObject$1e, _templateObject2$S, _templateObject3$J;
|
|
10183
|
+
var TextWrapper$3 = /*#__PURE__*/styled.div(_templateObject$1e || (_templateObject$1e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h4 {\n margin: 0;\n }\n"])));
|
|
9889
10184
|
var AttributionWrapper = /*#__PURE__*/styled.div(_templateObject2$S || (_templateObject2$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n"])), function (_ref) {
|
|
9890
10185
|
var displayAttribution = _ref.displayAttribution;
|
|
9891
10186
|
return "display: " + (displayAttribution ? 'block' : 'none') + ";";
|
|
@@ -9914,12 +10209,12 @@ var Quote = function Quote(_ref) {
|
|
|
9914
10209
|
}, attribution))));
|
|
9915
10210
|
};
|
|
9916
10211
|
|
|
9917
|
-
var _templateObject$
|
|
9918
|
-
var CardContainer$1 = /*#__PURE__*/styled.div(_templateObject$
|
|
10212
|
+
var _templateObject$1f, _templateObject2$T, _templateObject3$K, _templateObject4$z, _templateObject5$r, _templateObject6$l;
|
|
10213
|
+
var CardContainer$1 = /*#__PURE__*/styled.div(_templateObject$1f || (_templateObject$1f = /*#__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"])));
|
|
9919
10214
|
var ContentContainer$4 = /*#__PURE__*/styled.div(_templateObject2$T || (_templateObject2$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n"])));
|
|
9920
10215
|
var StyledImage = /*#__PURE__*/styled.img(_templateObject3$K || (_templateObject3$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 1px solid var(--base-color-white);\n"])));
|
|
9921
10216
|
var ImageWrapper = /*#__PURE__*/styled.div(_templateObject4$z || (_templateObject4$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
|
|
9922
|
-
var IconWrapper$3 = /*#__PURE__*/styled.div(_templateObject5$
|
|
10217
|
+
var IconWrapper$3 = /*#__PURE__*/styled.div(_templateObject5$r || (_templateObject5$r = /*#__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);
|
|
9923
10218
|
var TitleWrapper$2 = /*#__PURE__*/styled.div(_templateObject6$l || (_templateObject6$l = /*#__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);
|
|
9924
10219
|
|
|
9925
10220
|
var MiniCard = function MiniCard(_ref) {
|
|
@@ -9958,8 +10253,8 @@ var MiniCard = function MiniCard(_ref) {
|
|
|
9958
10253
|
}, title)))));
|
|
9959
10254
|
};
|
|
9960
10255
|
|
|
9961
|
-
var _templateObject$
|
|
9962
|
-
var ReadMoreContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
10256
|
+
var _templateObject$1g, _templateObject2$U, _templateObject3$L, _templateObject4$A;
|
|
10257
|
+
var ReadMoreContainer = /*#__PURE__*/styled.div(_templateObject$1g || (_templateObject$1g = /*#__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"])));
|
|
9963
10258
|
var LinkContainer = /*#__PURE__*/styled.div(_templateObject2$U || (_templateObject2$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-top: 24px;\n gap: 8px;\n\n :hover {\n cursor: pointer;\n }\n"])));
|
|
9964
10259
|
var FullTextContainer = /*#__PURE__*/styled.div(_templateObject3$L || (_templateObject3$L = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
9965
10260
|
var ContentContainer$5 = /*#__PURE__*/styled.div(_templateObject4$A || (_templateObject4$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.4s ease;\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 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 }\n\n & h2 {\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 }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n"])));
|
|
@@ -10060,15 +10355,113 @@ var ReadMore = function ReadMore(_ref) {
|
|
|
10060
10355
|
}, isFullTextOpen ? "" + hideText : "" + showMoreText)));
|
|
10061
10356
|
};
|
|
10062
10357
|
|
|
10063
|
-
var _templateObject$
|
|
10064
|
-
var
|
|
10065
|
-
var
|
|
10066
|
-
var
|
|
10067
|
-
var
|
|
10358
|
+
var _templateObject$1h, _templateObject2$V, _templateObject3$M, _templateObject4$B, _templateObject5$s, _templateObject6$m;
|
|
10359
|
+
var Container$5 = /*#__PURE__*/styled.div(_templateObject$1h || (_templateObject$1h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 10px;\n"])));
|
|
10360
|
+
var Sections = /*#__PURE__*/styled.div(_templateObject2$V || (_templateObject2$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n gap: 8px;\n"])));
|
|
10361
|
+
var Section = /*#__PURE__*/styled.div(_templateObject3$M || (_templateObject3$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 1;\n height: 2px;\n background-color: ", ";\n"])), function (_ref) {
|
|
10362
|
+
var color = _ref.color;
|
|
10363
|
+
return "var(--base-color-" + color + ")";
|
|
10364
|
+
});
|
|
10365
|
+
var BottomLine = /*#__PURE__*/styled.div(_templateObject4$B || (_templateObject4$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n gap: 20px;\n"])));
|
|
10366
|
+
var Text = /*#__PURE__*/styled.div(_templateObject5$s || (_templateObject5$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (_ref2) {
|
|
10367
|
+
var color = _ref2.color;
|
|
10368
|
+
return "var(--base-color-" + color + ")";
|
|
10369
|
+
});
|
|
10370
|
+
var LabelText = /*#__PURE__*/styled.div(_templateObject6$m || (_templateObject6$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 1px;\n white-space: nowrap;\n color: ", ";\n"])), function (_ref3) {
|
|
10371
|
+
var color = _ref3.color;
|
|
10372
|
+
return "var(--base-color-" + color + ")";
|
|
10373
|
+
});
|
|
10374
|
+
|
|
10375
|
+
/**
|
|
10376
|
+
* Password strength indicator component.
|
|
10377
|
+
* This renders some number of lines (6 by default)
|
|
10378
|
+
* which should become active when the user improves
|
|
10379
|
+
* the strength of the entered password.
|
|
10380
|
+
*
|
|
10381
|
+
* ## Sections
|
|
10382
|
+
* To set number of sections it should be passed
|
|
10383
|
+
* as `sections` prop.
|
|
10384
|
+
*
|
|
10385
|
+
* ## Active section
|
|
10386
|
+
* To set number of active sections it should be passed
|
|
10387
|
+
* as `activeSections` prop.
|
|
10388
|
+
*
|
|
10389
|
+
* ## Colors
|
|
10390
|
+
* Color of every element can be controlled by properties:
|
|
10391
|
+
* `sectionsColor`, `activeSectionsColor`,
|
|
10392
|
+
* `textColor`, `strengthLabelColor`.
|
|
10393
|
+
*
|
|
10394
|
+
* ## Text
|
|
10395
|
+
* `text` prop is used to render some message.
|
|
10396
|
+
* For example error (together with proper red color)
|
|
10397
|
+
* or some password requirement. It can be empty.
|
|
10398
|
+
*
|
|
10399
|
+
* ## Strength label
|
|
10400
|
+
* `strengthLabel` prop is used to render strength characteristic
|
|
10401
|
+
* of entered password. For example: `weak`, `normal`, `strong`, etc.
|
|
10402
|
+
* It can be empty.
|
|
10403
|
+
*/
|
|
10404
|
+
|
|
10405
|
+
var PasswordStrength = function PasswordStrength(_ref) {
|
|
10406
|
+
var _ref$sections = _ref.sections,
|
|
10407
|
+
sections = _ref$sections === void 0 ? 6 : _ref$sections,
|
|
10408
|
+
_ref$activeSections = _ref.activeSections,
|
|
10409
|
+
activeSections = _ref$activeSections === void 0 ? 0 : _ref$activeSections,
|
|
10410
|
+
_ref$sectionsColor = _ref.sectionsColor,
|
|
10411
|
+
sectionsColor = _ref$sectionsColor === void 0 ? Colors.MidGrey : _ref$sectionsColor,
|
|
10412
|
+
_ref$activeSectionsCo = _ref.activeSectionsColor,
|
|
10413
|
+
activeSectionsColor = _ref$activeSectionsCo === void 0 ? Colors.Black : _ref$activeSectionsCo,
|
|
10414
|
+
_ref$text = _ref.text,
|
|
10415
|
+
text = _ref$text === void 0 ? '' : _ref$text,
|
|
10416
|
+
_ref$textColor = _ref.textColor,
|
|
10417
|
+
textColor = _ref$textColor === void 0 ? Colors.Black : _ref$textColor,
|
|
10418
|
+
_ref$strengthLabel = _ref.strengthLabel,
|
|
10419
|
+
strengthLabel = _ref$strengthLabel === void 0 ? '' : _ref$strengthLabel,
|
|
10420
|
+
_ref$strengthLabelCol = _ref.strengthLabelColor,
|
|
10421
|
+
strengthLabelColor = _ref$strengthLabelCol === void 0 ? Colors.Black : _ref$strengthLabelCol;
|
|
10422
|
+
|
|
10423
|
+
var setSectionColor = function setSectionColor(index) {
|
|
10424
|
+
return index < activeSections ? activeSectionsColor : sectionsColor;
|
|
10425
|
+
};
|
|
10426
|
+
|
|
10427
|
+
var setSectionDataTestId = function setSectionDataTestId(index) {
|
|
10428
|
+
return index < activeSections ? 'password-strength-section-active' : 'password-strength-section';
|
|
10429
|
+
};
|
|
10430
|
+
|
|
10431
|
+
return /*#__PURE__*/React__default.createElement(Container$5, {
|
|
10432
|
+
"data-testid": "password-strength-container"
|
|
10433
|
+
}, /*#__PURE__*/React__default.createElement(Sections, {
|
|
10434
|
+
"data-testid": "password-strength-sections"
|
|
10435
|
+
}, Array.from({
|
|
10436
|
+
length: sections
|
|
10437
|
+
}, function (_section, i) {
|
|
10438
|
+
return /*#__PURE__*/React__default.createElement(Section, {
|
|
10439
|
+
key: i,
|
|
10440
|
+
color: setSectionColor(i),
|
|
10441
|
+
"data-testid": setSectionDataTestId(i)
|
|
10442
|
+
});
|
|
10443
|
+
})), /*#__PURE__*/React__default.createElement(BottomLine, null, /*#__PURE__*/React__default.createElement(Text, {
|
|
10444
|
+
color: textColor,
|
|
10445
|
+
"data-testid": "password-strength-text"
|
|
10446
|
+
}, /*#__PURE__*/React__default.createElement(AltHeader, {
|
|
10447
|
+
level: 6
|
|
10448
|
+
}, text)), /*#__PURE__*/React__default.createElement(LabelText, {
|
|
10449
|
+
color: strengthLabelColor,
|
|
10450
|
+
"data-testid": "password-strength-label"
|
|
10451
|
+
}, /*#__PURE__*/React__default.createElement(Overline, {
|
|
10452
|
+
level: 2
|
|
10453
|
+
}, strengthLabel))));
|
|
10454
|
+
};
|
|
10455
|
+
|
|
10456
|
+
var _templateObject$1i, _templateObject2$W, _templateObject3$N, _templateObject4$C, _templateObject5$t;
|
|
10457
|
+
var MenuContainer$2 = /*#__PURE__*/styled.nav(_templateObject$1i || (_templateObject$1i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding: 0;\n margin: 0;\n"])));
|
|
10458
|
+
var MenuList = /*#__PURE__*/styled.ul(_templateObject2$W || (_templateObject2$W = /*#__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);
|
|
10459
|
+
var MobileButton = /*#__PURE__*/styled.button(_templateObject3$N || (_templateObject3$N = /*#__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);
|
|
10460
|
+
var MenuItem$1 = /*#__PURE__*/styled.a(_templateObject4$C || (_templateObject4$C = /*#__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) {
|
|
10068
10461
|
var isActive = _ref.isActive;
|
|
10069
10462
|
return isActive ? "var(--base-color-" + Colors.MidGrey + ")" : 'none';
|
|
10070
10463
|
}, Colors.MidGrey);
|
|
10071
|
-
var MobileMenuList = /*#__PURE__*/styled.ul(_templateObject5$
|
|
10464
|
+
var MobileMenuList = /*#__PURE__*/styled.ul(_templateObject5$t || (_templateObject5$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n list-style: none;\n display: ", ";\n background: var(--base-color-", ");\n border: 1px solid var(--base-color-", ");\n border-top: 0;\n position: absolute;\n top: 100%;\n left: 0;\n right: 0;\n ", " {\n padding: 16px 20px 15px 20px;\n }\n"])), function (_ref2) {
|
|
10072
10465
|
var isOpen = _ref2.isOpen;
|
|
10073
10466
|
return isOpen ? 'block' : 'none';
|
|
10074
10467
|
}, Colors.White, Colors.DarkGrey, MenuItem$1);
|
|
@@ -10238,112 +10631,14 @@ var AuxiliaryNav = function AuxiliaryNav(_ref6) {
|
|
|
10238
10631
|
});
|
|
10239
10632
|
};
|
|
10240
10633
|
|
|
10241
|
-
var _templateObject$
|
|
10242
|
-
var
|
|
10243
|
-
var Sections = /*#__PURE__*/styled.div(_templateObject2$W || (_templateObject2$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n gap: 8px;\n"])));
|
|
10244
|
-
var Section = /*#__PURE__*/styled.div(_templateObject3$N || (_templateObject3$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 1;\n height: 2px;\n background-color: ", ";\n"])), function (_ref) {
|
|
10245
|
-
var color = _ref.color;
|
|
10246
|
-
return "var(--base-color-" + color + ")";
|
|
10247
|
-
});
|
|
10248
|
-
var BottomLine = /*#__PURE__*/styled.div(_templateObject4$C || (_templateObject4$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n gap: 20px;\n"])));
|
|
10249
|
-
var Text = /*#__PURE__*/styled.div(_templateObject5$s || (_templateObject5$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (_ref2) {
|
|
10250
|
-
var color = _ref2.color;
|
|
10251
|
-
return "var(--base-color-" + color + ")";
|
|
10252
|
-
});
|
|
10253
|
-
var LabelText = /*#__PURE__*/styled.div(_templateObject6$m || (_templateObject6$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 1px;\n white-space: nowrap;\n color: ", ";\n"])), function (_ref3) {
|
|
10254
|
-
var color = _ref3.color;
|
|
10255
|
-
return "var(--base-color-" + color + ")";
|
|
10256
|
-
});
|
|
10257
|
-
|
|
10258
|
-
/**
|
|
10259
|
-
* Password strength indicator component.
|
|
10260
|
-
* This renders some number of lines (6 by default)
|
|
10261
|
-
* which should become active when the user improves
|
|
10262
|
-
* the strength of the entered password.
|
|
10263
|
-
*
|
|
10264
|
-
* ## Sections
|
|
10265
|
-
* To set number of sections it should be passed
|
|
10266
|
-
* as `sections` prop.
|
|
10267
|
-
*
|
|
10268
|
-
* ## Active section
|
|
10269
|
-
* To set number of active sections it should be passed
|
|
10270
|
-
* as `activeSections` prop.
|
|
10271
|
-
*
|
|
10272
|
-
* ## Colors
|
|
10273
|
-
* Color of every element can be controlled by properties:
|
|
10274
|
-
* `sectionsColor`, `activeSectionsColor`,
|
|
10275
|
-
* `textColor`, `strengthLabelColor`.
|
|
10276
|
-
*
|
|
10277
|
-
* ## Text
|
|
10278
|
-
* `text` prop is used to render some message.
|
|
10279
|
-
* For example error (together with proper red color)
|
|
10280
|
-
* or some password requirement. It can be empty.
|
|
10281
|
-
*
|
|
10282
|
-
* ## Strength label
|
|
10283
|
-
* `strengthLabel` prop is used to render strength characteristic
|
|
10284
|
-
* of entered password. For example: `weak`, `normal`, `strong`, etc.
|
|
10285
|
-
* It can be empty.
|
|
10286
|
-
*/
|
|
10287
|
-
|
|
10288
|
-
var PasswordStrength = function PasswordStrength(_ref) {
|
|
10289
|
-
var _ref$sections = _ref.sections,
|
|
10290
|
-
sections = _ref$sections === void 0 ? 6 : _ref$sections,
|
|
10291
|
-
_ref$activeSections = _ref.activeSections,
|
|
10292
|
-
activeSections = _ref$activeSections === void 0 ? 0 : _ref$activeSections,
|
|
10293
|
-
_ref$sectionsColor = _ref.sectionsColor,
|
|
10294
|
-
sectionsColor = _ref$sectionsColor === void 0 ? Colors.MidGrey : _ref$sectionsColor,
|
|
10295
|
-
_ref$activeSectionsCo = _ref.activeSectionsColor,
|
|
10296
|
-
activeSectionsColor = _ref$activeSectionsCo === void 0 ? Colors.Black : _ref$activeSectionsCo,
|
|
10297
|
-
_ref$text = _ref.text,
|
|
10298
|
-
text = _ref$text === void 0 ? '' : _ref$text,
|
|
10299
|
-
_ref$textColor = _ref.textColor,
|
|
10300
|
-
textColor = _ref$textColor === void 0 ? Colors.Black : _ref$textColor,
|
|
10301
|
-
_ref$strengthLabel = _ref.strengthLabel,
|
|
10302
|
-
strengthLabel = _ref$strengthLabel === void 0 ? '' : _ref$strengthLabel,
|
|
10303
|
-
_ref$strengthLabelCol = _ref.strengthLabelColor,
|
|
10304
|
-
strengthLabelColor = _ref$strengthLabelCol === void 0 ? Colors.Black : _ref$strengthLabelCol;
|
|
10305
|
-
|
|
10306
|
-
var setSectionColor = function setSectionColor(index) {
|
|
10307
|
-
return index < activeSections ? activeSectionsColor : sectionsColor;
|
|
10308
|
-
};
|
|
10309
|
-
|
|
10310
|
-
var setSectionDataTestId = function setSectionDataTestId(index) {
|
|
10311
|
-
return index < activeSections ? 'password-strength-section-active' : 'password-strength-section';
|
|
10312
|
-
};
|
|
10313
|
-
|
|
10314
|
-
return /*#__PURE__*/React__default.createElement(Container$5, {
|
|
10315
|
-
"data-testid": "password-strength-container"
|
|
10316
|
-
}, /*#__PURE__*/React__default.createElement(Sections, {
|
|
10317
|
-
"data-testid": "password-strength-sections"
|
|
10318
|
-
}, Array.from({
|
|
10319
|
-
length: sections
|
|
10320
|
-
}, function (_section, i) {
|
|
10321
|
-
return /*#__PURE__*/React__default.createElement(Section, {
|
|
10322
|
-
key: i,
|
|
10323
|
-
color: setSectionColor(i),
|
|
10324
|
-
"data-testid": setSectionDataTestId(i)
|
|
10325
|
-
});
|
|
10326
|
-
})), /*#__PURE__*/React__default.createElement(BottomLine, null, /*#__PURE__*/React__default.createElement(Text, {
|
|
10327
|
-
color: textColor,
|
|
10328
|
-
"data-testid": "password-strength-text"
|
|
10329
|
-
}, /*#__PURE__*/React__default.createElement(AltHeader, {
|
|
10330
|
-
level: 6
|
|
10331
|
-
}, text)), /*#__PURE__*/React__default.createElement(LabelText, {
|
|
10332
|
-
color: strengthLabelColor,
|
|
10333
|
-
"data-testid": "password-strength-label"
|
|
10334
|
-
}, /*#__PURE__*/React__default.createElement(Overline, {
|
|
10335
|
-
level: 2
|
|
10336
|
-
}, strengthLabel))));
|
|
10337
|
-
};
|
|
10338
|
-
|
|
10339
|
-
var _templateObject$1i, _templateObject2$X, _templateObject3$O, _templateObject4$D, _templateObject5$t, _templateObject6$n, _templateObject7$f, _templateObject8$c, _templateObject9$7, _templateObject10$7;
|
|
10340
|
-
var TableContainer = /*#__PURE__*/styled.table(_templateObject$1i || (_templateObject$1i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-collapse: collapse;\n"])));
|
|
10634
|
+
var _templateObject$1j, _templateObject2$X, _templateObject3$O, _templateObject4$D, _templateObject5$u, _templateObject6$n, _templateObject7$f, _templateObject8$c, _templateObject9$7, _templateObject10$7;
|
|
10635
|
+
var TableContainer = /*#__PURE__*/styled.table(_templateObject$1j || (_templateObject$1j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-collapse: collapse;\n"])));
|
|
10341
10636
|
var Container$6 = /*#__PURE__*/styled.div(_templateObject2$X || (_templateObject2$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-x: auto;\n"])));
|
|
10342
10637
|
var Wrapper$7 = /*#__PURE__*/styled.div(_templateObject3$O || (_templateObject3$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n"])));
|
|
10343
10638
|
var TableHeader = /*#__PURE__*/styled.th(_templateObject4$D || (_templateObject4$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-subtitle-2);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-2);\n letter-spacing: var(--letter-spacing-subtitle-2);\n line-height: var(--line-height-subtitle-2);\n padding: 30px 30px 30px 0;\n text-align: left;\n text-transform: uppercase;\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 padding: 20px 20px 20px 0;\n\n &:last-child {\n white-space: normal;\n }\n }\n"])), function (props) {
|
|
10344
10639
|
return "calc(100% / " + (props.columns - 1) + ")";
|
|
10345
10640
|
}, devices.tablet, devices.mobile);
|
|
10346
|
-
var TableCell = /*#__PURE__*/styled.td(_templateObject5$
|
|
10641
|
+
var TableCell = /*#__PURE__*/styled.td(_templateObject5$u || (_templateObject5$u = /*#__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 padding: 30px 30px 30px 0;\n text-align: left;\n vertical-align: top;\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 padding: 20px 20px 20px 0;\n }\n"])), function (props) {
|
|
10347
10642
|
return "calc(100% / " + (props.columns - 1) + ")";
|
|
10348
10643
|
}, devices.mobile);
|
|
10349
10644
|
var LineContainer$1 = /*#__PURE__*/styled.div(_templateObject6$n || (_templateObject6$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 1px;\n background-color: ", ";\n width: 100%;\n"])), function (props) {
|
|
@@ -10621,8 +10916,8 @@ var LiveChat = function LiveChat() {
|
|
|
10621
10916
|
});
|
|
10622
10917
|
};
|
|
10623
10918
|
|
|
10624
|
-
var _templateObject$
|
|
10625
|
-
var StickyBarWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
10919
|
+
var _templateObject$1k, _templateObject2$Y;
|
|
10920
|
+
var StickyBarWrapper = /*#__PURE__*/styled.div(_templateObject$1k || (_templateObject$1k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n top: 0;\n position: sticky;\n z-index: ", ";\n background-color: var(--base-color-white);\n"])), zIndexes.anchor);
|
|
10626
10921
|
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) {
|
|
10627
10922
|
var hideBottomBorder = _ref.hideBottomBorder;
|
|
10628
10923
|
return !hideBottomBorder && 'border-bottom: 2px solid var(--base-color-lightgrey);';
|
|
@@ -10651,8 +10946,8 @@ var StickyBar = function StickyBar(_ref) {
|
|
|
10651
10946
|
}, children)));
|
|
10652
10947
|
};
|
|
10653
10948
|
|
|
10654
|
-
var _templateObject$
|
|
10655
|
-
var InnerModal = /*#__PURE__*/styled.div(_templateObject$
|
|
10949
|
+
var _templateObject$1l, _templateObject2$Z, _templateObject3$P, _templateObject4$E;
|
|
10950
|
+
var InnerModal = /*#__PURE__*/styled.div(_templateObject$1l || (_templateObject$1l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 62px;\n background-color: var(--base-color-white);\n z-index: ", ";\n position: relative;\n\n @media ", ", ", " {\n height: 100vh;\n padding: 62px 0 0;\n }\n"])), zIndexes.popup, devices.smallMobile, devices.mobile);
|
|
10656
10951
|
var CloseButton = /*#__PURE__*/styled.button(_templateObject2$Z || (_templateObject2$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 0;\n right: 0;\n margin: 15px;\n height: 26px;\n width: 26px;\n padding: 0;\n background-color: transparent;\n border: none;\n cursor: pointer;\n @media ", " {\n margin: 25px;\n }\n @media ", ", ", " {\n margin: 30px;\n }\n"])), devices.tablet, devices.desktop, devices.largeDesktop);
|
|
10657
10952
|
var ContentWrapper$1 = /*#__PURE__*/styled.div(_templateObject3$P || (_templateObject3$P = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
10658
10953
|
var Overlay = /*#__PURE__*/styled(Grid)(_templateObject4$E || (_templateObject4$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100vh;\n align-content: center;\n background-color: rgba(0, 0, 0, 0.4);\n"])));
|
|
@@ -10775,8 +11070,8 @@ var ModalWindow = function ModalWindow(_ref) {
|
|
|
10775
11070
|
})), /*#__PURE__*/React__default.createElement(ContentWrapper$1, null, children))), /*#__PURE__*/React__default.createElement(ScrollLock, null)));
|
|
10776
11071
|
};
|
|
10777
11072
|
|
|
10778
|
-
var _templateObject$
|
|
10779
|
-
var GlobalStyles = /*#__PURE__*/createGlobalStyle(_templateObject$1l || (_templateObject$1l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n html {\n --base-color-primary: ", ";\n --base-color-core: ", ";\n --base-color-stream: ", ";\n --base-color-cinema: ", ";\n --base-color-white: ", ";\n --base-color-black: ", ";\n --base-color-dark-grey: ", ";\n --base-color-mid-grey: ", ";\n --base-color-light-grey: ", ";\n --error-color-state: ", ";\n --medium-color-state: ", ";\n --good-color-state: ", ";\n --base-color-darkgrey: ", ";\n --base-color-midgrey: ", ";\n --base-color-lightgrey: ", ";\n --base-color-transparent: transparent;\n --base-color-errorstate: ", ";\n --base-color-mediumstate: ", ";\n --base-color-goodstate: ", ";\n --base-color-progress: ", ";\n --base-color-navigation: ", ";\n --base-color-lapislazuli: ", ";\n --base-color-lemonchiffon: ", ";\n\n --button-height: ", ";\n --button-line-height: ", ";\n --button-padding-x: ", ";\n --button-padding-y: ", ";\n --button-padding-y-icon: ", ";\n --button-icon-margin: ", ";\n --button-icon-width: ", ";\n --button-icon-height: ", ";\n --button-font-size: ", ";\n --button-font-weight: ", ";\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n --margin-header-1: ", ";\n\n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n --margin-header-2: ", ";\n\n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n --margin-header-3: ", ";\n\n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n --margin-header-4: ", ";\n\n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n --margin-header-5: ", ";\n\n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n --margin-header-6: ", ";\n\n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n\n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n\n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n\n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n\n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n\n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n\n --font-size-overline-3: ", ";\n --font-weight-overline-3: ", ";\n --letter-spacing-overline-3: ", ";\n --line-height-overline-3: ", "; \n\n --font-size-overline-4: ", ";\n --font-weight-overline-4: ", ";\n --letter-spacing-overline-4: ", ";\n --line-height-overline-4: ", ";\n\n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n\n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n\n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n\n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-listing: ", ";\n --font-size-individual-listing-name: ", ";\n --line-height-individual-listing-name: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n\n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n\n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n\n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n\n --font-family-navigation: ", ";\n --font-size-navigation: ", ";\n --font-weight-navigation: ", ";\n --line-height-navigation: ", ";\n --text-transform-navigation: ", ";\n --letter-spacing-navigation: ", ";\n\n --navigation-small-gap: ", ";\n --navigation-middle-gap: ", ";\n --navigation-large-gap: ", ";\n --navigation-xlarge-gap: ", ";\n --navigation-large-margin: ", ";\n\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --grid-margin: ", ";\n --grid-outer-margin: ", ";\n --grid-template-columns: calc(", " - ", ") calc(", " - ", " - ", ") repeat(12, minmax(0,1fr)) calc(", " - ", " - ", ") calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: 0;\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --text-link-underline-offset: ", ";\n\n --cards-spacing-stack: ", ";\n\n --editorial-subtitle-margin-bottom: ", ";\n --editorial-margin-between: ", ";\n --editorial-spacing-hover: ", ";\n --anchor-tabs-height: 70px;\n \n\n @media ", " {\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n \n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n \n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n \n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n \n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n \n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n \n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n \n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n \n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n \n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n \n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n \n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n \n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n \n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n \n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n \n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n \n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n \n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n \n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n \n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --anchor-tabs-height: 60px;\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n }\n\n @media ", " {\n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-header-6: ", ";\n\n --font-size-altHeader-4: ", ";\n\n --font-size-body-1: ", ";\n }\n\n @media ", " {\n \n }\n\n @media ", " {\n \n }\n }\n"])), function (_ref) {
|
|
11073
|
+
var _templateObject$1m;
|
|
11074
|
+
var GlobalStyles = /*#__PURE__*/createGlobalStyle(_templateObject$1m || (_templateObject$1m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n html {\n --base-color-primary: ", ";\n --base-color-core: ", ";\n --base-color-stream: ", ";\n --base-color-cinema: ", ";\n --base-color-white: ", ";\n --base-color-black: ", ";\n --base-color-dark-grey: ", ";\n --base-color-mid-grey: ", ";\n --base-color-light-grey: ", ";\n --error-color-state: ", ";\n --medium-color-state: ", ";\n --good-color-state: ", ";\n --base-color-darkgrey: ", ";\n --base-color-midgrey: ", ";\n --base-color-lightgrey: ", ";\n --base-color-transparent: transparent;\n --base-color-errorstate: ", ";\n --base-color-mediumstate: ", ";\n --base-color-goodstate: ", ";\n --base-color-progress: ", ";\n --base-color-navigation: ", ";\n --base-color-lapislazuli: ", ";\n --base-color-lemonchiffon: ", ";\n\n --button-height: ", ";\n --button-line-height: ", ";\n --button-padding-x: ", ";\n --button-padding-y: ", ";\n --button-padding-y-icon: ", ";\n --button-icon-margin: ", ";\n --button-icon-width: ", ";\n --button-icon-height: ", ";\n --button-font-size: ", ";\n --button-font-weight: ", ";\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n --margin-header-1: ", ";\n\n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n --margin-header-2: ", ";\n\n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n --margin-header-3: ", ";\n\n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n --margin-header-4: ", ";\n\n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n --margin-header-5: ", ";\n\n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n --margin-header-6: ", ";\n\n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n\n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n\n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n\n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n\n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n\n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n\n --font-size-overline-3: ", ";\n --font-weight-overline-3: ", ";\n --letter-spacing-overline-3: ", ";\n --line-height-overline-3: ", "; \n\n --font-size-overline-4: ", ";\n --font-weight-overline-4: ", ";\n --letter-spacing-overline-4: ", ";\n --line-height-overline-4: ", ";\n\n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n\n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n\n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n\n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-listing: ", ";\n --font-size-individual-listing-name: ", ";\n --line-height-individual-listing-name: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n\n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n\n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n\n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n\n --font-family-navigation: ", ";\n --font-size-navigation: ", ";\n --font-weight-navigation: ", ";\n --line-height-navigation: ", ";\n --text-transform-navigation: ", ";\n --letter-spacing-navigation: ", ";\n\n --navigation-small-gap: ", ";\n --navigation-middle-gap: ", ";\n --navigation-large-gap: ", ";\n --navigation-xlarge-gap: ", ";\n --navigation-large-margin: ", ";\n\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --grid-margin: ", ";\n --grid-outer-margin: ", ";\n --grid-template-columns: calc(", " - ", ") calc(", " - ", " - ", ") repeat(12, minmax(0,1fr)) calc(", " - ", " - ", ") calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: 0;\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --text-link-underline-offset: ", ";\n\n --cards-spacing-stack: ", ";\n\n --editorial-subtitle-margin-bottom: ", ";\n --editorial-margin-between: ", ";\n --editorial-spacing-hover: ", ";\n --anchor-tabs-height: 70px;\n \n\n @media ", " {\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n \n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n \n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n \n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n \n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n \n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n \n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n \n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n \n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n \n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n \n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n \n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n \n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n \n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n \n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n \n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n \n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n \n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n \n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n \n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --anchor-tabs-height: 60px;\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n }\n\n @media ", " {\n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-header-6: ", ";\n\n --font-size-altHeader-4: ", ";\n\n --font-size-body-1: ", ";\n }\n\n @media ", " {\n \n }\n\n @media ", " {\n \n }\n }\n"])), function (_ref) {
|
|
10780
11075
|
var theme = _ref.theme;
|
|
10781
11076
|
return theme.colors.primary;
|
|
10782
11077
|
}, function (_ref2) {
|
|
@@ -11717,5 +12012,5 @@ var GlobalStyles = /*#__PURE__*/createGlobalStyle(_templateObject$1l || (_templa
|
|
|
11717
12012
|
return theme.fonts.tablet.sizes.body[1];
|
|
11718
12013
|
}, devices.desktop, devices.largeDesktop);
|
|
11719
12014
|
|
|
11720
|
-
export { Accordion, Accordions, AltHeader, AnchorTabBar, AnnouncementBanner, AspectRatio, AuxiliaryButton, AuxiliaryNav, BodyText, ButtonType, Card, Cards, CarouselType, CinemaBadge, Colors, ContactCard, ContentSummary, ControlledDropdown, CreditListing, Editorial, Footer, GlobalStyles, Grid, GridItem, Header, Icon, ImageAspectRatioWrapper, ImageWithCaption, Information, LiveChat, MiniCard, ModalWindow, Navigation, Overline, PageHeadingCinema, PageHeadingCompact, PageHeadingCore, PageHeadingImpact, PageHeadingPanel, PageHeadingStream, 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, Sponsorship, StatusBanner, Component as Stepper, StickyBar, StreamBadge, Subtitle, Tab, TabLink, Table, Tabs, Button$1 as TertiaryButton, TextArea, TextField, TextLink, TextOnly, Theme as ThemeProvider, ThemeType, Tickbox, Tickbox2, TickboxMode, Timer, TitleWithCTA, TypeTags, UpsellCard, UpsellSection, VideoControls, breakpoints, devices, zIndexes };
|
|
12015
|
+
export { Accordion, Accordions, AltHeader, AnchorTabBar, AnnouncementBanner, AspectRatio, AuxiliaryButton, AuxiliaryNav, BodyText, ButtonType, Card, Cards, CarouselType, CinemaBadge, Colors, ContactCard, ContentSummary, ControlledDropdown, CreditListing, Editorial, Footer, GlobalStyles, Grid, GridItem, GridItemLegacy, Header, Icon, ImageAspectRatioWrapper, ImageWithCaption, Information, LiveChat, MiniCard, ModalWindow, Navigation, Overline, PageHeadingCinema, PageHeadingCompact, PageHeadingCore, PageHeadingImpact, PageHeadingPanel, PageHeadingStream, 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, Sponsorship, StatusBanner, Component as Stepper, StickyBar, StreamBadge, Subtitle, Tab, TabLink, Table, Tabs, Button$1 as TertiaryButton, TextArea, TextField, TextFieldLegacy, TextLink, TextOnly, Theme as ThemeProvider, ThemeType, Tickbox, Tickbox2, TickboxMode, Timer, TitleWithCTA, TypeTags, UpsellCard, UpsellSection, VideoControls, breakpoints, devices, zIndexes };
|
|
11721
12016
|
//# sourceMappingURL=chord.esm.js.map
|