suomifi-ui-components/dist/esm/core/Expander/ExpanderGroup/ExpanderGroup.baseStyles.js

Suomi.fi UI component library

import { __makeTemplateObject } from 'tslib';
import { css } from 'styled-components';
import { element, font } from '../../theme/reset/index.js';
import { buildSpacingCSS } from '../../theme/utils/spacing.js';

var baseStyles = function baseStyles(theme, globalMargins, propMargins) {
  return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  ", "\n  ", "\n  ", "\n  width: 100%;\n  max-width: 100%;\n\n  &.fi-expander-group {\n    display: flex;\n    flex-direction: column;\n  }\n  & > .fi-expander-group_expanders {\n    flex: none;\n\n    & .fi-expander {\n      margin-top: 0;\n      margin-bottom: 0;\n      border-radius: 0;\n      transition: margin ", ";\n\n      & > {\n        border-radius: 0;\n      }\n      &:first-child {\n        border-radius: ", " ", " 0 0;\n      }\n      &:last-child {\n        border-bottom-left-radius: ", ";\n        border-bottom-right-radius: ", ";\n      }\n      &:not(:first-child) {\n        border-top: none;\n      }\n\n      &.fi-expander--open {\n        border-top: 1px solid ", ";\n        border-radius: ", ";\n        & + .fi-expander {\n          border-top: 1px solid ", ";\n        }\n        &:not(:first-of-type) {\n          margin-top: ", ";\n        }\n        &:not(:last-of-type) {\n          margin-bottom: ", ";\n        }\n      }\n    }\n  }\n\n  & > .fi-expander-group_all-button {\n    ", "\n    ", "\n    flex: 1 1 auto;\n    align-self: flex-end;\n    margin-left: auto;\n    margin-bottom: ", ";\n    padding: ", " 0;\n    color: ", ";\n    border-radius: ", ";\n    border: none;\n    cursor: pointer;\n\n    &:focus {\n      ", "\n      position: relative;\n\n      &:after {\n        ", "\n      }\n    }\n    ", "\n  }\n"], ["\n  ", "\n  ", "\n  ", "\n  width: 100%;\n  max-width: 100%;\n\n  &.fi-expander-group {\n    display: flex;\n    flex-direction: column;\n  }\n  & > .fi-expander-group_expanders {\n    flex: none;\n\n    & .fi-expander {\n      margin-top: 0;\n      margin-bottom: 0;\n      border-radius: 0;\n      transition: margin ", ";\n\n      & > {\n        border-radius: 0;\n      }\n      &:first-child {\n        border-radius: ", " ", " 0 0;\n      }\n      &:last-child {\n        border-bottom-left-radius: ", ";\n        border-bottom-right-radius: ", ";\n      }\n      &:not(:first-child) {\n        border-top: none;\n      }\n\n      &.fi-expander--open {\n        border-top: 1px solid ", ";\n        border-radius: ", ";\n        & + .fi-expander {\n          border-top: 1px solid ", ";\n        }\n        &:not(:first-of-type) {\n          margin-top: ", ";\n        }\n        &:not(:last-of-type) {\n          margin-bottom: ", ";\n        }\n      }\n    }\n  }\n\n  & > .fi-expander-group_all-button {\n    ", "\n    ", "\n    flex: 1 1 auto;\n    align-self: flex-end;\n    margin-left: auto;\n    margin-bottom: ", ";\n    padding: ", " 0;\n    color: ", ";\n    border-radius: ", ";\n    border: none;\n    cursor: pointer;\n\n    &:focus {\n      ", "\n      position: relative;\n\n      &:after {\n        ", "\n      }\n    }\n    ", "\n  }\n"])), element(theme), buildSpacingCSS(globalMargins), buildSpacingCSS(propMargins, true), "".concat(theme.transitions.basicTime, "\n        ").concat(theme.transitions.basicTimingFunction), theme.radiuses.basic, theme.radiuses.basic, theme.radiuses.basic, theme.radiuses.basic, theme.colors.highlightBase, theme.radiuses.basic, theme.colors.highlightBase, theme.spacing.insetXl, theme.spacing.insetXl, element(theme), font(theme)('actionElementInnerTextBold'), theme.spacing.insetM, theme.spacing.insetXs, theme.colors.highlightBase, theme.radiuses.basic, theme.focuses.highContrastFocus, theme.focuses.absoluteFocus, theme.focuses.noMouseFocus);
};
var templateObject_1;

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