krl-alfred 1.72.11 → 1.72.13
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.
|
@@ -10,5 +10,5 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
10
10
|
exports.BannerStyled = void 0;
|
|
11
11
|
var styled_components_1 = __importDefault(require("styled-components"));
|
|
12
12
|
var devices_1 = require("../../../../constants/devices");
|
|
13
|
-
exports.BannerStyled = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n max-width: 1050px;\n margin: 0 auto;\n\n .swiper-wrapper {\n align-items: center;\n }\n\n .slick-list {\n border-radius: 0.5rem;\n box-shadow: 0 6px 30px 0 #EAE9F0;\n position: relative;\n overflow: hidden;\n\n @media only screen and ", " {\n background: #f1f1f1;\n }\n }\n .slick-arrow{\n display: none !important;\n }\n\n @media only screen and ", " {\n .slick-active{\n box-shadow: 0 0.375rem 1.875rem 0 #EAE9F0;\n position: relative;\n z-index: 5;\n }\n } \n\n .item {\n padding: 0 5rem;\n display: grid;\n grid-template-columns: 1fr auto;\n align-items: center;\n height: 420px;\n @media only screen and ", " {\n padding: 0;\n display: block;\n height: auto;\n }\n\n .text {\n @media only screen and ", " {\n display: none;\n }\n\n .title {\n margin-bottom: 1.5rem;\n display: block;\n }\n\n .description {\n margin-top: 0;\n margin-bottom: 1.5rem;\n display: block;\n }\n }\n\n .textMobile {\n display: none;\n background-color: var(--primary-shades-dark);\n padding: 0 1rem;\n color: white;\n align-items: center;\n justify-content: space-between;\n border-radius: 0 0 8px 8px;\n height: 70px;\n svg {\n path {\n stroke: white;\n }\n }\n\n b {\n display: block;\n }\n\n @media only screen and ", " {\n display: flex;\n }\n }\n\n .img {\n text-align: end;\n img {\n display: inline-block !important;\n max-height: 100%;\n max-width: 100%;\n @media only screen and ", " {\n height: auto;\n }\n }\n\n @media only screen and ", " {\n padding: 0;\n text-align: center;\n height: 228px;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: white;\n span {\n height: 174px !important;\n }\n }\n }\n }\n\n .thumbnailSlider {\n margin-top: 3rem;\n display: flex;\n align-items: center;\n justify-content: center;\n @media only screen and ", " {\n display: none;\n }\n\n .thumbnailInner {\n justify-content: center;\n display: flex;\n align-items: center;\n margin: 0 2.5rem;\n\n .thumbnailItem {\n border: 1px solid var(--dark-opacity-10);\n height: 50px;\n border-radius: 0.5rem;\n position: relative;\n overflow: hidden;\n margin: 0 4px;\n box-shadow: 0 6px 30px 0 var(--dark-opacity-5);\n width: 70px;\n padding: 8px;\n box-sizing: border-box;\n cursor: pointer;\n transition: all .1s ease;\n\n &:is(.active) {\n border-color: var(--primary);\n }\n\n > * {\n display: block;\n width: 100%;\n height: 100%;\n object-fit: contain;\n object-position: center center;\n }\n }\n }\n\n .navigation {\n box-sizing: border-box;\n display: flex;\n justify-content: center;\n align-items: center;\n border-radius: 8px;\n font-family: var(--font-family-sans-serif);\n cursor: pointer;\n transition: all .2s;\n width: 48px;\n height: 48px;\n box-shadow: 0 0 16px 0 white;\n border: 0;\n background-color: white;\n\n svg {\n path {\n stroke: var(--primary);\n }\n }\n\n &:hover {\n box-shadow: 0 0 16px 0 var(--dark-opacity-10);\n }\n }\n }\n"], ["\n max-width: 1050px;\n margin: 0 auto;\n\n .swiper-wrapper {\n align-items: center;\n }\n\n .slick-list {\n border-radius: 0.5rem;\n box-shadow: 0 6px 30px 0 #EAE9F0;\n position: relative;\n overflow: hidden;\n\n @media only screen and ", " {\n background: #f1f1f1;\n }\n }\n .slick-arrow{\n display: none !important;\n }\n\n @media only screen and ", " {\n .slick-active{\n box-shadow: 0 0.375rem 1.875rem 0 #EAE9F0;\n position: relative;\n z-index: 5;\n }\n } \n\n .item {\n padding: 0 5rem;\n display: grid;\n grid-template-columns: 1fr auto;\n align-items: center;\n height: 420px;\n @media only screen and ", " {\n padding: 0;\n display: block;\n height: auto;\n }\n\n .text {\n @media only screen and ", " {\n display: none;\n }\n\n .title {\n margin-bottom: 1.5rem;\n display: block;\n }\n\n .description {\n margin-top: 0;\n margin-bottom: 1.5rem;\n display: block;\n }\n }\n\n .textMobile {\n display: none;\n background-color: var(--primary-shades-dark);\n padding: 0 1rem;\n color: white;\n align-items: center;\n justify-content: space-between;\n border-radius: 0 0 8px 8px;\n height: 70px;\n svg {\n path {\n stroke: white;\n }\n }\n\n b {\n display: block;\n }\n\n @media only screen and ", " {\n display: flex;\n }\n }\n\n .img {\n text-align: end;\n img {\n display: inline-block !important;\n max-height: 100%;\n max-width: 100%;\n @media only screen and ", " {\n height: auto;\n }\n }\n\n @media only screen and ", " {\n padding: 0;\n text-align: center;\n height: 228px;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: white;\n span {\n height: 174px !important;\n }\n }\n }\n }\n\n .thumbnailSlider {\n margin-top: 3rem;\n display: flex;\n align-items: center;\n justify-content: center;\n @media only screen and ", " {\n display: none;\n }\n\n .thumbnailInner {\n justify-content: center;\n display: flex;\n align-items: center;\n margin: 0 2.5rem;\n\n .thumbnailItem {\n border: 1px solid var(--dark-opacity-10);\n height: 50px;\n border-radius: 0.5rem;\n position: relative;\n overflow: hidden;\n margin: 0 4px;\n box-shadow: 0 6px 30px 0 var(--dark-opacity-5);\n width: 70px;\n padding: 8px;\n box-sizing: border-box;\n cursor: pointer;\n transition: all .1s ease;\n\n &:is(.active) {\n border-color: var(--primary);\n }\n\n > * {\n display: block;\n width: 100%;\n height: 100%;\n object-fit: contain;\n object-position: center center;\n }\n }\n }\n\n .navigation {\n box-sizing: border-box;\n display: flex;\n justify-content: center;\n align-items: center;\n border-radius: 8px;\n font-family: var(--font-family-sans-serif);\n cursor: pointer;\n transition: all .2s;\n width: 48px;\n height: 48px;\n box-shadow: 0 0 16px 0 white;\n border: 0;\n background-color: white;\n\n svg {\n path {\n stroke: var(--primary);\n }\n }\n\n &:hover {\n box-shadow: 0 0 16px 0 var(--dark-opacity-10);\n }\n }\n }\n"])), devices_1.devices.lg, devices_1.devices.lg, devices_1.devices.lg, devices_1.devices.lg, devices_1.devices.lg, devices_1.devices.lg, devices_1.devices.lg, devices_1.devices.lg);
|
|
13
|
+
exports.BannerStyled = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n max-width: 1050px;\n margin: 0 auto;\n\n .swiper-wrapper {\n align-items: center;\n }\n\n .slick-list {\n border-radius: 0.5rem;\n box-shadow: 0 6px 30px 0 #EAE9F0;\n position: relative;\n overflow: hidden;\n\n @media only screen and ", " {\n background: #f1f1f1;\n }\n }\n .slick-arrow{\n display: none !important;\n }\n\n @media only screen and ", " {\n .slick-active{\n box-shadow: 0 0.375rem 1.875rem 0 #EAE9F0;\n position: relative;\n z-index: 5;\n }\n } \n\n .item {\n padding: 0 5rem;\n display: grid;\n grid-template-columns: 1fr auto;\n align-items: center;\n height: 420px;\n @media only screen and ", " {\n padding: 0;\n display: block;\n height: auto;\n }\n\n .text {\n @media only screen and ", " {\n display: none;\n }\n max-width: 478px;\n\n .title {\n margin-bottom: 1.5rem;\n display: block;\n }\n\n .description {\n margin-top: 0;\n margin-bottom: 1.5rem;\n display: block;\n }\n }\n\n .textMobile {\n display: none;\n background-color: var(--primary-shades-dark);\n padding: 0 1rem;\n color: white;\n align-items: center;\n justify-content: space-between;\n border-radius: 0 0 8px 8px;\n height: 70px;\n svg {\n path {\n stroke: white;\n }\n }\n\n b {\n display: block;\n }\n\n @media only screen and ", " {\n display: flex;\n }\n }\n\n .img {\n text-align: end;\n img {\n display: inline-block !important;\n max-height: 100%;\n max-width: 100%;\n @media only screen and ", " {\n height: auto;\n }\n }\n\n @media only screen and ", " {\n padding: 0;\n text-align: center;\n height: 228px;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: white;\n span {\n height: 174px !important;\n }\n }\n }\n }\n\n .thumbnailSlider {\n margin-top: 3rem;\n display: flex;\n align-items: center;\n justify-content: center;\n @media only screen and ", " {\n display: none;\n }\n\n .thumbnailInner {\n justify-content: center;\n display: flex;\n align-items: center;\n margin: 0 2.5rem;\n\n .thumbnailItem {\n border: 1px solid var(--dark-opacity-10);\n height: 50px;\n border-radius: 0.5rem;\n position: relative;\n overflow: hidden;\n margin: 0 4px;\n box-shadow: 0 6px 30px 0 var(--dark-opacity-5);\n width: 70px;\n padding: 8px;\n box-sizing: border-box;\n cursor: pointer;\n transition: all .1s ease;\n\n &:is(.active) {\n border-color: var(--primary);\n }\n\n > * {\n display: block;\n width: 100%;\n height: 100%;\n object-fit: contain;\n object-position: center center;\n }\n }\n }\n\n .navigation {\n box-sizing: border-box;\n display: flex;\n justify-content: center;\n align-items: center;\n border-radius: 8px;\n font-family: var(--font-family-sans-serif);\n cursor: pointer;\n transition: all .2s;\n width: 48px;\n height: 48px;\n box-shadow: 0 0 16px 0 white;\n border: 0;\n background-color: white;\n\n svg {\n path {\n stroke: var(--primary);\n }\n }\n\n &:hover {\n box-shadow: 0 0 16px 0 var(--dark-opacity-10);\n }\n }\n }\n"], ["\n max-width: 1050px;\n margin: 0 auto;\n\n .swiper-wrapper {\n align-items: center;\n }\n\n .slick-list {\n border-radius: 0.5rem;\n box-shadow: 0 6px 30px 0 #EAE9F0;\n position: relative;\n overflow: hidden;\n\n @media only screen and ", " {\n background: #f1f1f1;\n }\n }\n .slick-arrow{\n display: none !important;\n }\n\n @media only screen and ", " {\n .slick-active{\n box-shadow: 0 0.375rem 1.875rem 0 #EAE9F0;\n position: relative;\n z-index: 5;\n }\n } \n\n .item {\n padding: 0 5rem;\n display: grid;\n grid-template-columns: 1fr auto;\n align-items: center;\n height: 420px;\n @media only screen and ", " {\n padding: 0;\n display: block;\n height: auto;\n }\n\n .text {\n @media only screen and ", " {\n display: none;\n }\n max-width: 478px;\n\n .title {\n margin-bottom: 1.5rem;\n display: block;\n }\n\n .description {\n margin-top: 0;\n margin-bottom: 1.5rem;\n display: block;\n }\n }\n\n .textMobile {\n display: none;\n background-color: var(--primary-shades-dark);\n padding: 0 1rem;\n color: white;\n align-items: center;\n justify-content: space-between;\n border-radius: 0 0 8px 8px;\n height: 70px;\n svg {\n path {\n stroke: white;\n }\n }\n\n b {\n display: block;\n }\n\n @media only screen and ", " {\n display: flex;\n }\n }\n\n .img {\n text-align: end;\n img {\n display: inline-block !important;\n max-height: 100%;\n max-width: 100%;\n @media only screen and ", " {\n height: auto;\n }\n }\n\n @media only screen and ", " {\n padding: 0;\n text-align: center;\n height: 228px;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: white;\n span {\n height: 174px !important;\n }\n }\n }\n }\n\n .thumbnailSlider {\n margin-top: 3rem;\n display: flex;\n align-items: center;\n justify-content: center;\n @media only screen and ", " {\n display: none;\n }\n\n .thumbnailInner {\n justify-content: center;\n display: flex;\n align-items: center;\n margin: 0 2.5rem;\n\n .thumbnailItem {\n border: 1px solid var(--dark-opacity-10);\n height: 50px;\n border-radius: 0.5rem;\n position: relative;\n overflow: hidden;\n margin: 0 4px;\n box-shadow: 0 6px 30px 0 var(--dark-opacity-5);\n width: 70px;\n padding: 8px;\n box-sizing: border-box;\n cursor: pointer;\n transition: all .1s ease;\n\n &:is(.active) {\n border-color: var(--primary);\n }\n\n > * {\n display: block;\n width: 100%;\n height: 100%;\n object-fit: contain;\n object-position: center center;\n }\n }\n }\n\n .navigation {\n box-sizing: border-box;\n display: flex;\n justify-content: center;\n align-items: center;\n border-radius: 8px;\n font-family: var(--font-family-sans-serif);\n cursor: pointer;\n transition: all .2s;\n width: 48px;\n height: 48px;\n box-shadow: 0 0 16px 0 white;\n border: 0;\n background-color: white;\n\n svg {\n path {\n stroke: var(--primary);\n }\n }\n\n &:hover {\n box-shadow: 0 0 16px 0 var(--dark-opacity-10);\n }\n }\n }\n"])), devices_1.devices.lg, devices_1.devices.lg, devices_1.devices.lg, devices_1.devices.lg, devices_1.devices.lg, devices_1.devices.lg, devices_1.devices.lg, devices_1.devices.lg);
|
|
14
14
|
var templateObject_1;
|
|
@@ -35,11 +35,13 @@ var classnames_1 = __importDefault(require("classnames"));
|
|
|
35
35
|
var Toast = function (props) {
|
|
36
36
|
var timer = props.timer, primaryButtonText = props.primaryButtonText, isPrimaryButtonDisabled = props.isPrimaryButtonDisabled, isPrimaryButtonLoading = props.isPrimaryButtonLoading, showPrimaryButton = props.showPrimaryButton, children = props.children, icon = props.icon, show = props.show, setShow = props.setShow, onPrimaryAction = props.onPrimaryAction, title = props.title, other = __rest(props, ["timer", "primaryButtonText", "isPrimaryButtonDisabled", "isPrimaryButtonLoading", "showPrimaryButton", "children", "icon", "show", "setShow", "onPrimaryAction", "title"]);
|
|
37
37
|
(0, react_1.useEffect)(function () {
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
38
|
+
if (show) {
|
|
39
|
+
setTimeout(function () {
|
|
40
|
+
setShow(false);
|
|
41
|
+
document.body.classList.remove('hasToast');
|
|
42
|
+
}, timer);
|
|
43
|
+
document.body.classList.add('hasToast');
|
|
44
|
+
}
|
|
43
45
|
}, [show]);
|
|
44
46
|
return (show &&
|
|
45
47
|
react_dom_1.default.createPortal((0, jsx_runtime_1.jsx)(Toast_styled_1.OverlayStyled, { children: (0, jsx_runtime_1.jsx)(Toast_styled_1.ToastStyled, __assign({}, props, { children: (0, jsx_runtime_1.jsxs)("div", { children: [icon && ((0, jsx_runtime_1.jsx)("div", { className: "icon", children: (0, jsx_runtime_1.jsx)(Icon_1.default, { name: icon, width: "24px", height: "24px" }) })), title && ((0, jsx_runtime_1.jsx)("h5", { className: (0, classnames_1.default)("title", "title-extra-bold-16-19"), children: title })), (0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)("content", "body-regular-14-17"), children: children }), showPrimaryButton && ((0, jsx_runtime_1.jsx)("div", { className: "bottom", children: (0, jsx_runtime_1.jsx)(Button_1.default, { onClick: onPrimaryAction, size: "big", variant: "primary", width: "100%", isLoading: isPrimaryButtonLoading, disabled: isPrimaryButtonDisabled, children: primaryButtonText }) }))] }) })) }), document.body));
|