krl-alfred 2.18.7 → 2.18.9
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.
|
@@ -13,5 +13,5 @@ var styled_components_1 = __importDefault(require("styled-components"));
|
|
|
13
13
|
var devices_1 = require("../../../../constants/devices");
|
|
14
14
|
var svgToBase64_1 = __importDefault(require("./../../../../utils/svgToBase64"));
|
|
15
15
|
var Icon_1 = __importDefault(require("../../../Icon/Icon"));
|
|
16
|
-
exports.HorizontalBoxStyled = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: block;\n > label {\n display: flex;\n width: 100%;\n align-items: center;\n justify-content: center;\n border: ", ";\n border-radius: 0.5rem;\n height: 67px;\n cursor: ", ";\n background-color: ", ";\n ", "\n .inner {\n width: 100%;\n padding: 0 1.5rem;\n display: flex;\n align-items: center;\n justify-content: space-between;\n @media only screen and ", " {\n padding: 0 1rem;\n }\n .leftContent {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n flex: 0 0 auto;\n width: auto;\n position: relative;\n \n input[type=\"radio\"] {\n height: 0;\n width: 0;\n opacity: 0;\n z-index: -1;\n position: absolute;\n\n &:checked ~ .indicator {\n background-image: url('", "');\n }\n ", "\n }\n\n div.indicator {\n flex: 0 0 auto;\n background-image: url('", "');\n background-size: 100% 100%;\n display: block;\n position: relative;\n margin: 0 ", " 0 0;\n width: 16px;\n height: 16px;\n\n &:disabled {\n cursor: not-allowed;\n }\n }\n \n .labelContent {\n display: grid;\n align-items: center;\n justify-content: flex-start;\n }\n \n .labelWrapper{\n display: flex;\n align-items: center;\n justify-content: flex-start;\n font: var(--body-semi-bold-14-17);\n @media only screen and ", " {\n display: block;\n }\n }\n .badgesWrapper {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n margin-left: 1rem;\n }\n \n .description {\n color: var(--dark-opacity-50);\n font: var(--body-semi-bold-13-16);\n margin-top: 2px;\n margin-bottom: 0;\n width: 100%;\n display: block;\n }\n }\n .rightContent {\n flex: 0 0 auto;\n width: auto;\n text-align: end;\n row-gap: 0.25rem;\n display: grid;\n .price {\n color: var(--dark);\n font: var(--title-bold-16-19);\n }\n .totalPrice {\n display: block;\n color: var(--dark-opacity-50);\n font: var(--caption-semi-bold-12-15);\n .total {\n @media only screen and ", " {\n display: none;\n }\n }\n }\n }\n }\n }\n"], ["\n display: block;\n > label {\n display: flex;\n width: 100%;\n align-items: center;\n justify-content: center;\n border: ", ";\n border-radius: 0.5rem;\n height: 67px;\n cursor: ", ";\n background-color: ", ";\n ", "\n .inner {\n width: 100%;\n padding: 0 1.5rem;\n display: flex;\n align-items: center;\n justify-content: space-between;\n @media only screen and ", " {\n padding: 0 1rem;\n }\n .leftContent {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n flex: 0 0 auto;\n width: auto;\n position: relative;\n \n input[type=\"radio\"] {\n height: 0;\n width: 0;\n opacity: 0;\n z-index: -1;\n position: absolute;\n\n &:checked ~ .indicator {\n background-image: url('", "');\n }\n ", "\n }\n\n div.indicator {\n flex: 0 0 auto;\n background-image: url('", "');\n background-size: 100% 100%;\n display: block;\n position: relative;\n margin: 0 ", " 0 0;\n width: 16px;\n height: 16px;\n\n &:disabled {\n cursor: not-allowed;\n }\n }\n \n .labelContent {\n display: grid;\n align-items: center;\n justify-content: flex-start;\n }\n \n .labelWrapper{\n display: flex;\n align-items: center;\n justify-content: flex-start;\n font: var(--body-semi-bold-14-17);\n @media only screen and ", " {\n display: block;\n }\n }\n .badgesWrapper {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n margin-left: 1rem;\n }\n \n .description {\n color: var(--dark-opacity-50);\n font: var(--body-semi-bold-13-16);\n margin-top: 2px;\n margin-bottom: 0;\n width: 100%;\n display: block;\n }\n }\n .rightContent {\n flex: 0 0 auto;\n width: auto;\n text-align: end;\n row-gap: 0.25rem;\n display: grid;\n .price {\n color: var(--dark);\n font: var(--title-bold-16-19);\n }\n .totalPrice {\n display: block;\n color: var(--dark-opacity-50);\n font: var(--caption-semi-bold-12-15);\n .total {\n @media only screen and ", " {\n display: none;\n }\n }\n }\n }\n }\n }\n"])), function (props) { return props.$disabled ? 'var(--grey-10)' : props.checked ? '2px solid var(--primary)' : '1px solid var(--dark-opacity-10)'; }, function (props) { return props.$disabled ? 'not-allowed' : 'pointer'; }, function (props) { return props.$disabled ? 'var(--dark-opacity-3)' : 'white'; }, function (props) { return !props.checked && !props.$disabled && "\n &:hover{\n
|
|
16
|
+
exports.HorizontalBoxStyled = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: block;\n > label {\n display: flex;\n width: 100%;\n align-items: center;\n justify-content: center;\n border: ", ";\n border-radius: 0.5rem;\n height: 67px;\n cursor: ", ";\n background-color: ", ";\n ", "\n .inner {\n width: 100%;\n padding: 0 1.5rem;\n display: flex;\n align-items: center;\n justify-content: space-between;\n @media only screen and ", " {\n padding: 0 1rem;\n }\n .leftContent {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n flex: 0 0 auto;\n width: auto;\n position: relative;\n \n input[type=\"radio\"] {\n height: 0;\n width: 0;\n opacity: 0;\n z-index: -1;\n position: absolute;\n\n &:checked ~ .indicator {\n background-image: url('", "');\n }\n ", "\n }\n\n div.indicator {\n flex: 0 0 auto;\n background-image: url('", "');\n background-size: 100% 100%;\n display: block;\n position: relative;\n margin: 0 ", " 0 0;\n width: 16px;\n height: 16px;\n\n &:disabled {\n cursor: not-allowed;\n }\n }\n \n .labelContent {\n display: grid;\n align-items: center;\n justify-content: flex-start;\n }\n \n .labelWrapper{\n display: flex;\n align-items: center;\n justify-content: flex-start;\n font: var(--body-semi-bold-14-17);\n @media only screen and ", " {\n display: block;\n }\n }\n .badgesWrapper {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n margin-left: 1rem;\n }\n \n .description {\n color: var(--dark-opacity-50);\n font: var(--body-semi-bold-13-16);\n margin-top: 2px;\n margin-bottom: 0;\n width: 100%;\n display: block;\n }\n }\n .rightContent {\n flex: 0 0 auto;\n width: auto;\n text-align: end;\n row-gap: 0.25rem;\n display: grid;\n .price {\n color: var(--dark);\n font: var(--title-bold-16-19);\n }\n .totalPrice {\n display: block;\n color: var(--dark-opacity-50);\n font: var(--caption-semi-bold-12-15);\n .total {\n @media only screen and ", " {\n display: none;\n }\n }\n }\n }\n }\n }\n"], ["\n display: block;\n > label {\n display: flex;\n width: 100%;\n align-items: center;\n justify-content: center;\n border: ", ";\n border-radius: 0.5rem;\n height: 67px;\n cursor: ", ";\n background-color: ", ";\n ", "\n .inner {\n width: 100%;\n padding: 0 1.5rem;\n display: flex;\n align-items: center;\n justify-content: space-between;\n @media only screen and ", " {\n padding: 0 1rem;\n }\n .leftContent {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n flex: 0 0 auto;\n width: auto;\n position: relative;\n \n input[type=\"radio\"] {\n height: 0;\n width: 0;\n opacity: 0;\n z-index: -1;\n position: absolute;\n\n &:checked ~ .indicator {\n background-image: url('", "');\n }\n ", "\n }\n\n div.indicator {\n flex: 0 0 auto;\n background-image: url('", "');\n background-size: 100% 100%;\n display: block;\n position: relative;\n margin: 0 ", " 0 0;\n width: 16px;\n height: 16px;\n\n &:disabled {\n cursor: not-allowed;\n }\n }\n \n .labelContent {\n display: grid;\n align-items: center;\n justify-content: flex-start;\n }\n \n .labelWrapper{\n display: flex;\n align-items: center;\n justify-content: flex-start;\n font: var(--body-semi-bold-14-17);\n @media only screen and ", " {\n display: block;\n }\n }\n .badgesWrapper {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n margin-left: 1rem;\n }\n \n .description {\n color: var(--dark-opacity-50);\n font: var(--body-semi-bold-13-16);\n margin-top: 2px;\n margin-bottom: 0;\n width: 100%;\n display: block;\n }\n }\n .rightContent {\n flex: 0 0 auto;\n width: auto;\n text-align: end;\n row-gap: 0.25rem;\n display: grid;\n .price {\n color: var(--dark);\n font: var(--title-bold-16-19);\n }\n .totalPrice {\n display: block;\n color: var(--dark-opacity-50);\n font: var(--caption-semi-bold-12-15);\n .total {\n @media only screen and ", " {\n display: none;\n }\n }\n }\n }\n }\n }\n"])), function (props) { return props.$disabled ? 'var(--grey-10)' : props.checked ? '2px solid var(--primary)' : '1px solid var(--dark-opacity-10)'; }, function (props) { return props.$disabled ? 'not-allowed' : 'pointer'; }, function (props) { return props.$disabled ? 'var(--dark-opacity-3)' : 'white'; }, function (props) { return !props.checked && !props.$disabled && "\n @media only screen and ".concat(devices_1.devices.lgUp, " {\n &:hover{\n border: 1px solid var(--primary);\n }\n }\n "); }, devices_1.devices.sm, function (props) { return (0, svgToBase64_1.default)((0, jsx_runtime_1.jsx)(Icon_1.default, { hasWrapper: false, color: props.$color || "#9763F6", name: "RadioButtonElementChecked" })); }, function (props) { return props.$disabled ? "\n pointer-events: none;\n user-select:none;\n " : ""; }, function (props) { return props.$disabled ? (0, svgToBase64_1.default)((0, jsx_runtime_1.jsx)(Icon_1.default, { hasWrapper: false, color: "#C2C3CE", name: "RadioButtonElementDisabled" })) : (props.$valid ? (0, svgToBase64_1.default)((0, jsx_runtime_1.jsx)(Icon_1.default, { hasWrapper: false, color: "#9763F6", name: "RadioButtonElementUnchecked" })) : (0, svgToBase64_1.default)((0, jsx_runtime_1.jsx)(Icon_1.default, { hasWrapper: false, color: "#FF1F1F", name: "RadioButtonElementInvalid" }))); }, function (props) { return props.$labelOffset || "0.5rem"; }, devices_1.devices.sm, devices_1.devices.sm);
|
|
17
17
|
var templateObject_1;
|