suomifi-ui-components/dist/esm/core/Form/Toggle/ToggleBase/ToggleIcon.baseStyles.js

Suomi.fi UI component library

import { __makeTemplateObject } from 'tslib';
import { css } from 'styled-components';
import { iconWidth, iconHeight } from './Toggle.baseStyles.js';

var baseStyles = function baseStyles(theme) {
  return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  width: ", ";\n  height: ", ";\n  vertical-align: bottom;\n  overflow: visible;\n  & .fi-icon-toggle-base {\n    stroke: ", ";\n    fill: ", ";\n  }\n  & .fi-icon-toggle-knob {\n    fill: ", ";\n    transform: translateX(-17px);\n  }\n  & .fi-icon-toggle-checkmark {\n    fill: none;\n  }\n  &.fi-toggle_icon--checked {\n    & .fi-icon-toggle-base {\n      stroke: ", ";\n    }\n    & .fi-icon-toggle-knob {\n      fill: ", ";\n      transform: translateX(0px);\n    }\n    & .fi-icon-toggle-checkmark {\n      fill: ", ";\n    }\n  }\n\n  &.fi-toggle_icon--disabled {\n    & .fi-icon-toggle-base {\n      stroke: ", ";\n      fill: ", ";\n    }\n    & .fi-icon-toggle-knob {\n      fill: ", ";\n    }\n    & .fi-icon-toggle-checkmark {\n      fill: none;\n    }\n  }\n\n  &.fi-toggle_icon--checked.fi-toggle_icon--disabled {\n    & .fi-icon-toggle-checkmark {\n      fill: ", ";\n    }\n  }\n"], ["\n  width: ", ";\n  height: ", ";\n  vertical-align: bottom;\n  overflow: visible;\n  & .fi-icon-toggle-base {\n    stroke: ", ";\n    fill: ", ";\n  }\n  & .fi-icon-toggle-knob {\n    fill: ", ";\n    transform: translateX(-17px);\n  }\n  & .fi-icon-toggle-checkmark {\n    fill: none;\n  }\n  &.fi-toggle_icon--checked {\n    & .fi-icon-toggle-base {\n      stroke: ", ";\n    }\n    & .fi-icon-toggle-knob {\n      fill: ", ";\n      transform: translateX(0px);\n    }\n    & .fi-icon-toggle-checkmark {\n      fill: ", ";\n    }\n  }\n\n  &.fi-toggle_icon--disabled {\n    & .fi-icon-toggle-base {\n      stroke: ", ";\n      fill: ", ";\n    }\n    & .fi-icon-toggle-knob {\n      fill: ", ";\n    }\n    & .fi-icon-toggle-checkmark {\n      fill: none;\n    }\n  }\n\n  &.fi-toggle_icon--checked.fi-toggle_icon--disabled {\n    & .fi-icon-toggle-checkmark {\n      fill: ", ";\n    }\n  }\n"])), iconWidth, iconHeight, theme.colors.depthDark3, theme.colors.whiteBase, theme.colors.depthDark2, theme.colors.depthDark3, theme.colors.successBase, theme.colors.whiteBase, theme.colors.depthLight1, theme.colors.depthLight3, theme.colors.depthLight1, theme.colors.whiteBase);
};
var templateObject_1;

export { baseStyles };
//# sourceMappingURL=ToggleIcon.baseStyles.js.map