scorer-ui-kit 2.7.0 → 2.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Layouts/atoms/UtilityHeaderBack.d.ts +8 -0
- package/dist/Layouts/atoms/UtilityHeaderShare.d.ts +4 -0
- package/dist/Layouts/index.d.ts +14 -4
- package/dist/index.js +217 -183
- package/dist/index.js.map +1 -1
- package/dist/index.modern.js +217 -183
- package/dist/index.modern.js.map +1 -1
- package/package.json +2 -2
package/dist/index.modern.js
CHANGED
|
@@ -12233,60 +12233,100 @@ var ConfirmationModal = function ConfirmationModal(_ref3) {
|
|
|
12233
12233
|
}, rightButtonText)));
|
|
12234
12234
|
};
|
|
12235
12235
|
|
|
12236
|
-
var _templateObject$1s, _templateObject2$1d
|
|
12237
|
-
var
|
|
12238
|
-
var
|
|
12239
|
-
var
|
|
12240
|
-
var
|
|
12241
|
-
|
|
12242
|
-
|
|
12243
|
-
|
|
12244
|
-
|
|
12245
|
-
|
|
12246
|
-
var
|
|
12247
|
-
var ExtraAction = styled.button(_templateObject7$D || (_templateObject7$D = _taggedTemplateLiteralLoose(["\n position: relative;\n display: flex;\n padding: 0;\n align-items: center;\n gap: 8px;\n color: var(--grey-10);\n text-align: center;\n font-family: var(--font-ui);\n font-size: 12px;\n font-style: normal;\n font-weight: 600;\n line-height: normal;\n border: none;\n background: none;\n text-decoration: none;\n transition: color 0.25s ease;\n cursor: pointer;\n\n ", "{\n svg * {\n transition: stroke 0.25s ease;\n }\n }\n \n &:hover {\n color: var(--grey-12);\n ", "{\n svg * {\n stroke: var(--grey-12);\n }\n }\n }\n\n"])), ExtraActionIcon, ExtraActionIcon);
|
|
12248
|
-
var Breadcrumbs = styled.div(_templateObject8$v || (_templateObject8$v = _taggedTemplateLiteralLoose(["\n display: inline-flex;\n align-items: center;\n gap: 8px;\n"])));
|
|
12249
|
-
var Breadcrumb = styled.div(_templateObject9$n || (_templateObject9$n = _taggedTemplateLiteralLoose(["\n flex: 1;\n display: flex;\n display: inline-flex;\n align-items: center;\n gap: 8px;\n\n"])));
|
|
12250
|
-
var BreadcrumbIcon = styled.div(_templateObject10$g || (_templateObject10$g = _taggedTemplateLiteralLoose(["\n flex: 0;\n display: flex;\n align-items: center;\n\n > div {\n flex: 1;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n"])));
|
|
12251
|
-
var HomeIcon = styled(BreadcrumbIcon)(_templateObject11$b || (_templateObject11$b = _taggedTemplateLiteralLoose(["\n padding-bottom: 1px;\n svg path {\n transition: stroke var(--speed-normal) var(--easing-primary-out);\n }\n"])));
|
|
12252
|
-
var BreadcrumbLink = styled(Link)(_templateObject12$a || (_templateObject12$a = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n gap: 8px;\n flex: 1;\n color: var(--grey-10);\n font-family: var(--font-ui);\n text-decoration: none;\n font-size: 12px;\n font-style: normal;\n font-weight: 500;\n line-height: 12px; /* 100% */\n transition: color var(--speed-normal) var(--easing-primary-out);\n\n &:hover {\n color: var(--grey-12);\n ", " svg {\n path {\n stroke: var(--grey-12);\n }\n }\n }\n"])), HomeIcon);
|
|
12253
|
-
var RightArea = styled.div(_templateObject13$9 || (_templateObject13$9 = _taggedTemplateLiteralLoose(["\n flex: 1;\n align-items: center;\n display: flex;\n justify-content: right;\n"])));
|
|
12254
|
-
var UtilityHeader = function UtilityHeader(_ref2) {
|
|
12255
|
-
var _ref2$showBreadcrumbs = _ref2.showBreadcrumbs,
|
|
12256
|
-
showBreadcrumbs = _ref2$showBreadcrumbs === void 0 ? true : _ref2$showBreadcrumbs,
|
|
12257
|
-
_ref2$breadcrumbs = _ref2.breadcrumbs,
|
|
12258
|
-
breadcrumbs = _ref2$breadcrumbs === void 0 ? [] : _ref2$breadcrumbs,
|
|
12259
|
-
_ref2$showHomeIcon = _ref2.showHomeIcon,
|
|
12260
|
-
showHomeIcon = _ref2$showHomeIcon === void 0 ? true : _ref2$showHomeIcon,
|
|
12261
|
-
backLink = _ref2.backLink,
|
|
12262
|
-
_ref2$$iconInGutter = _ref2.$iconInGutter,
|
|
12263
|
-
$iconInGutter = _ref2$$iconInGutter === void 0 ? true : _ref2$$iconInGutter,
|
|
12264
|
-
_ref2$showShareLink = _ref2.showShareLink,
|
|
12265
|
-
showShareLink = _ref2$showShareLink === void 0 ? false : _ref2$showShareLink,
|
|
12266
|
-
shareLink = _ref2.shareLink;
|
|
12267
|
-
var _useState = useState("Share"),
|
|
12236
|
+
var _templateObject$1s, _templateObject2$1d;
|
|
12237
|
+
var ExtraActionIcon = styled.div(_templateObject$1s || (_templateObject$1s = _taggedTemplateLiteralLoose(["\n display: flex;\n width: 16px;\n height: 16px;\n justify-content: center;\n align-items: center;\n"])));
|
|
12238
|
+
var ExtraAction = styled.button(_templateObject2$1d || (_templateObject2$1d = _taggedTemplateLiteralLoose(["\n position: relative;\n display: flex;\n padding: 0;\n align-items: center;\n gap: 8px;\n color: var(--grey-10);\n text-align: center;\n font-family: var(--font-ui);\n font-size: 12px;\n font-style: normal;\n font-weight: 600;\n line-height: normal;\n border: none;\n background: none;\n text-decoration: none;\n transition: color 0.25s ease;\n cursor: pointer;\n\n ", "{\n svg * {\n transition: stroke 0.25s ease;\n }\n }\n \n &:hover {\n color: var(--grey-12);\n ", "{\n svg * {\n stroke: var(--grey-12);\n }\n }\n }\n\n"])), ExtraActionIcon, ExtraActionIcon);
|
|
12239
|
+
var UtilityHeaderShare = function UtilityHeaderShare(_ref) {
|
|
12240
|
+
var show = _ref.show,
|
|
12241
|
+
link = _ref.link,
|
|
12242
|
+
_ref$label = _ref.label,
|
|
12243
|
+
label = _ref$label === void 0 ? 'Share' : _ref$label,
|
|
12244
|
+
_ref$copiedLabel = _ref.copiedLabel,
|
|
12245
|
+
copiedLabel = _ref$copiedLabel === void 0 ? 'Copied' : _ref$copiedLabel;
|
|
12246
|
+
var _useState = useState(label),
|
|
12268
12247
|
copyActionText = _useState[0],
|
|
12269
12248
|
setCopyActionText = _useState[1];
|
|
12270
12249
|
var _useCopyToClipboard = useCopyToClipboard(),
|
|
12271
12250
|
copyToClipboard = _useCopyToClipboard.copyToClipboard;
|
|
12272
|
-
var hasBreadcrumbs = showBreadcrumbs && breadcrumbs.length > 0;
|
|
12273
12251
|
var clickHandlerShareLink = useCallback(function () {
|
|
12274
|
-
copyToClipboard(
|
|
12275
|
-
setCopyActionText(
|
|
12252
|
+
copyToClipboard(link ? link : window.location.href);
|
|
12253
|
+
setCopyActionText(copiedLabel);
|
|
12276
12254
|
setTimeout(function () {
|
|
12277
|
-
return setCopyActionText(
|
|
12255
|
+
return setCopyActionText(copyActionText);
|
|
12278
12256
|
}, 2000);
|
|
12279
|
-
}, [
|
|
12280
|
-
|
|
12281
|
-
|
|
12282
|
-
|
|
12257
|
+
}, [link, copiedLabel, copyActionText, copyToClipboard]);
|
|
12258
|
+
useEffect(function () {
|
|
12259
|
+
setCopyActionText(label);
|
|
12260
|
+
}, [label]);
|
|
12261
|
+
if (!show) {
|
|
12262
|
+
return null;
|
|
12263
|
+
}
|
|
12264
|
+
return React__default.createElement(ExtraAction, {
|
|
12265
|
+
onClick: clickHandlerShareLink
|
|
12266
|
+
}, React__default.createElement(ExtraActionIcon, null, React__default.createElement(Icon, {
|
|
12267
|
+
icon: "Link",
|
|
12268
|
+
size: 16,
|
|
12269
|
+
color: "grey-10"
|
|
12270
|
+
})), copyActionText);
|
|
12271
|
+
};
|
|
12272
|
+
|
|
12273
|
+
var _templateObject$1t, _templateObject2$1e, _templateObject3$16;
|
|
12274
|
+
var BackLinkIcon = styled.div(_templateObject$1t || (_templateObject$1t = _taggedTemplateLiteralLoose(["\n display: flex;\n width: 16px;\n height: 16px;\n justify-content: center;\n align-items: center;\n flex: 1;\n > div {\n display: flex;\n justify-content: center;\n align-items: center;\n }\n"])));
|
|
12275
|
+
var BackLink = styled(Link)(_templateObject2$1e || (_templateObject2$1e = _taggedTemplateLiteralLoose(["\n position: relative;\n display: flex;\n padding: 0;\n align-items: center;\n gap: 8px;\n color: var(--grey-10);\n text-align: center;\n font-family: var(--font-ui);\n font-size: 12px;\n font-style: normal;\n font-weight: 600;\n line-height: normal;\n border: none;\n background: none;\n text-decoration: none;\n transition: color 0.25s ease;\n margin-left: ", ";\n\n ", "{\n svg * {\n transition: stroke 0.25s ease;\n }\n }\n\n &:hover {\n color: var(--grey-12);\n ", "{\n svg * {\n stroke: var(--grey-12);\n }\n }\n }\n\n ", "\n"])), function (props) {
|
|
12276
|
+
return props.$iconInGutter ? '-24px' : '0';
|
|
12277
|
+
}, BackLinkIcon, BackLinkIcon, function (_ref) {
|
|
12278
|
+
var $showDivider = _ref.$showDivider;
|
|
12279
|
+
return $showDivider && css(_templateObject3$16 || (_templateObject3$16 = _taggedTemplateLiteralLoose(["\n &::after {\n content: '';\n display: inline-block;\n height: 12px;\n width: 1px;\n padding-left: 8px;\n border-right: 1px solid var(--grey-10);\n }\n "])));
|
|
12280
|
+
});
|
|
12281
|
+
var UtilityHeaderBack = function UtilityHeaderBack(_ref2) {
|
|
12282
|
+
var _ref2$show = _ref2.show,
|
|
12283
|
+
show = _ref2$show === void 0 ? true : _ref2$show,
|
|
12284
|
+
link = _ref2.link,
|
|
12285
|
+
_ref2$label = _ref2.label,
|
|
12286
|
+
label = _ref2$label === void 0 ? 'Back' : _ref2$label,
|
|
12287
|
+
$showDivider = _ref2.$showDivider,
|
|
12288
|
+
$iconInGutter = _ref2.$iconInGutter;
|
|
12289
|
+
if (!show) {
|
|
12290
|
+
return null;
|
|
12291
|
+
}
|
|
12292
|
+
return React__default.createElement(BackLink, Object.assign({
|
|
12293
|
+
to: link
|
|
12283
12294
|
}, {
|
|
12295
|
+
$showDivider: $showDivider,
|
|
12284
12296
|
$iconInGutter: $iconInGutter
|
|
12285
12297
|
}), React__default.createElement(BackLinkIcon, null, React__default.createElement(Icon, {
|
|
12286
12298
|
icon: "Back",
|
|
12287
12299
|
size: 16,
|
|
12288
12300
|
color: "grey-10"
|
|
12289
|
-
})),
|
|
12301
|
+
})), label);
|
|
12302
|
+
};
|
|
12303
|
+
|
|
12304
|
+
var _templateObject$1u, _templateObject2$1f, _templateObject3$17, _templateObject4$10, _templateObject5$W, _templateObject6$H, _templateObject7$D, _templateObject8$v;
|
|
12305
|
+
var Container$Y = styled.div(_templateObject$1u || (_templateObject$1u = _taggedTemplateLiteralLoose(["\n max-width: var(--max-content-width);\n margin-top: var(--utility-header-padding-top);\n padding: 0 var(--content-layout-padding-right) 0 var(--content-layout-padding-left);\n height: 48px;\n width: 100%;\n display: flex;\n"])));
|
|
12306
|
+
var LeftArea = styled.div(_templateObject2$1f || (_templateObject2$1f = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n gap: var(--columnPadding, 16px);\n flex: 1 0 0;\n"])));
|
|
12307
|
+
var Breadcrumbs = styled.div(_templateObject3$17 || (_templateObject3$17 = _taggedTemplateLiteralLoose(["\n display: inline-flex;\n align-items: center;\n gap: 8px;\n"])));
|
|
12308
|
+
var Breadcrumb = styled.div(_templateObject4$10 || (_templateObject4$10 = _taggedTemplateLiteralLoose(["\n flex: 1;\n display: flex;\n display: inline-flex;\n align-items: center;\n gap: 8px;\n\n"])));
|
|
12309
|
+
var BreadcrumbIcon = styled.div(_templateObject5$W || (_templateObject5$W = _taggedTemplateLiteralLoose(["\n flex: 0;\n display: flex;\n align-items: center;\n\n > div {\n flex: 1;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n"])));
|
|
12310
|
+
var HomeIcon = styled(BreadcrumbIcon)(_templateObject6$H || (_templateObject6$H = _taggedTemplateLiteralLoose(["\n padding-bottom: 1px;\n svg path {\n transition: stroke var(--speed-normal) var(--easing-primary-out);\n }\n"])));
|
|
12311
|
+
var BreadcrumbLink = styled(Link)(_templateObject7$D || (_templateObject7$D = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n gap: 8px;\n flex: 1;\n color: var(--grey-10);\n font-family: var(--font-ui);\n text-decoration: none;\n font-size: 12px;\n font-style: normal;\n font-weight: 500;\n line-height: 12px; /* 100% */\n transition: color var(--speed-normal) var(--easing-primary-out);\n\n &:hover {\n color: var(--grey-12);\n ", " svg {\n path {\n stroke: var(--grey-12);\n }\n }\n }\n"])), HomeIcon);
|
|
12312
|
+
var RightArea = styled.div(_templateObject8$v || (_templateObject8$v = _taggedTemplateLiteralLoose(["\n flex: 1;\n align-items: center;\n display: flex;\n justify-content: right;\n"])));
|
|
12313
|
+
var UtilityHeader = function UtilityHeader(_ref) {
|
|
12314
|
+
var _ref$showBreadcrumbs = _ref.showBreadcrumbs,
|
|
12315
|
+
showBreadcrumbs = _ref$showBreadcrumbs === void 0 ? true : _ref$showBreadcrumbs,
|
|
12316
|
+
_ref$breadcrumbs = _ref.breadcrumbs,
|
|
12317
|
+
breadcrumbs = _ref$breadcrumbs === void 0 ? [] : _ref$breadcrumbs,
|
|
12318
|
+
_ref$showHomeIcon = _ref.showHomeIcon,
|
|
12319
|
+
showHomeIcon = _ref$showHomeIcon === void 0 ? true : _ref$showHomeIcon,
|
|
12320
|
+
back = _ref.back,
|
|
12321
|
+
share = _ref.share,
|
|
12322
|
+
_ref$$iconInGutter = _ref.$iconInGutter,
|
|
12323
|
+
$iconInGutter = _ref$$iconInGutter === void 0 ? true : _ref$$iconInGutter;
|
|
12324
|
+
var hasBreadcrumbs = showBreadcrumbs && breadcrumbs.length > 0;
|
|
12325
|
+
return React__default.createElement(Container$Y, null, React__default.createElement(LeftArea, null, back && React__default.createElement(UtilityHeaderBack, Object.assign({
|
|
12326
|
+
"$showDivider": hasBreadcrumbs
|
|
12327
|
+
}, {
|
|
12328
|
+
$iconInGutter: $iconInGutter
|
|
12329
|
+
}, back)), hasBreadcrumbs ? React__default.createElement(Breadcrumbs, null, breadcrumbs.map(function (breadcrumb, index) {
|
|
12290
12330
|
var text = breadcrumb.text,
|
|
12291
12331
|
href = breadcrumb.href;
|
|
12292
12332
|
var isFirst = index === 0;
|
|
@@ -12304,13 +12344,7 @@ var UtilityHeader = function UtilityHeader(_ref2) {
|
|
|
12304
12344
|
size: 6,
|
|
12305
12345
|
color: 'grey-8'
|
|
12306
12346
|
})) : null));
|
|
12307
|
-
})) : null), React__default.createElement(RightArea, null,
|
|
12308
|
-
onClick: clickHandlerShareLink
|
|
12309
|
-
}, React__default.createElement(ExtraActionIcon, null, React__default.createElement(Icon, {
|
|
12310
|
-
icon: "Link",
|
|
12311
|
-
size: 16,
|
|
12312
|
-
color: "grey-10"
|
|
12313
|
-
})), copyActionText) : null));
|
|
12347
|
+
})) : null), React__default.createElement(RightArea, null, React__default.createElement(UtilityHeaderShare, Object.assign({}, share))));
|
|
12314
12348
|
};
|
|
12315
12349
|
|
|
12316
12350
|
var TabContext = React__default.createContext({
|
|
@@ -12330,10 +12364,10 @@ var Tabs = function Tabs(_ref) {
|
|
|
12330
12364
|
}, children);
|
|
12331
12365
|
};
|
|
12332
12366
|
|
|
12333
|
-
var _templateObject$
|
|
12334
|
-
var Container$Z = styled.div(_templateObject$
|
|
12335
|
-
var HeaderArea = styled.div(_templateObject2$
|
|
12336
|
-
var TabArea = styled.div(_templateObject3$
|
|
12367
|
+
var _templateObject$1v, _templateObject2$1g, _templateObject3$18, _templateObject4$11, _templateObject5$X;
|
|
12368
|
+
var Container$Z = styled.div(_templateObject$1v || (_templateObject$1v = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n flex-direction: column;\n position: relative;\n\n min-height: 100%;\n display: flex;\n"])));
|
|
12369
|
+
var HeaderArea = styled.div(_templateObject2$1g || (_templateObject2$1g = _taggedTemplateLiteralLoose(["\n width: 100%;\n max-width: var(--max-content-width);\n padding: \n 24px\n var(--content-layout-padding-right)\n 32px\n var(--content-layout-padding-left);\n \n"])));
|
|
12370
|
+
var TabArea = styled.div(_templateObject3$18 || (_templateObject3$18 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n align-items: center;\n width: 100%;\n border-bottom: 1px solid var(--grey-4);\n"])));
|
|
12337
12371
|
var TabAreaInner = styled.div(_templateObject4$11 || (_templateObject4$11 = _taggedTemplateLiteralLoose(["\n max-width: var(--max-content-width);\n flex: 1;\n width: 100%;\n padding: \n 0\n var(--content-layout-padding-right)\n 0\n var(--content-layout-padding-left);\n"])));
|
|
12338
12372
|
var Content = styled.div(_templateObject5$X || (_templateObject5$X = _taggedTemplateLiteralLoose(["\n width: 100%;\n max-width: var(--max-content-width);\n padding: \n var(--content-layout-padding-top)\n var(--content-layout-padding-right)\n var(--content-layout-padding-bottom)\n var(--content-layout-padding-left);\n\n display: flex;\n flex: 1;\n flex-direction: column;\n"])));
|
|
12339
12373
|
var ContentLayout = function ContentLayout(_ref) {
|
|
@@ -12351,12 +12385,12 @@ var ContentLayout = function ContentLayout(_ref) {
|
|
|
12351
12385
|
}, UtilityHeaderOptions ? React__default.createElement(UtilityHeader, Object.assign({}, UtilityHeaderOptions)) : null, PageHeaderArea ? React__default.createElement(HeaderArea, null, PageHeaderArea) : null, TabsElementArea ? React__default.createElement(Tabs, null, React__default.createElement(TabArea, null, React__default.createElement(TabAreaInner, null, TabsElementArea)), React__default.createElement(Content, null, children)) : React__default.createElement(Content, null, children));
|
|
12352
12386
|
};
|
|
12353
12387
|
|
|
12354
|
-
var _templateObject$
|
|
12355
|
-
var FullWidthContainer = styled.div(_templateObject$
|
|
12388
|
+
var _templateObject$1w, _templateObject2$1h;
|
|
12389
|
+
var FullWidthContainer = styled.div(_templateObject$1w || (_templateObject$1w = _taggedTemplateLiteralLoose(["\n min-height: ", ";\n"])), function (_ref) {
|
|
12356
12390
|
var $contentHeight = _ref.$contentHeight;
|
|
12357
12391
|
return $contentHeight + 'px';
|
|
12358
12392
|
});
|
|
12359
|
-
var FullWidthInner = styled.div(_templateObject2$
|
|
12393
|
+
var FullWidthInner = styled.div(_templateObject2$1h || (_templateObject2$1h = _taggedTemplateLiteralLoose(["\n position: absolute;\n left: 0;\n right: 0;\n input {width: 100%;}\n"])));
|
|
12360
12394
|
var FullWidthContentBlock = function FullWidthContentBlock(_ref2) {
|
|
12361
12395
|
var children = _ref2.children;
|
|
12362
12396
|
var innerElement = useRef(null);
|
|
@@ -12375,10 +12409,10 @@ var FullWidthContentBlock = function FullWidthContentBlock(_ref2) {
|
|
|
12375
12409
|
}, children));
|
|
12376
12410
|
};
|
|
12377
12411
|
|
|
12378
|
-
var _templateObject$
|
|
12379
|
-
var Inner$1 = styled.div(_templateObject$
|
|
12380
|
-
var Line = styled.div(_templateObject2$
|
|
12381
|
-
var IconContainer$3 = styled.div(_templateObject3$
|
|
12412
|
+
var _templateObject$1x, _templateObject2$1i, _templateObject3$19, _templateObject4$12, _templateObject5$Y, _templateObject6$I, _templateObject7$E, _templateObject8$w;
|
|
12413
|
+
var Inner$1 = styled.div(_templateObject$1x || (_templateObject$1x = _taggedTemplateLiteralLoose(["\n display: flex;\n flex: 0 0 200px;\n justify-content: center;\n align-items: center;\n gap: 8px;\n"])));
|
|
12414
|
+
var Line = styled.div(_templateObject2$1i || (_templateObject2$1i = _taggedTemplateLiteralLoose(["\n background: var(--grey-10);\n flex: 1;\n"])));
|
|
12415
|
+
var IconContainer$3 = styled.div(_templateObject3$19 || (_templateObject3$19 = _taggedTemplateLiteralLoose(["\n flex: 0 0 20px;\n svg {\n path {\n stroke: var(--grey-11);\n }\n }\n"])));
|
|
12382
12416
|
var IconDefault = styled.svg(_templateObject4$12 || (_templateObject4$12 = _taggedTemplateLiteralLoose(["\n transform: ", ";\n"])), function (_ref) {
|
|
12383
12417
|
var $layout = _ref.$layout;
|
|
12384
12418
|
return $layout === 'horizontal' ? 'rotate(0deg)' : 'rotate(90deg)';
|
|
@@ -12443,12 +12477,12 @@ var ResizeLine = function ResizeLine(_ref4) {
|
|
|
12443
12477
|
}))), React__default.createElement(Line, null)));
|
|
12444
12478
|
};
|
|
12445
12479
|
|
|
12446
|
-
var _templateObject$
|
|
12447
|
-
var DebugData = styled.div(_templateObject$
|
|
12448
|
-
var MainArea = styled.div(_templateObject2$
|
|
12480
|
+
var _templateObject$1y, _templateObject2$1j, _templateObject3$1a, _templateObject4$13, _templateObject5$Z, _templateObject6$J, _templateObject7$F, _templateObject8$x, _templateObject9$n, _templateObject10$g, _templateObject11$b, _templateObject12$a, _templateObject13$9, _templateObject14$8, _templateObject15$6, _templateObject16$5, _templateObject17$5, _templateObject18$3, _templateObject19$3;
|
|
12481
|
+
var DebugData = styled.div(_templateObject$1y || (_templateObject$1y = _taggedTemplateLiteralLoose(["\n position: absolute;\n z-index: 10;\n bottom: 20px;\n left: 20px;\n background: #ededed99;\n border: grey 1px solid;\n padding: 20px;\n line-height: 20px;\n font-size: 12px;\n div {\n display: block;\n }\n span {\n display: inline-block;\n width: 130px;\n font-weight: 600;\n }\n"])));
|
|
12482
|
+
var MainArea = styled.div(_templateObject2$1j || (_templateObject2$1j = _taggedTemplateLiteralLoose(["\n display: flex;\n position: relative;\n flex: 1;\n\n ", "\n"])), function (_ref) {
|
|
12449
12483
|
var $layout = _ref.$layout,
|
|
12450
12484
|
$minDimension = _ref.$minDimension;
|
|
12451
|
-
return $layout === 'vertical' ? css(_templateObject3$
|
|
12485
|
+
return $layout === 'vertical' ? css(_templateObject3$1a || (_templateObject3$1a = _taggedTemplateLiteralLoose(["\n ", ";\n "])), $minDimension ? "min-height: " + $minDimension + "px;" : null) : css(_templateObject4$13 || (_templateObject4$13 = _taggedTemplateLiteralLoose(["\n ", ";\n "])), $minDimension ? "min-width: " + $minDimension + "px;" : null);
|
|
12452
12486
|
});
|
|
12453
12487
|
var SideAreaInner = styled.div(_templateObject5$Z || (_templateObject5$Z = _taggedTemplateLiteralLoose(["\n display: flex;\n flex: 1;\n height: 100%;\n transition: opacity 0.2s cubic-bezier(0.85, 0, 0.15, 1);\n"])));
|
|
12454
12488
|
var SideArea = styled.div(_templateObject6$J || (_templateObject6$J = _taggedTemplateLiteralLoose(["\n display: flex;\n position: relative;\n flex: 0 0 ", "px;\n display: ", ";\n transition: \n min-width 0.65s cubic-bezier(0, 0.55, 0.45, 1),\n min-height 0.65s cubic-bezier(0, 0.55, 0.45, 1);\n \n ", "\n\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n"])), function (_ref2) {
|
|
@@ -12466,22 +12500,22 @@ var SideArea = styled.div(_templateObject6$J || (_templateObject6$J = _taggedTem
|
|
|
12466
12500
|
var $layout = _ref5.$layout,
|
|
12467
12501
|
$collapseState = _ref5.$collapseState,
|
|
12468
12502
|
$minDimension = _ref5.$minDimension;
|
|
12469
|
-
return $collapseState === 'collapsing' ? css(_templateObject9$
|
|
12503
|
+
return $collapseState === 'collapsing' ? css(_templateObject9$n || (_templateObject9$n = _taggedTemplateLiteralLoose(["\n transition: none;\n ", ";\n ", "{\n flex: 0 0 ", "px;\n min-width: ", "px;\n opacity: 0.5;\n }\n "])), $layout === 'horizontal' ? 'min-width: 0' : 'min-height: 0', SideAreaInner, $minDimension, $minDimension) : null;
|
|
12470
12504
|
}, function (_ref6) {
|
|
12471
12505
|
var $collapseState = _ref6.$collapseState;
|
|
12472
|
-
return $collapseState === 'collapsed' ? css(_templateObject10$
|
|
12506
|
+
return $collapseState === 'collapsed' ? css(_templateObject10$g || (_templateObject10$g = _taggedTemplateLiteralLoose(["\n ", "{\n display: none;\n }\n "])), SideAreaInner) : null;
|
|
12473
12507
|
}, function (_ref7) {
|
|
12474
12508
|
var $layout = _ref7.$layout,
|
|
12475
12509
|
$collapseState = _ref7.$collapseState,
|
|
12476
12510
|
$minDimension = _ref7.$minDimension;
|
|
12477
|
-
return $collapseState === 'peeking' ? css(_templateObject11$
|
|
12511
|
+
return $collapseState === 'peeking' ? css(_templateObject11$b || (_templateObject11$b = _taggedTemplateLiteralLoose(["\n ", ";\n ", "{\n min-width: ", "px;\n opacity: 0.5;\n }\n "])), $layout === 'horizontal' ? 'min-width: 0' : 'min-height: 0', SideAreaInner, $minDimension) : null;
|
|
12478
12512
|
}, function (_ref8) {
|
|
12479
12513
|
var $layout = _ref8.$layout,
|
|
12480
12514
|
$collapseState = _ref8.$collapseState,
|
|
12481
12515
|
$minDimension = _ref8.$minDimension;
|
|
12482
|
-
return $collapseState === 'opening' ? css(_templateObject12$
|
|
12516
|
+
return $collapseState === 'opening' ? css(_templateObject12$a || (_templateObject12$a = _taggedTemplateLiteralLoose(["\n ", ";\n\n ", "{\n min-width: ", "px;\n }\n "])), $layout === 'horizontal' ? 'min-width: 0' : 'min-height: 0', SideAreaInner, $minDimension) : null;
|
|
12483
12517
|
});
|
|
12484
|
-
var DragContainer = styled.div(_templateObject13$
|
|
12518
|
+
var DragContainer = styled.div(_templateObject13$9 || (_templateObject13$9 = _taggedTemplateLiteralLoose(["\n flex: 0 0 ", "px;\n display: flex;\n justify-content: center;\n align-items: center;\n cursor: col-resize;\n \n > div {\n transition: opacity 0.15s cubic-bezier(0.45, 0, 0.55, 1);\n }\n\n &:hover > div {\n opacity: 1;\n }\n\n ", "\n\n"])), function (_ref9) {
|
|
12485
12519
|
var $size = _ref9.$size;
|
|
12486
12520
|
return $size;
|
|
12487
12521
|
}, function (_ref10) {
|
|
@@ -12781,12 +12815,12 @@ var clampInt = function clampInt(value, lower, upper) {
|
|
|
12781
12815
|
return clampedInt;
|
|
12782
12816
|
};
|
|
12783
12817
|
|
|
12784
|
-
var _templateObject$
|
|
12818
|
+
var _templateObject$1z, _templateObject2$1k, _templateObject3$1b, _templateObject4$14, _templateObject5$_, _templateObject6$K, _templateObject7$G;
|
|
12785
12819
|
var MOBILE_CLOSE_HEIGHT = 50;
|
|
12786
12820
|
var MOBILE_NAVBAR_HEIGHT = 68;
|
|
12787
|
-
var Layout = styled.div(_templateObject$
|
|
12788
|
-
var MobileLayout = styled.div(_templateObject2$
|
|
12789
|
-
var Content$1 = styled.div(_templateObject3$
|
|
12821
|
+
var Layout = styled.div(_templateObject$1z || (_templateObject$1z = _taggedTemplateLiteralLoose(["\n display: flex;\n"])));
|
|
12822
|
+
var MobileLayout = styled.div(_templateObject2$1k || (_templateObject2$1k = _taggedTemplateLiteralLoose([""])));
|
|
12823
|
+
var Content$1 = styled.div(_templateObject3$1b || (_templateObject3$1b = _taggedTemplateLiteralLoose(["\n padding: 0;\n flex: 1;\n overflow: auto;\n\n & > div {\n max-width: 1400px;\n }\n\n ", "\n"])), function (_ref) {
|
|
12790
12824
|
var maxWidth = _ref.maxWidth;
|
|
12791
12825
|
return maxWidth && css(_templateObject4$14 || (_templateObject4$14 = _taggedTemplateLiteralLoose(["\n & > div {\n max-width: ", ";\n }\n "])), maxWidth);
|
|
12792
12826
|
});
|
|
@@ -12798,28 +12832,28 @@ var ContentArea = styled.div(_templateObject6$K || (_templateObject6$K = _tagged
|
|
|
12798
12832
|
return legacyLayout && css(_templateObject7$G || (_templateObject7$G = _taggedTemplateLiteralLoose(["\n padding: ", ";\n\n @media ", " {\n padding: ", ";\n }\n\n @media ", " {\n max-width: ", ";\n padding: ", ";\n }\n "])), paddingOverride ? paddingOverride : '40px 20px', deviceMediaQuery.medium, paddingOverride ? paddingOverride : '40px', deviceMediaQuery.large, maxWidth ? maxWidth : "1200px", paddingOverride ? paddingOverride : '70px 90px');
|
|
12799
12833
|
});
|
|
12800
12834
|
|
|
12801
|
-
var _templateObject$
|
|
12802
|
-
var ContextTitle = styled.div(_templateObject$
|
|
12835
|
+
var _templateObject$1A, _templateObject2$1l, _templateObject3$1c, _templateObject4$15, _templateObject5$$, _templateObject6$L, _templateObject7$H, _templateObject8$y, _templateObject9$o, _templateObject10$h, _templateObject11$c, _templateObject12$b, _templateObject13$a, _templateObject14$9, _templateObject15$7;
|
|
12836
|
+
var ContextTitle = styled.div(_templateObject$1A || (_templateObject$1A = _taggedTemplateLiteralLoose(["\n opacity: 0;\n transition: opacity var(--speed-fast) var(--easing-primary-in-out);\n\n ", "\n"])), function (_ref) {
|
|
12803
12837
|
var compact = _ref.compact;
|
|
12804
|
-
return compact && css(_templateObject2$
|
|
12838
|
+
return compact && css(_templateObject2$1l || (_templateObject2$1l = _taggedTemplateLiteralLoose(["\n font-size:14px;\n "])));
|
|
12805
12839
|
});
|
|
12806
|
-
var ContextIcon$1 = styled.div(_templateObject3$
|
|
12840
|
+
var ContextIcon$1 = styled.div(_templateObject3$1c || (_templateObject3$1c = _taggedTemplateLiteralLoose(["\n background-color: var(--global-menu-icon-background-default);\n transition: background-color var(--speed-fast) var(--easing-primary-out);\n \n flex: 0 0 40px;\n width: 40px;\n height: 40px;\n margin: 0 20px;\n\n border-radius: 7px;\n display:flex;\n justify-content:center;\n align-items:center;\n\n svg {\n display: block;\n }\n"])));
|
|
12807
12841
|
var ContextIndicator = styled.div(_templateObject4$15 || (_templateObject4$15 = _taggedTemplateLiteralLoose(["\n width: 12px;\n height: 12px;\n flex: 0 0 14px;\n margin: 0 20px 0 auto;\n display: flex;\n justify-content: center;\n align-items: center;\n \n opacity: 0;\n transition: opacity 0 var(--easing-primary-out);\n\n svg {\n display: block;\n height: 12px;\n width: 12px;\n }\n"])));
|
|
12808
12842
|
var ContextActionBaseCSS$1 = css(_templateObject5$$ || (_templateObject5$$ = _taggedTemplateLiteralLoose(["\n -webkit-tap-highlight-color: transparent;\n border: none;\n background: none;\n display: flex;\n justify-content:left;\n align-items:center;\n flex-wrap: wrap;\n cursor: pointer;\n width: 100%;\n outline: none;\n padding: 0;\n text-decoration: none;\n font-family: var(--font-ui);\n font-weight: 500;\n font-size: 16px;\n color: var(--grey-11);\n\n &:hover{\n color: var(--grey-12);\n }\n"])));
|
|
12809
12843
|
var StyledAnchor = styled.a(_templateObject6$L || (_templateObject6$L = _taggedTemplateLiteralLoose(["\n display: flex;\n text-decoration: none;\n"])));
|
|
12810
12844
|
var ExternalIconWrapper = styled.div(_templateObject7$H || (_templateObject7$H = _taggedTemplateLiteralLoose(["\n margin-left: 15px;\n"])));
|
|
12811
12845
|
var ContextWrapper = styled.div(_templateObject8$y || (_templateObject8$y = _taggedTemplateLiteralLoose(["\n ", "\n\n ", "\n\n &:hover ", "{\n opacity: 1;\n background-color: var(--global-menu-icon-background-hover);\n\n ", "{\n [stroke]{\n stroke: var(--inverse);\n }\n }\n }\n"])), ContextActionBaseCSS$1, function (_ref2) {
|
|
12812
12846
|
var $menuOpen = _ref2.$menuOpen;
|
|
12813
|
-
return $menuOpen && css(_templateObject9$
|
|
12847
|
+
return $menuOpen && css(_templateObject9$o || (_templateObject9$o = _taggedTemplateLiteralLoose(["\n ", "{\n opacity: 1;\n }\n"])), ContextTitle);
|
|
12814
12848
|
}, ContextIcon$1, IconWrapper);
|
|
12815
|
-
var ContextActionA = styled(Link)(_templateObject10$
|
|
12849
|
+
var ContextActionA = styled(Link)(_templateObject10$h || (_templateObject10$h = _taggedTemplateLiteralLoose(["\n ", "\n\n ", "\n\n &:hover ", "{\n opacity: 1;\n background-color: var(--global-menu-icon-background-hover);\n\n ", "{\n [stroke]{\n stroke: var(--inverse);\n }\n }\n }\n\n ", "\n"])), ContextActionBaseCSS$1, function (_ref3) {
|
|
12816
12850
|
var $menuOpen = _ref3.$menuOpen;
|
|
12817
|
-
return $menuOpen && css(_templateObject11$
|
|
12851
|
+
return $menuOpen && css(_templateObject11$c || (_templateObject11$c = _taggedTemplateLiteralLoose(["\n ", "{\n opacity: 1;\n }\n "])), ContextTitle);
|
|
12818
12852
|
}, ContextIcon$1, IconWrapper, function (_ref4) {
|
|
12819
12853
|
var $isActive = _ref4.$isActive;
|
|
12820
|
-
return $isActive && css(_templateObject12$
|
|
12854
|
+
return $isActive && css(_templateObject12$b || (_templateObject12$b = _taggedTemplateLiteralLoose(["\n color: var(--grey-12);\n\n ", ",\n &:hover ", "{\n background-color: var(--global-menu-icon-background-active);\n }\n "])), ContextIcon$1, ContextIcon$1);
|
|
12821
12855
|
});
|
|
12822
|
-
var ContextActionButton$1 = styled.button(_templateObject13$
|
|
12856
|
+
var ContextActionButton$1 = styled.button(_templateObject13$a || (_templateObject13$a = _taggedTemplateLiteralLoose(["\n ", "\n\n ", "\n\n &:hover ", "{\n opacity: 1;\n background-color: var(--global-menu-icon-background-hover);\n\n ", "{\n [stroke]{\n stroke: var(--inverse);\n }\n }\n }\n\n ", "\n"])), ContextActionBaseCSS$1, function (_ref5) {
|
|
12823
12857
|
var menuOpen = _ref5.menuOpen;
|
|
12824
12858
|
return menuOpen && css(_templateObject14$9 || (_templateObject14$9 = _taggedTemplateLiteralLoose(["\n ", "{\n opacity: 1;\n }\n\n ", "{\n opacity: 1;\n transition: opacity var(--speed-normal) var(--easing-primary-in-out) var(--speed-fast);\n }\n "])), ContextTitle, ContextIndicator);
|
|
12825
12859
|
}, ContextIcon$1, IconWrapper, function (_ref6) {
|
|
@@ -12997,25 +13031,25 @@ var useMenu = function useMenu(defaultMenuOpen, canAlwaysPin) {
|
|
|
12997
13031
|
};
|
|
12998
13032
|
};
|
|
12999
13033
|
|
|
13000
|
-
var _templateObject$
|
|
13001
|
-
var Submenu = styled.ul(_templateObject$
|
|
13002
|
-
var SubmenuHeader = styled.div(_templateObject2$
|
|
13003
|
-
var SubmenuContainerInner = styled.div(_templateObject3$
|
|
13034
|
+
var _templateObject$1B, _templateObject2$1m, _templateObject3$1d, _templateObject4$16, _templateObject5$10, _templateObject6$M, _templateObject7$I, _templateObject8$z, _templateObject9$p, _templateObject10$i, _templateObject11$d, _templateObject12$c, _templateObject13$b;
|
|
13035
|
+
var Submenu = styled.ul(_templateObject$1B || (_templateObject$1B = _taggedTemplateLiteralLoose(["\n display: block;\n position: relative;\n margin-left: 40px;\n padding: 0;\n\n"])));
|
|
13036
|
+
var SubmenuHeader = styled.div(_templateObject2$1m || (_templateObject2$1m = _taggedTemplateLiteralLoose(["\n display: block;\n height: 40px;\n margin-left: 40px;\n"])));
|
|
13037
|
+
var SubmenuContainerInner = styled.div(_templateObject3$1d || (_templateObject3$1d = _taggedTemplateLiteralLoose(["\n overflow: hidden;\n"])));
|
|
13004
13038
|
var SubmenuItemTitle = styled.span(_templateObject4$16 || (_templateObject4$16 = _taggedTemplateLiteralLoose(["\n display: block;\n font-family: var(--font-ui);\n font-size: 14px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.35px;\n color: var(--grey-11);\n"])));
|
|
13005
13039
|
var SubmenuItemLink = styled(Link)(_templateObject5$10 || (_templateObject5$10 = _taggedTemplateLiteralLoose(["\n ", ";\n display: block;\n"])), resetButtonStyles);
|
|
13006
13040
|
var ExternalIconWrapper$1 = styled.div(_templateObject6$M || (_templateObject6$M = _taggedTemplateLiteralLoose(["\n margin-left: 15px;\n"])));
|
|
13007
13041
|
var SubmenuItemAnchor = styled.a(_templateObject7$I || (_templateObject7$I = _taggedTemplateLiteralLoose(["\n ", ";\n display: flex;\n align-items: center;\n"])), resetButtonStyles);
|
|
13008
13042
|
var SubmenuItem = styled.li(_templateObject8$z || (_templateObject8$z = _taggedTemplateLiteralLoose(["\n display: block;\n height: 30px;\n padding-left: 40px;\n position: relative;\n\n &::after {\n display: block;\n content: '';\n height: 1px;\n width: 14px;\n position: absolute;\n left: 0;\n top: 10px;\n background: var(--dividing-line);\n }\n\n ", ", ", "{\n font-family: var(--font-ui);\n font-size: 14px;\n font-weight: 400;\n text-decoration: none;\n color: var(--grey-11);\n\n ", ";\n\n }\n"])), SubmenuItemLink, SubmenuItemAnchor, function (_ref) {
|
|
13009
13043
|
var isActive = _ref.isActive;
|
|
13010
|
-
return css(_templateObject9$
|
|
13044
|
+
return css(_templateObject9$p || (_templateObject9$p = _taggedTemplateLiteralLoose(["\n \n &:hover {\n color: var(--grey-12);\n }\n\n ", "\n\n "])), isActive && css(_templateObject10$i || (_templateObject10$i = _taggedTemplateLiteralLoose(["\n &, &:hover {\n color: var(--grey-11);\n font-weight: 600;\n }\n "]))));
|
|
13011
13045
|
});
|
|
13012
|
-
var SubmenuContainer = styled.div(_templateObject11$
|
|
13013
|
-
var ContextContainer = styled.div(_templateObject12$
|
|
13046
|
+
var SubmenuContainer = styled.div(_templateObject11$d || (_templateObject11$d = _taggedTemplateLiteralLoose(["\n position: relative;\n overflow: hidden;\n\n transition:\n grid-template-rows var(--speed-normal) var(--easing-primary-in-out),\n opacity var(--speed-fast) var(--easing-primary-in-out);\n\n &::after {\n display: block;\n content: '';\n width: 1px;\n position: absolute;\n left: 40px;\n top: 0;\n bottom: 35px;\n background: var(--dividing-line);\n }\n\n"])));
|
|
13047
|
+
var ContextContainer = styled.div(_templateObject12$c || (_templateObject12$c = _taggedTemplateLiteralLoose(["\n min-height: ", ";\n width: inherit;\n\n ", "{\n display: grid;\n grid-template-rows: 0fr;\n };\n\n ", ";\n"])), function (_ref2) {
|
|
13014
13048
|
var mobileMenu = _ref2.mobileMenu;
|
|
13015
13049
|
return mobileMenu ? '30px' : '70px';
|
|
13016
13050
|
}, SubmenuContainer, function (_ref3) {
|
|
13017
13051
|
var open = _ref3.open;
|
|
13018
|
-
return open && css(_templateObject13$
|
|
13052
|
+
return open && css(_templateObject13$b || (_templateObject13$b = _taggedTemplateLiteralLoose(["\n ", "{\n grid-template-rows: 1fr;\n \n transition:\n grid-template-rows var(--speed-normal) var(--easing-primary-in-out),\n opacity var(--speed-fast) var(--easing-primary-in-out);\n \n opacity: 1;\n }\n "])), SubmenuContainer);
|
|
13019
13053
|
});
|
|
13020
13054
|
var NavigationItem = function NavigationItem(_ref4) {
|
|
13021
13055
|
var item = _ref4.item,
|
|
@@ -13106,23 +13140,23 @@ var generateSubmenus = function generateSubmenus(submenu, onClickCallback) {
|
|
|
13106
13140
|
return output;
|
|
13107
13141
|
};
|
|
13108
13142
|
|
|
13109
|
-
var _templateObject$
|
|
13110
|
-
var Logo = styled(Link)(_templateObject$
|
|
13111
|
-
var LogoMark = styled.div(_templateObject2$
|
|
13112
|
-
var LogoType = styled.div(_templateObject3$
|
|
13143
|
+
var _templateObject$1C, _templateObject2$1n, _templateObject3$1e, _templateObject4$17, _templateObject5$11, _templateObject6$N, _templateObject7$J, _templateObject8$A, _templateObject9$q, _templateObject10$j, _templateObject11$e, _templateObject12$d, _templateObject13$c, _templateObject14$a;
|
|
13144
|
+
var Logo = styled(Link)(_templateObject$1C || (_templateObject$1C = _taggedTemplateLiteralLoose(["\n height: 50px;\n margin: 0 20px 55px 15px;\n display: flex;\n\n object {\n pointer-events: none;\n }\n"])));
|
|
13145
|
+
var LogoMark = styled.div(_templateObject2$1n || (_templateObject2$1n = _taggedTemplateLiteralLoose(["\n height: 50px;\n flex: 0 0 50px;\n margin-right: 15px;\n display: flex;\n justify-content: center;\n align-items: center;\n\n"])));
|
|
13146
|
+
var LogoType = styled.div(_templateObject3$1e || (_templateObject3$1e = _taggedTemplateLiteralLoose(["\n opacity: 0;\n flex: 1;\n height: 50px;\n display: flex;\n justify-content: left;\n align-items: center;\n"])));
|
|
13113
13147
|
var SVGObject = styled.object(_templateObject4$17 || (_templateObject4$17 = _taggedTemplateLiteralLoose([""])));
|
|
13114
13148
|
var SVGObjectText = styled.object(_templateObject5$11 || (_templateObject5$11 = _taggedTemplateLiteralLoose(["\n max-width: 180px;\n"])));
|
|
13115
13149
|
var NavigationContainer = styled.div(_templateObject6$N || (_templateObject6$N = _taggedTemplateLiteralLoose([""])));
|
|
13116
13150
|
var MenuFooter = styled.div(_templateObject7$J || (_templateObject7$J = _taggedTemplateLiteralLoose(["\n background: var(--global-element-background);\n display: flex;\n flex-direction: column;\n flex: 1;\n justify-content: flex-end;\n"])));
|
|
13117
13151
|
var FooterItemContainer = styled.div(_templateObject8$A || (_templateObject8$A = _taggedTemplateLiteralLoose(["\n min-height: 70px;\n"])));
|
|
13118
|
-
var PushContainer = styled.div(_templateObject9$
|
|
13152
|
+
var PushContainer = styled.div(_templateObject9$q || (_templateObject9$q = _taggedTemplateLiteralLoose(["\n position: relative;\n height: 100%;\n ", ";\n"])), function (_ref) {
|
|
13119
13153
|
var isPinned = _ref.isPinned;
|
|
13120
|
-
return css(_templateObject10$
|
|
13154
|
+
return css(_templateObject10$j || (_templateObject10$j = _taggedTemplateLiteralLoose(["\n width: ", ";\n "])), isPinned ? "var(--global-menu-width-open)" : "var(--global-menu-width-closed)");
|
|
13121
13155
|
});
|
|
13122
|
-
var Container$10 = styled.div(_templateObject11$
|
|
13156
|
+
var Container$10 = styled.div(_templateObject11$e || (_templateObject11$e = _taggedTemplateLiteralLoose(["\n z-index: 99;\n position: fixed;\n top: 0;\n left: 0;\n ", "\n\n box-sizing: border-box;\n height: 100%;\n padding: 20px 0 0 0;\n overflow: hidden;\n"])), function (_ref2) {
|
|
13123
13157
|
var open = _ref2.open,
|
|
13124
13158
|
desktopSize = _ref2.desktopSize;
|
|
13125
|
-
return css(_templateObject12$
|
|
13159
|
+
return css(_templateObject12$d || (_templateObject12$d = _taggedTemplateLiteralLoose(["\n background-color: var(--global-element-background);\n box-shadow: 0px 0px 7px 0px var(--primary-a2);\n width: ", ";\n border-right: 1px solid var(--dividing-line);\n\n ", ";\n\n ", "{\n transition: opacity var(--speed-normal) var(--easing-primary-in-out);\n opacity: ", ";\n }\n "])), open ? "var(--global-menu-width-open)" : "var(--global-menu-width-closed)", desktopSize === 'xxlarge' ? "" : css(_templateObject13$c || (_templateObject13$c = _taggedTemplateLiteralLoose(["\n transition: width var(--speed-normal) var(--easing-primary-in);\n "]))), LogoType, open ? 1 : 0);
|
|
13126
13160
|
});
|
|
13127
13161
|
var ContainerInner = styled.div(_templateObject14$a || (_templateObject14$a = _taggedTemplateLiteralLoose(["\n width: var(--global-menu-width-open);\n display: flex;\n flex-direction: column;\n height: 100%;\n"])));
|
|
13128
13162
|
var MainMenu = function MainMenu(_ref3) {
|
|
@@ -13222,17 +13256,17 @@ var MainMenu = function MainMenu(_ref3) {
|
|
|
13222
13256
|
})) : null))), document.body));
|
|
13223
13257
|
};
|
|
13224
13258
|
|
|
13225
|
-
var _templateObject$
|
|
13226
|
-
var MetaConatiner = styled.div(_templateObject$
|
|
13227
|
-
var LabelTitle = styled.div(_templateObject2$
|
|
13228
|
-
var LabelContent = styled.div(_templateObject3$
|
|
13259
|
+
var _templateObject$1D, _templateObject2$1o, _templateObject3$1f, _templateObject4$18, _templateObject5$12, _templateObject6$O, _templateObject7$K, _templateObject8$B, _templateObject9$r, _templateObject10$k;
|
|
13260
|
+
var MetaConatiner = styled.div(_templateObject$1D || (_templateObject$1D = _taggedTemplateLiteralLoose(["\n margin: 10px 10px;\n border: 1px solid var(--grey-3);\n background-color: var(--grey-a2);\n border-radius: 5px;\n &:active {\n box-shadow: 4px 4px var(--grey-a2);\n }\n"])));
|
|
13261
|
+
var LabelTitle = styled.div(_templateObject2$1o || (_templateObject2$1o = _taggedTemplateLiteralLoose(["\n max-width: 130px;\n overflow-wrap: initial;\n white-space: break-spaces;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n opacity: 0.76;\n font-size: 10px;\n font-weight: 500;\n letter-spacing: 0.29px;\n color: var(--grey-11);\n font-family: var(--font-ui);\n margin-top: 2px;\n"])));
|
|
13262
|
+
var LabelContent = styled.div(_templateObject3$1f || (_templateObject3$1f = _taggedTemplateLiteralLoose(["\n font-size: 10px;\n padding-left: 10px;\n max-width: 200px;\n overflow-wrap: initial;\n white-space: break-spaces;\n overflow: hidden;\n text-overflow: ellipsis;\n margin: 4px 0 5px 0;\n white-space: nowrap;\n font-weight: 500;\n letter-spacing: 0.29px;\n color: var(--grey-8);\n"])));
|
|
13229
13263
|
var LabelNotes = styled.div(_templateObject4$18 || (_templateObject4$18 = _taggedTemplateLiteralLoose(["\n padding-left: 10px;\n max-width: 200px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n margin: 5px 0 8px 0;\n max-height: 23px;\n font-size: 10px;\n font-weight: 500;\n letter-spacing: 0.29px;\n color: var(--grey-8);\n font-family: var(--font-data);\n"])));
|
|
13230
13264
|
var TitleContainer = styled.div(_templateObject5$12 || (_templateObject5$12 = _taggedTemplateLiteralLoose(["\n display: flex;\n gap:6px;\n flex-direction: row;\n align-items: center;\n margin-left: 10px;\n margin: 3px 0 5px 10px;\n"])));
|
|
13231
13265
|
var Container$11 = styled.div(_templateObject6$O || (_templateObject6$O = _taggedTemplateLiteralLoose(["\n cursor: pointer;\n"])));
|
|
13232
13266
|
var TitleBox = styled.div(_templateObject7$K || (_templateObject7$K = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n"])));
|
|
13233
13267
|
var IconBox = styled.div(_templateObject8$B || (_templateObject8$B = _taggedTemplateLiteralLoose(["\n padding: 1px 5px 0 0;\n opacity: 0;\n ", ":hover & {\n opacity: 1;\n cursor: pointer;\n }\n"])), Container$11);
|
|
13234
|
-
var CopyTextBox = styled.pre(_templateObject9$
|
|
13235
|
-
var CopyBox = styled.div(_templateObject10$
|
|
13268
|
+
var CopyTextBox = styled.pre(_templateObject9$r || (_templateObject9$r = _taggedTemplateLiteralLoose(["\n padding: 5px;\n font-size: 10px;\n line-height: 1.2;\n box-shadow: 2px 2px 4px (195deg 16% 72% / 72%);\n border: 1px solid var(--grey-8);\n background-color: var(--grey-2);\n border-radius: 5px;\n opacity: 0.76;\n font-weight: 500;\n color: var(--grey-11);\n position: absolute;\n max-width: 170px;\n white-space: pre-wrap;\n font-family: var(--font-data);\n right:10px;\n margin-top: -23px;\n"])));
|
|
13269
|
+
var CopyBox = styled.div(_templateObject10$k || (_templateObject10$k = _taggedTemplateLiteralLoose(["\n"])));
|
|
13236
13270
|
var UserDrawerMeta = function UserDrawerMeta(_ref) {
|
|
13237
13271
|
var item = _ref.item,
|
|
13238
13272
|
onUserDrawerMetaClick = _ref.onUserDrawerMetaClick,
|
|
@@ -13295,10 +13329,10 @@ var UserDrawerMeta = function UserDrawerMeta(_ref) {
|
|
|
13295
13329
|
}, notes) : null)));
|
|
13296
13330
|
};
|
|
13297
13331
|
|
|
13298
|
-
var _templateObject$
|
|
13299
|
-
var Container$12 = styled.div(_templateObject$
|
|
13300
|
-
var ColumnContainer = styled.div(_templateObject2$
|
|
13301
|
-
var Title$8 = styled.div(_templateObject3$
|
|
13332
|
+
var _templateObject$1E, _templateObject2$1p, _templateObject3$1g, _templateObject4$19;
|
|
13333
|
+
var Container$12 = styled.div(_templateObject$1E || (_templateObject$1E = _taggedTemplateLiteralLoose(["\n padding: 16px 10px 14px 23px;\n display: flex;\n flex-direction: row;\n border-top: 1px solid var(--dividing-line);\n align-items: center;\n cursor: pointer;\n svg {\n margin-top: 7px;\n }\n"])));
|
|
13334
|
+
var ColumnContainer = styled.div(_templateObject2$1p || (_templateObject2$1p = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n padding-left: 14px;\n align-items: flex-start;\n"])));
|
|
13335
|
+
var Title$8 = styled.div(_templateObject3$1g || (_templateObject3$1g = _taggedTemplateLiteralLoose(["\n opacity: 0.76;\n font-family: var(--font-ui);\n font-size: 12px;\n font-weight: 500;\n letter-spacing: 0.34px;\n color: var(--grey-11);\n"])));
|
|
13302
13336
|
var SubTitle$1 = styled.div(_templateObject4$19 || (_templateObject4$19 = _taggedTemplateLiteralLoose(["\n font-family: var(--font-ui);\n font-size: 10px;\n font-weight: 500;\n letter-spacing: 0.29px;\n color: var(--grey-11);\n padding-top: 2px;\n opacity: 0.5;\n"])));
|
|
13303
13337
|
var DrawerBottomMenu = function DrawerBottomMenu(_ref) {
|
|
13304
13338
|
var _ref$icon = _ref.icon,
|
|
@@ -13316,25 +13350,25 @@ var DrawerBottomMenu = function DrawerBottomMenu(_ref) {
|
|
|
13316
13350
|
}), React__default.createElement(ColumnContainer, null, React__default.createElement(Title$8, null, title), React__default.createElement(SubTitle$1, null, subTitle)));
|
|
13317
13351
|
};
|
|
13318
13352
|
|
|
13319
|
-
var _templateObject$
|
|
13320
|
-
var DrawerTop = styled.div(_templateObject$
|
|
13321
|
-
var DrawerBottom = styled.div(_templateObject2$
|
|
13322
|
-
var DrawerHeader = styled.h2(_templateObject3$
|
|
13353
|
+
var _templateObject$1F, _templateObject2$1q, _templateObject3$1h, _templateObject4$1a, _templateObject5$13, _templateObject6$P, _templateObject7$L, _templateObject8$C, _templateObject9$s, _templateObject10$l, _templateObject11$f, _templateObject12$e, _templateObject13$d, _templateObject14$b;
|
|
13354
|
+
var DrawerTop = styled.div(_templateObject$1F || (_templateObject$1F = _taggedTemplateLiteralLoose([""])));
|
|
13355
|
+
var DrawerBottom = styled.div(_templateObject2$1q || (_templateObject2$1q = _taggedTemplateLiteralLoose(["\n width: 100%;\n position: fixed;\n bottom: 50px;\n @media ", " {\n position: static;\n bottom: 0;\n }\n"])), deviceMediaQuery.medium);
|
|
13356
|
+
var DrawerHeader = styled.h2(_templateObject3$1h || (_templateObject3$1h = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.35px;\n color: var(--grey-11);\n padding: 0;\n margin: 0 0 5px;\n"])));
|
|
13323
13357
|
var CurrentUser = styled.div(_templateObject4$1a || (_templateObject4$1a = _taggedTemplateLiteralLoose(["\n padding: 20px 20px 15px;\n border-bottom: var(--dividing-line) 1px solid;\n font-size: 12px;\n font-weight: 400;\n color: var(--grey-11);\n"])));
|
|
13324
13358
|
var UserOptions = styled.div(_templateObject5$13 || (_templateObject5$13 = _taggedTemplateLiteralLoose(["\n padding: 20px 20px 10px 20px;\n border-bottom: var(--dividing-line) 1px solid;\n"])));
|
|
13325
13359
|
var Logout = styled.div(_templateObject6$P || (_templateObject6$P = _taggedTemplateLiteralLoose(["\n padding: 0 20px;\n"])));
|
|
13326
13360
|
var LinkMenu = styled.ul(_templateObject7$L || (_templateObject7$L = _taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 12px 0 0 0;\n list-style: none;\n"])));
|
|
13327
13361
|
var LinkMenuItem = styled.li(_templateObject8$C || (_templateObject8$C = _taggedTemplateLiteralLoose(["\n padding: 10px 0;\n"])));
|
|
13328
|
-
var IconWrapperFooter = styled.div(_templateObject9$
|
|
13329
|
-
var LinkMenuItemA = styled(Link)(_templateObject10$
|
|
13362
|
+
var IconWrapperFooter = styled.div(_templateObject9$s || (_templateObject9$s = _taggedTemplateLiteralLoose(["\n width: 5px;\n display: flex;\n justify-content: center;\n align-items: center;\n > div {\n display: flex;\n flex-direction: column;\n justify-content: center;\n }\n padding-right: 20px;\n"])));
|
|
13363
|
+
var LinkMenuItemA = styled(Link)(_templateObject10$l || (_templateObject10$l = _taggedTemplateLiteralLoose(["\n ", ";\n display: block;\n width: 100%;\n font-size: 14px;\n font-weight: 400;\n color: var(--grey-10);\n text-decoration: none;\n\n &:hover {\n color: var(--primary-9);\n }\n\n ", ";\n"])), resetButtonStyles, function (_ref) {
|
|
13330
13364
|
var isActive = _ref.isActive;
|
|
13331
|
-
return isActive && css(_templateObject11$
|
|
13365
|
+
return isActive && css(_templateObject11$f || (_templateObject11$f = _taggedTemplateLiteralLoose(["\n &, &:hover {\n color: var(--primary-9);\n }\n "])));
|
|
13332
13366
|
});
|
|
13333
|
-
var FooterMeta = styled.div(_templateObject12$
|
|
13367
|
+
var FooterMeta = styled.div(_templateObject12$e || (_templateObject12$e = _taggedTemplateLiteralLoose(["\n font-family: var(--font-ui);\n border-top: var(--dividing-line) 1px solid;\n margin-top: auto;\n display: flex;\n flex-direction: row;\n align-items: center;\n width: 100%;\n font-size: 10px;\n font-weight: 400;\n color: var(--grey-a11);\n padding: 10px;\n padding-left: ", ";\n"])), function (_ref2) {
|
|
13334
13368
|
var icon = _ref2.icon;
|
|
13335
13369
|
return icon !== '' ? '31px;' : '21px;';
|
|
13336
13370
|
});
|
|
13337
|
-
var NavigationContainer$1 = styled.div(_templateObject13$
|
|
13371
|
+
var NavigationContainer$1 = styled.div(_templateObject13$d || (_templateObject13$d = _taggedTemplateLiteralLoose(["\n max-height: 300px;\n overflow: scroll;\n overflow-x: hidden;\n overflow-y: auto;\n border-bottom: var(--dividing-line) 1px solid;\n"])));
|
|
13338
13372
|
var FooterText = styled.div(_templateObject14$b || (_templateObject14$b = _taggedTemplateLiteralLoose(["\n white-space: break-spaces;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n max-width: 136px;\n max-width: ", ";\n color: var(--grey-11);\n opacity: 0.5;\n"])), function (_ref3) {
|
|
13339
13373
|
var icon = _ref3.icon;
|
|
13340
13374
|
return icon !== '' ? '136px;' : '164px;';
|
|
@@ -13450,10 +13484,10 @@ var UserMenu = function UserMenu(_ref4) {
|
|
|
13450
13484
|
}, title)) : null));
|
|
13451
13485
|
};
|
|
13452
13486
|
|
|
13453
|
-
var _templateObject$
|
|
13454
|
-
var Container$13 = styled.div(_templateObject$
|
|
13455
|
-
var ImgWrapper = styled.div(_templateObject2$
|
|
13456
|
-
var EmptyImg = styled.div(_templateObject3$
|
|
13487
|
+
var _templateObject$1G, _templateObject2$1r, _templateObject3$1i, _templateObject4$1b, _templateObject5$14, _templateObject6$Q, _templateObject7$M, _templateObject8$D;
|
|
13488
|
+
var Container$13 = styled.div(_templateObject$1G || (_templateObject$1G = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: center;\n padding: 18px 20px 12px 20px;\n height: 122px;\n"])));
|
|
13489
|
+
var ImgWrapper = styled.div(_templateObject2$1r || (_templateObject2$1r = _taggedTemplateLiteralLoose(["\n border-radius: 5px;\n overflow: hidden;\n height: 40px;\n width: 40px;\n flex-shrink: 0;\n"])));
|
|
13490
|
+
var EmptyImg = styled.div(_templateObject3$1i || (_templateObject3$1i = _taggedTemplateLiteralLoose(["\n background-color: var(--grey-5);\n width: 100%;\n height: 100%;\n"])));
|
|
13457
13491
|
var Image$2 = styled.div(_templateObject4$1b || (_templateObject4$1b = _taggedTemplateLiteralLoose(["\n position: absolute;\n left: 0;\n top: 0;\n right: 0;\n bottom: 0;\n background-image: url(", ");\n background-position: center center;\n background-size: cover;\n background-repeat: no-repeat;\n display: ", ";\n"])), function (p) {
|
|
13458
13492
|
return p.image;
|
|
13459
13493
|
}, function (p) {
|
|
@@ -13473,10 +13507,10 @@ var NotificationItem = function NotificationItem(_ref) {
|
|
|
13473
13507
|
}) : React__default.createElement(EmptyImg, null)), React__default.createElement(InfoContainer, null, React__default.createElement(Title$9, null, title), React__default.createElement(Message, null, message), React__default.createElement(TimeMsg, null, time)));
|
|
13474
13508
|
};
|
|
13475
13509
|
|
|
13476
|
-
var _templateObject$
|
|
13477
|
-
var Container$14 = styled.div(_templateObject$
|
|
13478
|
-
var StatusContainer = styled.h2(_templateObject2$
|
|
13479
|
-
var NotificationWrapper = styled.div(_templateObject3$
|
|
13510
|
+
var _templateObject$1H, _templateObject2$1s, _templateObject3$1j;
|
|
13511
|
+
var Container$14 = styled.div(_templateObject$1H || (_templateObject$1H = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
13512
|
+
var StatusContainer = styled.h2(_templateObject2$1s || (_templateObject2$1s = _taggedTemplateLiteralLoose(["\n text-transform: uppercase;\n padding: 10px 0 10px 20px;\n font-size: 14px;\n font-weight: 500;\n color: var(--grey-12);\n border-bottom: var(--dividing-line) 1px solid;\n margin: 0;\n"])));
|
|
13513
|
+
var NotificationWrapper = styled.div(_templateObject3$1j || (_templateObject3$1j = _taggedTemplateLiteralLoose(["\n border-bottom: var(--dividing-line) 1px solid;\n"])));
|
|
13480
13514
|
var renderNotifications = function renderNotifications(items, type) {
|
|
13481
13515
|
return items.map(function (item, index) {
|
|
13482
13516
|
return React__default.createElement(NotificationWrapper, {
|
|
@@ -13499,25 +13533,25 @@ var NotificationsHistory = function NotificationsHistory(_ref) {
|
|
|
13499
13533
|
return React__default.createElement(Container$14, null, unread && React__default.createElement(Fragment, null, React__default.createElement(StatusContainer, null, readNotificationsText), renderNotifications(unread, 'unread')), read && React__default.createElement(Fragment, null, React__default.createElement(StatusContainer, null, unreadNotificationsText), renderNotifications(read, 'read')));
|
|
13500
13534
|
};
|
|
13501
13535
|
|
|
13502
|
-
var _templateObject$
|
|
13503
|
-
var CoreStyle = css(_templateObject$
|
|
13504
|
-
var ContainerStatic = styled.div(_templateObject2$
|
|
13536
|
+
var _templateObject$1I, _templateObject2$1t, _templateObject3$1k, _templateObject4$1c, _templateObject5$15, _templateObject6$R, _templateObject7$N, _templateObject8$E, _templateObject9$t, _templateObject10$m, _templateObject11$g, _templateObject12$f, _templateObject13$e;
|
|
13537
|
+
var CoreStyle = css(_templateObject$1I || (_templateObject$1I = _taggedTemplateLiteralLoose(["\n display: flex;\n height: 32px;\n padding: 8px;\n align-items: center;\n justify-content: center;\n text-align: center;\n gap: 8px;\n border-radius: 3px;\n\n font-family: Lato;\n font-size: 14px;\n font-style: normal;\n font-weight: 500;\n line-height: 12px; /* 85.714% */\n white-space: nowrap;\n\n transition: opacity var(--speed-fast) var(--easing-primary-out);\n\n"])));
|
|
13538
|
+
var ContainerStatic = styled.div(_templateObject2$1t || (_templateObject2$1t = _taggedTemplateLiteralLoose(["\n ", ";\n\n ", ";\n"])), CoreStyle, function (_ref) {
|
|
13505
13539
|
var themeColor = _ref.themeColor;
|
|
13506
|
-
return themeColor ? css(_templateObject3$
|
|
13540
|
+
return themeColor ? css(_templateObject3$1k || (_templateObject3$1k = _taggedTemplateLiteralLoose(["\n border: 2px solid var(--", "-9);\n color: var(--", "-11);\n "])), themeColor, themeColor) : css(_templateObject4$1c || (_templateObject4$1c = _taggedTemplateLiteralLoose(["\n border: 2px solid var(--info-9);\n color: var(--info-11);\n "])));
|
|
13507
13541
|
});
|
|
13508
13542
|
var DefaultText = styled.span(_templateObject5$15 || (_templateObject5$15 = _taggedTemplateLiteralLoose(["\n display: inline-block;\n"])));
|
|
13509
13543
|
var LinkText = styled.span(_templateObject6$R || (_templateObject6$R = _taggedTemplateLiteralLoose([""])));
|
|
13510
13544
|
var ContainerLinked = styled.div(_templateObject7$N || (_templateObject7$N = _taggedTemplateLiteralLoose(["\n a {\n ", ";\n\n text-decoration: none;\n\n ", ";\n\n &:hover {\n ", ";\n }\n }\n"])), CoreStyle, function (_ref2) {
|
|
13511
13545
|
var themeColor = _ref2.themeColor;
|
|
13512
|
-
return themeColor ? css(_templateObject8$E || (_templateObject8$E = _taggedTemplateLiteralLoose(["\n background-color: transparent;\n border: 2px solid var(--", "-9);\n color: var(--", "-11);\n "])), themeColor, themeColor) : css(_templateObject9$
|
|
13546
|
+
return themeColor ? css(_templateObject8$E || (_templateObject8$E = _taggedTemplateLiteralLoose(["\n background-color: transparent;\n border: 2px solid var(--", "-9);\n color: var(--", "-11);\n "])), themeColor, themeColor) : css(_templateObject9$t || (_templateObject9$t = _taggedTemplateLiteralLoose(["\n background-color: transparent;\n border: 2px solid var(--info-9);\n color: var(--info-11);\n "])));
|
|
13513
13547
|
}, function (_ref3) {
|
|
13514
13548
|
var themeColor = _ref3.themeColor;
|
|
13515
|
-
return themeColor ? css(_templateObject10$
|
|
13549
|
+
return themeColor ? css(_templateObject10$m || (_templateObject10$m = _taggedTemplateLiteralLoose(["\n background-color: var(--", "-9);\n border: 2px solid var(--", "-9);\n color: var(--white-12);\n "])), themeColor, themeColor) : css(_templateObject11$g || (_templateObject11$g = _taggedTemplateLiteralLoose(["\n background-color: var(--info-9);\n border: 2px solid var(--info-9);\n color: var(--white-12);\n "])));
|
|
13516
13550
|
});
|
|
13517
|
-
var Container$15 = styled.div(_templateObject12$
|
|
13551
|
+
var Container$15 = styled.div(_templateObject12$f || (_templateObject12$f = _taggedTemplateLiteralLoose(["\n ", ";\n"])), function (_ref4) {
|
|
13518
13552
|
var ready = _ref4.ready,
|
|
13519
13553
|
minWidth = _ref4.minWidth;
|
|
13520
|
-
return css(_templateObject13$
|
|
13554
|
+
return css(_templateObject13$e || (_templateObject13$e = _taggedTemplateLiteralLoose(["\n \n visibility: ", ";\n opacity: ", ";\n\n transition: opacity var(--speed-fast) var(--easing-primary-in-out);\n\n ", ", ", "{\n /* Required to accurately measure container sizes and ensure hover doesn't resize. */\n ", ";\n }\n "])), ready ? 'visible' : 'hidden', ready ? '1' : '0', DefaultText, LinkText, ready && "min-width: " + minWidth + "px;");
|
|
13521
13555
|
});
|
|
13522
13556
|
var TopBarBadge = function TopBarBadge(_ref5) {
|
|
13523
13557
|
var text = _ref5.text,
|
|
@@ -13584,10 +13618,10 @@ var TopBarBadge = function TopBarBadge(_ref5) {
|
|
|
13584
13618
|
}), badgeComponent);
|
|
13585
13619
|
};
|
|
13586
13620
|
|
|
13587
|
-
var _templateObject$
|
|
13588
|
-
var Container$16 = styled.div(_templateObject$
|
|
13589
|
-
var RightArea$1 = styled.div(_templateObject2$
|
|
13590
|
-
var SearchBar = styled.div(_templateObject3$
|
|
13621
|
+
var _templateObject$1J, _templateObject2$1u, _templateObject3$1l, _templateObject4$1d, _templateObject5$16, _templateObject6$S, _templateObject7$O, _templateObject8$F, _templateObject9$u, _templateObject10$n, _templateObject11$h, _templateObject12$g, _templateObject13$f;
|
|
13622
|
+
var Container$16 = styled.div(_templateObject$1J || (_templateObject$1J = _taggedTemplateLiteralLoose(["\n z-index: 9;\n position: sticky;\n top: 0;\n height: 56px;\n padding: 0 16px 0 24px;\n width: 100%;\n display: flex;\n justify-content: space-between;\n align-self: flex-start;\n border-bottom: 1px solid var(--dividing-line);\n background: var(--grey-2);\n box-shadow: 5px 0px 10px 0px var(--primary-a2);\n"])));
|
|
13623
|
+
var RightArea$1 = styled.div(_templateObject2$1u || (_templateObject2$1u = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n gap: 24px;\n height: 100%;\n"])));
|
|
13624
|
+
var SearchBar = styled.div(_templateObject3$1l || (_templateObject3$1l = _taggedTemplateLiteralLoose(["\n flex: 0 1 500px;\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 8px;\n"])));
|
|
13591
13625
|
var IconWrapper$4 = styled.div(_templateObject4$1d || (_templateObject4$1d = _taggedTemplateLiteralLoose(["\n flex: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n > div {\n display: flex;\n flex-direction: column;\n justify-content: center;\n }\n"])));
|
|
13592
13626
|
var SearchInput = styled.input(_templateObject5$16 || (_templateObject5$16 = _taggedTemplateLiteralLoose(["\n ", ";\n font-family: var(--font-data);\n flex: 1;\n height: 35px;\n line-height: 35px;\n border: none;\n outline: none;\n background: transparent; \n color: var(--grey-10);\n font-size: 14px;\n\n &::placeholder {\n font-family: var(--font-data);\n font-weight: 400;\n font-style: italic;\n font-size: 14px;\n color: var(--grey-8);\n }\n"])), removeAutoFillStyle);
|
|
13593
13627
|
var ButtonArea = styled.div(_templateObject6$S || (_templateObject6$S = _taggedTemplateLiteralLoose(["\n height: inherit;\n display: flex;\n gap: 0;\n"])));
|
|
@@ -13596,17 +13630,17 @@ var DrawerToggle = styled.button.attrs({
|
|
|
13596
13630
|
type: 'button'
|
|
13597
13631
|
})(_templateObject8$F || (_templateObject8$F = _taggedTemplateLiteralLoose(["\n position: relative;\n flex: 0 56px;\n width: 56px;\n height: inherit;\n display: flex;\n justify-content: center;\n align-items: center;\n border: none;\n background: none;\n outline: none;\n cursor: pointer;\n\n &::after {\n content: '';\n position: absolute;\n bottom: 0;\n right: 0;\n left: 0;\n height: 5px;\n background-color: transparent;\n border-radius: 2px 2px 0 0;\n }\n \n transition: background-color var(--speed-normal) var(--easing-primary-out);\n \n svg {\n transition: transform var(--speed-normal) var(--easing-primary-out);\n }\n\n &:hover {\n opacity: 0.9;\n &::after {\n background-color: var(--primary-6);\n }\n }\n \n ", "\n"])), function (_ref) {
|
|
13598
13632
|
var isActive = _ref.isActive;
|
|
13599
|
-
return isActive && css(_templateObject9$
|
|
13633
|
+
return isActive && css(_templateObject9$u || (_templateObject9$u = _taggedTemplateLiteralLoose(["\n &, &:hover {\n border-bottom-color: var(--primary-9);\n &::after {\n background-color: var(--primary-9);\n }\n svg {\n transform: scale(1);\n animation: ", " 0.35s cubic-bezier(0.7, 0, 0.84, 0);\n }\n\n }\n "])), buttonClickAnimation);
|
|
13600
13634
|
});
|
|
13601
|
-
var DrawerPortalWrapper = styled.div(_templateObject10$
|
|
13602
|
-
var Drawer = styled.div(_templateObject11$
|
|
13635
|
+
var DrawerPortalWrapper = styled.div(_templateObject10$n || (_templateObject10$n = _taggedTemplateLiteralLoose([""])));
|
|
13636
|
+
var Drawer = styled.div(_templateObject11$h || (_templateObject11$h = _taggedTemplateLiteralLoose(["\n font-family: var(--font-ui);\n\n position: fixed;\n right: -10px;\n top: 56px;\n bottom: 0;\n background: var(--global-element-background);\n border-left: var(--dividing-line) 1px solid;\n \n width: ", ";\n opacity: 0;\n visibility: hidden;\n z-index: 100;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n\n transition:\n opacity var(--speed-normal) var(--easing-primary-in-out),\n right var(--speed-normal) var(--easing-primary-in-out);\n\n ", "\n"])), function (_ref2) {
|
|
13603
13637
|
var baseWidth = _ref2.baseWidth;
|
|
13604
13638
|
return baseWidth ? baseWidth : "200px";
|
|
13605
13639
|
}, function (_ref3) {
|
|
13606
13640
|
var isOpen = _ref3.isOpen;
|
|
13607
|
-
return isOpen && css(_templateObject12$
|
|
13641
|
+
return isOpen && css(_templateObject12$g || (_templateObject12$g = _taggedTemplateLiteralLoose(["\n right: 0;\n opacity: 1;\n visibility: visible;\n "])));
|
|
13608
13642
|
});
|
|
13609
|
-
var NotificationsContainer = styled.div(_templateObject13$
|
|
13643
|
+
var NotificationsContainer = styled.div(_templateObject13$f || (_templateObject13$f = _taggedTemplateLiteralLoose(["\n overflow-y: scroll;\n margin-right: -17px;\n"])));
|
|
13610
13644
|
var TopBar = function TopBar(_ref4) {
|
|
13611
13645
|
var _ref4$hasNotification = _ref4.hasNotifications,
|
|
13612
13646
|
hasNotifications = _ref4$hasNotification === void 0 ? false : _ref4$hasNotification,
|
|
@@ -13736,8 +13770,8 @@ var TopBar = function TopBar(_ref4) {
|
|
|
13736
13770
|
}, customDrawer.customComponent)), document.body));
|
|
13737
13771
|
};
|
|
13738
13772
|
|
|
13739
|
-
var _templateObject$
|
|
13740
|
-
var TabListWrapper = styled.div(_templateObject$
|
|
13773
|
+
var _templateObject$1K;
|
|
13774
|
+
var TabListWrapper = styled.div(_templateObject$1K || (_templateObject$1K = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n"])));
|
|
13741
13775
|
var TabList = function TabList(_ref) {
|
|
13742
13776
|
var children = _ref.children,
|
|
13743
13777
|
defaultTabId = _ref.defaultTabId;
|
|
@@ -13750,11 +13784,11 @@ var TabList = function TabList(_ref) {
|
|
|
13750
13784
|
};
|
|
13751
13785
|
|
|
13752
13786
|
var _excluded$I = ["children", "tabFor", "onClick"];
|
|
13753
|
-
var _templateObject$
|
|
13754
|
-
var TabComponent = styled.div(_templateObject$
|
|
13755
|
-
var TabLabel = styled.label(_templateObject2$
|
|
13787
|
+
var _templateObject$1L, _templateObject2$1v, _templateObject3$1m;
|
|
13788
|
+
var TabComponent = styled.div(_templateObject$1L || (_templateObject$1L = _taggedTemplateLiteralLoose(["\n margin-right: 39px;\n display: flex;\n align-items: center;\n line-height: 20px;\n"])));
|
|
13789
|
+
var TabLabel = styled.label(_templateObject2$1v || (_templateObject2$1v = _taggedTemplateLiteralLoose(["\n height: 40px;\n ", "\n font-size: 15px;\n font-weight: ", ";\n letter-spacing: 0.09px;\n color: ", ";\n cursor: pointer;\n border-bottom: ", ";\n padding-top: 6px;\n padding-bottom: 14px;\n flex-shrink: 0;\n user-select: none;\n"])), function (_ref) {
|
|
13756
13790
|
var theme = _ref.theme;
|
|
13757
|
-
return css(_templateObject3$
|
|
13791
|
+
return css(_templateObject3$1m || (_templateObject3$1m = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n "])), theme.fontFamily.ui);
|
|
13758
13792
|
}, function (_ref2) {
|
|
13759
13793
|
var active = _ref2.active;
|
|
13760
13794
|
return active ? '600' : '500';
|
|
@@ -13785,8 +13819,8 @@ var Tab = function Tab(_ref5) {
|
|
|
13785
13819
|
};
|
|
13786
13820
|
|
|
13787
13821
|
var _excluded$J = ["children", "tabId"];
|
|
13788
|
-
var _templateObject$
|
|
13789
|
-
var Container$17 = styled.div(_templateObject$
|
|
13822
|
+
var _templateObject$1M;
|
|
13823
|
+
var Container$17 = styled.div(_templateObject$1M || (_templateObject$1M = _taggedTemplateLiteralLoose(["\n"])));
|
|
13790
13824
|
var TabContent = function TabContent(_ref) {
|
|
13791
13825
|
var children = _ref.children,
|
|
13792
13826
|
tabId = _ref.tabId,
|
|
@@ -13797,11 +13831,11 @@ var TabContent = function TabContent(_ref) {
|
|
|
13797
13831
|
};
|
|
13798
13832
|
|
|
13799
13833
|
var _excluded$K = ["tabFor", "icon", "closeId", "counter", "status"];
|
|
13800
|
-
var _templateObject$
|
|
13801
|
-
var Container$18 = styled.button(_templateObject$
|
|
13802
|
-
var LinkTab = styled.div(_templateObject2$
|
|
13834
|
+
var _templateObject$1N, _templateObject2$1w, _templateObject3$1n, _templateObject4$1e;
|
|
13835
|
+
var Container$18 = styled.button(_templateObject$1N || (_templateObject$1N = _taggedTemplateLiteralLoose(["\n ", "\n flex-basis: auto;\n flex-grow: 1;\n"])), resetButtonStyles);
|
|
13836
|
+
var LinkTab = styled.div(_templateObject2$1w || (_templateObject2$1w = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100%;\n\n ", ";\n\n ", "\n"])), function (_ref) {
|
|
13803
13837
|
var theme = _ref.theme;
|
|
13804
|
-
return css(_templateObject3$
|
|
13838
|
+
return css(_templateObject3$1n || (_templateObject3$1n = _taggedTemplateLiteralLoose(["\n transition: border ", " ", ";\n border-bottom: 5px solid ", ";\n\n ", " {\n [stroke]{\n stroke: var(--dimmed);\n }\n }\n\n &:hover {\n border-bottom-color: ", ";\n ", " {\n [stroke]{\n stroke: ", ";\n }\n }\n }\n "])), theme.animation.speed.normal, theme.animation.easing.primary.easeInOut, theme.colors.menu.indicator, IconWrapper, theme.colors.menu.hover, IconWrapper, theme.colors.menu.hover);
|
|
13805
13839
|
}, function (_ref2) {
|
|
13806
13840
|
var isActive = _ref2.isActive,
|
|
13807
13841
|
theme = _ref2.theme;
|
|
@@ -13835,10 +13869,10 @@ var MobileTab = function MobileTab(_ref3) {
|
|
|
13835
13869
|
};
|
|
13836
13870
|
|
|
13837
13871
|
var _excluded$L = ["icon", "title", "subtitle", "tabFor"];
|
|
13838
|
-
var _templateObject$
|
|
13839
|
-
var Container$19 = styled.div(_templateObject$
|
|
13872
|
+
var _templateObject$1O, _templateObject2$1x, _templateObject3$1o, _templateObject4$1f, _templateObject5$17, _templateObject6$T;
|
|
13873
|
+
var Container$19 = styled.div(_templateObject$1O || (_templateObject$1O = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n margin-right: 22px;\n padding-bottom: 7px;\n height: 60px;\n cursor: pointer;\n\n ", ";\n ", " {\n margin-left: 2px;\n flex-shrink: 0;\n }\n"])), function (_ref) {
|
|
13840
13874
|
var active = _ref.active;
|
|
13841
|
-
return active ? css(_templateObject2$
|
|
13875
|
+
return active ? css(_templateObject2$1x || (_templateObject2$1x = _taggedTemplateLiteralLoose(["\n border-bottom: 3px solid var(--primary-11);\n "]))) : css(_templateObject3$1o || (_templateObject3$1o = _taggedTemplateLiteralLoose(["\n border-bottom: 3px solid transparent;\n "])));
|
|
13842
13876
|
}, IconWrapper);
|
|
13843
13877
|
var Title$a = styled.div(_templateObject4$1f || (_templateObject4$1f = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n font-family: ", ";\n letter-spacing: 0.09px;\n font-weight: 500;\n color: ", ";\n margin-bottom: 5px;\n flex-shrink: 0;\n white-space: nowrap;\n text-overflow: ellipsis;\n"])), function (_ref2) {
|
|
13844
13878
|
var theme = _ref2.theme;
|
|
@@ -13882,9 +13916,9 @@ var TabWithIcon = function TabWithIcon(_ref5) {
|
|
|
13882
13916
|
}), title), subtitle && React__default.createElement(SubTitle$2, null, subtitle)));
|
|
13883
13917
|
};
|
|
13884
13918
|
|
|
13885
|
-
var _templateObject$
|
|
13886
|
-
var Container$1a = styled.div(_templateObject$
|
|
13887
|
-
var TabListWrapper$1 = styled.div(_templateObject2$
|
|
13919
|
+
var _templateObject$1P, _templateObject2$1y;
|
|
13920
|
+
var Container$1a = styled.div(_templateObject$1P || (_templateObject$1P = _taggedTemplateLiteralLoose([""])));
|
|
13921
|
+
var TabListWrapper$1 = styled.div(_templateObject2$1y || (_templateObject2$1y = _taggedTemplateLiteralLoose(["\n padding-top: 10px;\n padding-left: ", ";\n box-shadow: 0 -5px 5px 0 var(--black-a1);\n border-bottom: 1px solid var(--grey-6);\n overflow-y: auto;\n scrollbar-width: none; /* Firefox */\n -ms-overflow-style: none; /* Internet Explorer 10+ */\n &::-webkit-scrollbar { /* WebKit */\n width: 0;\n height: 0;\n }\n"])), function (_ref) {
|
|
13888
13922
|
var paddingLeft = _ref.paddingLeft;
|
|
13889
13923
|
return paddingLeft ? paddingLeft : '87px';
|
|
13890
13924
|
});
|
|
@@ -13920,10 +13954,10 @@ var TabsWithIconBar = function TabsWithIconBar(_ref2) {
|
|
|
13920
13954
|
};
|
|
13921
13955
|
|
|
13922
13956
|
var _excluded$M = ["closeId", "closeText"];
|
|
13923
|
-
var _templateObject$
|
|
13924
|
-
var StyledButton$7 = styled.button(_templateObject$
|
|
13925
|
-
var IconContainer$4 = styled.div(_templateObject2$
|
|
13926
|
-
var TextWrapper$1 = styled.div(_templateObject3$
|
|
13957
|
+
var _templateObject$1Q, _templateObject2$1z, _templateObject3$1p;
|
|
13958
|
+
var StyledButton$7 = styled.button(_templateObject$1Q || (_templateObject$1Q = _taggedTemplateLiteralLoose(["\n ", "\n \n font-family: var(--font-ui);\n background-color: var(--global-element-background);\n border-top: 1px solid var(--dividing-line);\n font-weight: 400;\n color: var(--grey-10);\n \n height: ", "px;\n position: fixed;\n bottom: 0;\n font-size: 14px;\n outline: none;\n\n width: 100%;\n text-align: center;\n white-space: nowrap;\n padding: 0 40px;\n\n"])), resetButtonStyles, MOBILE_CLOSE_HEIGHT);
|
|
13959
|
+
var IconContainer$4 = styled.div(_templateObject2$1z || (_templateObject2$1z = _taggedTemplateLiteralLoose(["\n height: inherit;\n position: absolute;\n top: 0;\n left: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n overflow: hidden;\n margin: 0 20px;\n\n svg {\n display:block;\n }\n"])));
|
|
13960
|
+
var TextWrapper$1 = styled.div(_templateObject3$1p || (_templateObject3$1p = _taggedTemplateLiteralLoose(["\n text-transform: uppercase;\n"])));
|
|
13927
13961
|
var CloseButton$1 = function CloseButton(_ref) {
|
|
13928
13962
|
var closeId = _ref.closeId,
|
|
13929
13963
|
_ref$closeText = _ref.closeText,
|
|
@@ -13942,9 +13976,9 @@ var CloseButton$1 = function CloseButton(_ref) {
|
|
|
13942
13976
|
})), React__default.createElement(TextWrapper$1, null, closeText));
|
|
13943
13977
|
};
|
|
13944
13978
|
|
|
13945
|
-
var _templateObject$
|
|
13946
|
-
var Container$1b = styled.div(_templateObject$
|
|
13947
|
-
var ContentWrapper = styled.div(_templateObject2$
|
|
13979
|
+
var _templateObject$1R, _templateObject2$1A;
|
|
13980
|
+
var Container$1b = styled.div(_templateObject$1R || (_templateObject$1R = _taggedTemplateLiteralLoose(["\n position: relative;\n min-height: calc(100vh - ", "px);\n width: 100%;\n overflow-y: scroll;\n"])), MOBILE_NAVBAR_HEIGHT + MOBILE_CLOSE_HEIGHT);
|
|
13981
|
+
var ContentWrapper = styled.div(_templateObject2$1A || (_templateObject2$1A = _taggedTemplateLiteralLoose(["\n position: absolute;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n"])));
|
|
13948
13982
|
var MobileNavbarContent = function MobileNavbarContent(_ref) {
|
|
13949
13983
|
var closeId = _ref.closeId,
|
|
13950
13984
|
children = _ref.children;
|
|
@@ -13953,9 +13987,9 @@ var MobileNavbarContent = function MobileNavbarContent(_ref) {
|
|
|
13953
13987
|
return selected === closeId ? null : React__default.createElement(Container$1b, null, React__default.createElement(ContentWrapper, null, children));
|
|
13954
13988
|
};
|
|
13955
13989
|
|
|
13956
|
-
var _templateObject$
|
|
13957
|
-
var Container$1c = styled.div(_templateObject$
|
|
13958
|
-
var ItemWrapper = styled.div(_templateObject2$
|
|
13990
|
+
var _templateObject$1S, _templateObject2$1B;
|
|
13991
|
+
var Container$1c = styled.div(_templateObject$1S || (_templateObject$1S = _taggedTemplateLiteralLoose([""])));
|
|
13992
|
+
var ItemWrapper = styled.div(_templateObject2$1B || (_templateObject2$1B = _taggedTemplateLiteralLoose(["\n padding: 14px 0;\n border-bottom: 1px solid var(--dividing-line);\n"])));
|
|
13959
13993
|
var MobileMenu = function MobileMenu(_ref) {
|
|
13960
13994
|
var content = _ref.content,
|
|
13961
13995
|
supportUrl = _ref.supportUrl,
|
|
@@ -14004,10 +14038,10 @@ var MobileMenu = function MobileMenu(_ref) {
|
|
|
14004
14038
|
})));
|
|
14005
14039
|
};
|
|
14006
14040
|
|
|
14007
|
-
var _templateObject$
|
|
14008
|
-
var Logo$1 = styled(Link)(_templateObject$
|
|
14009
|
-
var LogoMark$1 = styled.div(_templateObject2$
|
|
14010
|
-
var SVGObject$1 = styled.object(_templateObject3$
|
|
14041
|
+
var _templateObject$1T, _templateObject2$1C, _templateObject3$1q;
|
|
14042
|
+
var Logo$1 = styled(Link)(_templateObject$1T || (_templateObject$1T = _taggedTemplateLiteralLoose(["\n ", ";\n display: flex;\n flex-basis: 0;\n flex-grow: 1;\n justify-content: center;\n align-items: center;\n object {\n pointer-events: none;\n height: 25px;\n }\n"])), resetButtonStyles);
|
|
14043
|
+
var LogoMark$1 = styled.div(_templateObject2$1C || (_templateObject2$1C = _taggedTemplateLiteralLoose(["\n margin-right: 15px;\n"])));
|
|
14044
|
+
var SVGObject$1 = styled.object(_templateObject3$1q || (_templateObject3$1q = _taggedTemplateLiteralLoose([""])));
|
|
14011
14045
|
var MobileLogoLink = function MobileLogoLink(_ref) {
|
|
14012
14046
|
var _ref$home = _ref.home,
|
|
14013
14047
|
home = _ref$home === void 0 ? "/" : _ref$home,
|
|
@@ -14027,8 +14061,8 @@ var MobileLogoLink = function MobileLogoLink(_ref) {
|
|
|
14027
14061
|
};
|
|
14028
14062
|
|
|
14029
14063
|
var _excluded$N = ["closeId", "hasLanguage", "hasLogout", "logoutLink", "hasCurrentUser", "userSubmenu", "userDrawerBespoke", "loggedInUser", "onLogout", "onLanguageToggle"];
|
|
14030
|
-
var _templateObject$
|
|
14031
|
-
var Container$1d = styled.div(_templateObject$
|
|
14064
|
+
var _templateObject$1U;
|
|
14065
|
+
var Container$1d = styled.div(_templateObject$1U || (_templateObject$1U = _taggedTemplateLiteralLoose(["\n background: var(--global-element-background);\n \n z-index: 100;\n display: flex;\n flex-direction: column;\n"])));
|
|
14032
14066
|
var MobileUserMenu = function MobileUserMenu(_ref) {
|
|
14033
14067
|
var closeId = _ref.closeId,
|
|
14034
14068
|
hasLanguage = _ref.hasLanguage,
|
|
@@ -14062,14 +14096,14 @@ var MobileUserMenu = function MobileUserMenu(_ref) {
|
|
|
14062
14096
|
};
|
|
14063
14097
|
|
|
14064
14098
|
var _excluded$O = ["content", "home", "logoMark", "supportUrl", "defaultMenuOpen", "closeText", "hasLanguage", "hasLogout", "logoutLink", "hasCurrentUser", "hasNotifications", "userSubmenu", "userDrawerBespoke", "loggedInUser", "notificationsHistory", "customDrawer", "onLogout", "onLanguageToggle"];
|
|
14065
|
-
var _templateObject$
|
|
14099
|
+
var _templateObject$1V, _templateObject2$1D;
|
|
14066
14100
|
var CLOSE_ID = 'closeMenu';
|
|
14067
14101
|
var NOTI_TAB = 'notifications';
|
|
14068
14102
|
var USER_TAB = 'user';
|
|
14069
14103
|
var MENU_TAB = 'menu';
|
|
14070
14104
|
var CUSTOM_TAB = 'custom';
|
|
14071
|
-
var Container$1e = styled.nav(_templateObject$
|
|
14072
|
-
var HeaderContainer = styled.div(_templateObject2$
|
|
14105
|
+
var Container$1e = styled.nav(_templateObject$1V || (_templateObject$1V = _taggedTemplateLiteralLoose(["\n background-color: var(--global-element-background);\n position: sticky;\n top: 0;\n left: 0;\n width: 100%;\n z-index: 99;\n"])));
|
|
14106
|
+
var HeaderContainer = styled.div(_templateObject2$1D || (_templateObject2$1D = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n height: ", "px;\n border-bottom: var(--dividing-line) 1px solid;\n\n ", " {\n flex-basis: 0;\n flex-grow: 3;\n }\n"])), MOBILE_NAVBAR_HEIGHT, TabListWrapper);
|
|
14073
14107
|
var MobileNavbar = function MobileNavbar(_ref) {
|
|
14074
14108
|
var content = _ref.content,
|
|
14075
14109
|
home = _ref.home,
|
|
@@ -14190,16 +14224,16 @@ var GlobalUI = function GlobalUI(_ref) {
|
|
|
14190
14224
|
};
|
|
14191
14225
|
|
|
14192
14226
|
var _excluded$Q = ["children"];
|
|
14193
|
-
var _templateObject$
|
|
14194
|
-
var Container$1f = styled.div(_templateObject$
|
|
14195
|
-
var LogoContainer = styled.div(_templateObject2$
|
|
14196
|
-
var LogoTopText = styled.div(_templateObject3$
|
|
14227
|
+
var _templateObject$1W, _templateObject2$1E, _templateObject3$1r, _templateObject4$1g, _templateObject5$18, _templateObject6$U, _templateObject7$P, _templateObject8$G, _templateObject9$v;
|
|
14228
|
+
var Container$1f = styled.div(_templateObject$1W || (_templateObject$1W = _taggedTemplateLiteralLoose(["\n width: 286px;\n border-right: 1px solid var(--grey-a7);\n height: 100%;\n overflow-y: auto;\n overflow-x: hidden;\n display: flex;\n flex-direction: column;\n"])));
|
|
14229
|
+
var LogoContainer = styled.div(_templateObject2$1E || (_templateObject2$1E = _taggedTemplateLiteralLoose(["\n height: 84px;\n color: var(--grey-11);\n border-bottom: 1px solid var(--grey-a7);\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding-top: 18px;\n padding-bottom: 15px;\n"])));
|
|
14230
|
+
var LogoTopText = styled.div(_templateObject3$1r || (_templateObject3$1r = _taggedTemplateLiteralLoose(["\n height: 31px;\n font-family: Monorale;\n font-size: 18px;\n font-weight: 500;\n line-height: 1.72;\n letter-spacing: 4.5px;\n text-align: center;\n"])));
|
|
14197
14231
|
var LogoBottomText = styled.div(_templateObject4$1g || (_templateObject4$1g = _taggedTemplateLiteralLoose(["\n height: 19px;\n font-family: Monorale;\n font-size: 16px;\n font-weight: 400;\n line-height: normal;\n letter-spacing: 14.11px;\n text-align: center;\n"])));
|
|
14198
14232
|
var SidebarBox = styled.div(_templateObject5$18 || (_templateObject5$18 = _taggedTemplateLiteralLoose(["\n position: relative;\n border-bottom: 1px solid var(--grey-a7);\n padding: 22px 20px 21px 20px;\n"])));
|
|
14199
14233
|
var SidebarHeading = styled.div(_templateObject6$U || (_templateObject6$U = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n font-weight: 500;\n letter-spacing: 0.35px;\n color: var(--grey-10);\n margin-bottom: 18px;\n"])));
|
|
14200
14234
|
var SidebarLinkHeading = styled.div(_templateObject7$P || (_templateObject7$P = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n font-weight: 500;\n letter-spacing: 0.35px;\n color: var(--grey-10);\n"])));
|
|
14201
14235
|
var BackLink$1 = styled(Link)(_templateObject8$G || (_templateObject8$G = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n font-weight: 500;\n letter-spacing: 0.35px;\n color: var(--grey-10);\n"])));
|
|
14202
|
-
var SLink = styled(Link)(_templateObject9$
|
|
14236
|
+
var SLink = styled(Link)(_templateObject9$v || (_templateObject9$v = _taggedTemplateLiteralLoose(["\n position: absolute;\n right: 30px;\n top: 15px;\n /* width: 80px; */\n /* height: 30px; */\n font-size: 14px;\n font-weight: 600;\n text-align: center;\n color: var(--grey-9);\n border-radius: 3px;\n background-color: var(--primary-2);\n text-decoration: none;\n padding: 7px 20px;\n"])));
|
|
14203
14237
|
var SidebarLink = function SidebarLink(_ref) {
|
|
14204
14238
|
var title = _ref.title,
|
|
14205
14239
|
to = _ref.to;
|