carbon-react/esm/components/switch/__internal__/switch-slider.style.js

A library of reusable React components for easily building user interfaces.

import o,{css as r}from"styled-components";import i from"../../../__internal__/validations/validation-icon.style.js";import a from"./switch-slider-panel.style.js";const e=o.div.withConfig({displayName:"switch-slider.style__StyledSwitchSlider",componentId:"sc-24751354-0"})(["",""],(({checked:o,isLoading:e,disabled:t,size:n,error:l,warning:c,isDarkBackground:s})=>r(["display:flex;font-size:12px;font-weight:500;height:28px;left:0;letter-spacing:1px;position:relative;text-transform:uppercase;top:0;width:100%;z-index:1;border-radius:var(--borderRadius400);border-style:solid;border-color:",";border-width:var(--borderWidth200);box-sizing:border-box;margin-top:",";align-items:center;&::before{background-color:",';bottom:4px;content:"";height:',";position:absolute;left:4px;transition:margin-left 0.4s;width:",";z-index:1;border-radius:50%;}"," "," "," "," "," ","{position:absolute;right:-30px;height:100%;}"],s?"var(--colorsUtilityYang100)":"var(--colorsActionMinor400)","large"===n?"-47px":"-28px",s?"var(--colorsUtilityYang100)":"var(--colorsActionMinor400)","large"===n?"var(--spacing400)":"var(--spacing200)","large"===n?"var(--spacing400)":"var(--spacing200)",o&&r(["background-color:",";border-color:var(--colorsActionMinorTransparent);&::before{margin-left:calc( 100% - "," );background-color:",";}"],s?"var(--colorsUtilityYang100)":"var(--colorsActionMinor500)","large"===n?"var(--spacing500)":"var(--spacing300)",s?"var(--colorsUtilityYin100)":"var(--colorsActionMinorYang100)"),t&&!e&&r(["border-color:var(--colorsActionDisabled600);&::before{background-color:var(--colorsActionDisabled600);}","{color:var(--colorsUtilityYin030);}",""],a,o&&r(["background-color:var(--colorsActionDisabled500);border-color:var(--colorsActionMinorTransparent);&::before{background-color:var(--colorsActionMinorYang100);}","{color:var(--colorsUtilityYin030);}"],a)),e&&r(["&::before{display:none;}"]),c&&!t&&r(["border-color:var(--colorsSemanticCaution500);"]),l&&!t&&r(["border-color:var(--colorsSemanticNegative500);"]),i))),t=o.div.withConfig({displayName:"switch-slider.style__HiddenContent",componentId:"sc-24751354-1"})(["",""],(({size:o})=>r(["visibility:hidden;height:0px;padding-left:",";"],"large"===o?"var(--spacing700)":"var(--spacing500)")));export{t as HiddenContent,e as StyledSwitchSlider,e as default};