dap-design-system/dist/components/toggle-button/_styles/toggle-button.scss.js

Official design system for the DÁP (dap.gov.hu)

const t = ":host{display:inline-block;--dds-toggle-button-min-width-lg: var(--dds-spacing-2400);--dds-toggle-button-min-width-md: var(--dds-spacing-2000);--dds-toggle-button-min-width-sm: var(--dds-spacing-1200);--dds-toggle-button-min-width-xs: var(--dds-spacing-1200);--dds-toggle-button-height-lg: var(--dds-spacing-1200);--dds-toggle-button-height-md: var(--dds-spacing-1000);--dds-toggle-button-height-sm: var(--dds-spacing-800);--dds-toggle-button-height-xs: var(--dds-spacing-600);--dds-toggle-button-padding-lg: var(--dds-spacing-300) var(--dds-spacing-400);--dds-toggle-button-padding-md: var(--dds-spacing-300);--dds-toggle-button-padding-sm: var(--dds-spacing-200);--dds-toggle-button-padding-xs: var(--dds-spacing-150) var(--dds-spacing-200);--dds-toggle-button-font-size-lg: 1.125rem;--dds-toggle-button-font-size-md: 1rem;--dds-toggle-button-font-size-sm: .875rem;--dds-toggle-button-font-size-xs: var(--dds-font-xs);--dds-toggle-button-border-enabled: var(--dds-button-toggle-border-enabled);--dds-toggle-button-background-enabled: var( --dds-button-toggle-background-enabled );--dds-toggle-button-content-enabled: var(--dds-button-toggle-content-enabled);--dds-toggle-button-border-hover: var(--dds-button-toggle-border-hover);--dds-toggle-button-background-hover: var( --dds-button-toggle-background-hover );--dds-toggle-button-border-pressed: var(--dds-button-toggle-border-pressed);--dds-toggle-button-background-pressed: var( --dds-button-toggle-background-pressed );--dds-toggle-button-background-selected-enabled: var( --dds-button-toggle-background-selected-enabled );--dds-toggle-button-content-selected-enabled: var( --dds-button-toggle-content-selected-enabled );--dds-toggle-button-background-selected-hover: var( --dds-button-toggle-background-selected-hover );--dds-toggle-button-background-selected-pressed: var( --dds-button-toggle-background-selected-pressed );--dds-toggle-button-border-disabled: var(--dds-button-toggle-border-disabled);--dds-toggle-button-background-disabled: var( --dds-button-toggle-background-disabled );--dds-toggle-button-content-disabled: var( --dds-button-toggle-content-disabled );--dds-toggle-button-highcontrast-border: var( --dds-border-neutral-transparent-interactive, #fff500 );--dds-toggle-button-highcontrast-border-hover: var( --dds-border-neutral-transparent-interactive, #fff500 )}.toggle-button{outline-color:var(--dds-focus-outer-ring);outline-offset:var(--dds-spacing-50);outline-width:var(--dds-border-width-large);transition-property:all;transition-duration:var(--dds-transition-fast);transition-timing-function:var(--dds-easing-ease-in-out);display:inline-flex;position:relative;flex-direction:row;align-items:center;justify-content:center;width:auto;column-gap:var(--dds-spacing-100);border:var(--dds-border-width-large) solid var(--dds-toggle-button-border-enabled);border-radius:var(--dds-radius-rounded);background-color:var(--dds-toggle-button-background-enabled);color:var(--dds-toggle-button-content-enabled);font-weight:700;line-height:var(--dds-font-line-height-large);cursor:pointer}.toggle-button:hover{border-color:var(--dds-toggle-button-border-hover);background-color:var(--dds-toggle-button-background-hover)}.toggle-button:active{border-color:var(--dds-toggle-button-border-pressed);background-color:var(--dds-toggle-button-background-pressed)}.toggle-button:focus-visible{outline-style:solid}.toggle-button .button__text{padding:0 var(--dds-spacing-100)}.toggle-button .button__text span{line-height:var(--dds-font-line-height-large)}.toggle-button[aria-pressed=true],.toggle-button--active{background-color:var(--dds-toggle-button-background-selected-enabled);color:var(--dds-toggle-button-content-selected-enabled)}.toggle-button[aria-pressed=true]:hover,.toggle-button--active:hover{background-color:var(--dds-toggle-button-background-selected-hover)}.toggle-button[aria-pressed=true]:active,.toggle-button--active:active{background-color:var(--dds-toggle-button-background-selected-pressed)}.toggle-button[aria-pressed=true]:focus-visible,.toggle-button--active:focus-visible{outline-style:solid}.toggle-button[disabled]{border:var(--dds-border-width-large) solid var(--dds-toggle-button-border-disabled);background-color:var(--dds-toggle-button-background-disabled);color:var(--dds-toggle-button-content-disabled);cursor:not-allowed}.toggle-button[disabled]:focus-visible{outline-style:solid}.toggle-button[disabled]>*{pointer-events:none}.toggle-button--lg{min-width:var(--dds-toggle-button-min-width-lg);height:var(--dds-toggle-button-height-lg);padding:var(--dds-toggle-button-padding-lg);font-size:var(--dds-toggle-button-font-size-lg)}.toggle-button--lg.dds-toggle-button--circle,.toggle-button--lg.toggle-button--circle{width:var(--dds-toggle-button-height-lg);min-width:0;height:var(--dds-toggle-button-height-lg);padding:0}.toggle-button--md{min-width:var(--dds-toggle-button-min-width-md);height:var(--dds-toggle-button-height-md);padding:var(--dds-toggle-button-padding-md);font-size:var(--dds-toggle-button-font-size-md)}.toggle-button--md.dds-toggle-button--circle,.toggle-button--md.toggle-button--circle{width:var(--dds-toggle-button-height-md);min-width:0;max-width:var(--dds-toggle-button-height-md);height:var(--dds-toggle-button-height-md);padding:0}.toggle-button--sm{min-width:var(--dds-toggle-button-min-width-sm);height:var(--dds-toggle-button-height-sm);padding:var(--dds-toggle-button-padding-sm);font-size:var(--dds-toggle-button-font-size-sm)}.toggle-button--sm.dds-toggle-button--circle,.toggle-button--sm.toggle-button--circle{width:var(--dds-toggle-button-height-sm);min-width:0;max-width:var(--dds-toggle-button-height-sm);height:var(--dds-toggle-button-height-sm);padding:3px}.toggle-button--xs{min-width:var(--dds-toggle-button-min-width-xs);height:var(--dds-toggle-button-height-xs);padding:var(--dds-toggle-button-padding-xs);font-size:var(--dds-toggle-button-font-size-xs)}.toggle-button--xs.dds-toggle-button--circle,.toggle-button--xs.toggle-button--circle{width:var(--dds-toggle-button-height-xs);min-width:0;max-width:var(--dds-toggle-button-height-xs);height:var(--dds-toggle-button-height-xs);padding:3px}.toggle-button__highcontrast{position:absolute;width:100%;height:100%;border:var(--dds-border-width-base) solid var(--dds-toggle-button-highcontrast-border);border-radius:var(--dds-radius-rounded)}.toggle-button__highcontrast:hover{border-width:var(--dds-border-width-large);border-color:var(--dds-toggle-button-highcontrast-border-hover)}.toggle-button__highcontrast:active{border-width:var(--dds-border-width-xlarge)}";
export {
  t as default
};
//# sourceMappingURL=toggle-button.scss.js.map