suomifi-ui-components
Version:
Suomi.fi UI component library
38 lines (35 loc) • 3.71 kB
JavaScript
import { __makeTemplateObject } from 'tslib';
import { css } from 'styled-components';
var element = function element(theme) {
return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n color: ", ";\n"], ["\n color: ", ";\n"])), theme.colors.blackBase);
};
var fontBase = css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n letter-spacing: 0;\n text-decoration: none;\n word-break: break-word;\n overflow-wrap: break-word;\n -webkit-font-smoothing: antialiased;\n"], ["\n letter-spacing: 0;\n text-decoration: none;\n word-break: break-word;\n overflow-wrap: break-word;\n -webkit-font-smoothing: antialiased;\n"])));
var font = function font(theme) {
return function (typographyToken) {
return css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n ", "\n ", "\n "], ["\n ", "\n ", "\n "])), fontBase, theme.typography[typographyToken]);
};
};
var input = function input(theme) {
return css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n ", "\n ", "\n min-width: 245px;\n max-width: 100%;\n padding: ", " ", ";\n border: 1px solid ", ";\n border-radius: ", ";\n line-height: 1;\n"], ["\n ", "\n ", "\n min-width: 245px;\n max-width: 100%;\n padding: ", " ", ";\n border: 1px solid ", ";\n border-radius: ", ";\n line-height: 1;\n"])), element(theme), font(theme)('actionElementInnerText'), theme.spacing.insetM, theme.spacing.insetXl, theme.colors.depthLight1, theme.radiuses.basic);
};
var containerIEFocus = function containerIEFocus(theme) {
return css(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n > input:focus {\n /* For IE/Edge */\n outline-color: ", ";\n outline-width: 2px;\n outline-offset: 2px;\n outline-style: solid;\n }\n &:focus-within {\n > input:focus {\n outline: none;\n }\n }\n"], ["\n > input:focus {\n /* For IE/Edge */\n outline-color: ", ";\n outline-width: 2px;\n outline-offset: 2px;\n outline-style: solid;\n }\n &:focus-within {\n > input:focus {\n outline: none;\n }\n }\n"])), theme.colors.accentSecondary);
};
var fixInternalMargins = function fixInternalMargins() {
return css(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n & .fi-label,\n & .fi-hint-text,\n & .fi-status-text {\n margin: 0;\n }\n"], ["\n & .fi-label,\n & .fi-hint-text,\n & .fi-status-text {\n margin: 0;\n }\n"])));
};
var button = function button(theme) {
return css(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n ", "\n ", "\n font-size: 14px;\n line-height: 20px;\n"], ["\n ", "\n ", "\n font-size: 14px;\n line-height: 20px;\n"])), element(theme), font(theme)('actionElementInnerTextBold'));
};
var nav = function nav(theme) {
return css(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n ", "\n display: block;\n"], ["\n ", "\n display: block;\n"])), element(theme));
};
var list = function list(theme) {
return css(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n ", "\n list-style: none;\n"], ["\n ", "\n list-style: none;\n"])), element(theme));
};
var listItem = function listItem(theme) {
return css(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n ", "\n list-style: none;\n"], ["\n ", "\n list-style: none;\n"])), element(theme));
};
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_8, templateObject_9, templateObject_10, templateObject_11;
export { button, containerIEFocus, element, fixInternalMargins, font, input, list, listItem, nav };
//# sourceMappingURL=index.js.map