@guruhotel/aura-ui/esm/checkbox/checkbox.styles.js

⚛️ React UI library by GuruHotel

import{styled as o}from"../theme";import*as e from"@radix-ui/react-checkbox";export const StyledCheckbox=o(e.Root,{all:"unset",backgroundColor:"$guru9",display:"flex",alignItems:"center",justifyContent:"center",borderRadius:"$sm",border:"solid",borderWidth:"2px",borderColor:"$colors$guru9",transition:".2s ease",'&[data-state="unchecked"]':{backgroundColor:"$surfaceLight"},_disabled:{opacity:.5,cursor:"no-drop"},_focusVisible:{borderColor:"$colors$guru7",boxShadow:"0 0 0 1px $colors$surfaceLight, 0 0 0 3px $colors$guru12"},variants:{size:{xs:{size:"$4",fontSize:"$xs"},sm:{size:"$5",fontSize:"$sm"},md:{size:"$6",fontSize:"$md"},lg:{size:"$7",fontSize:"$lg"},xl:{size:"$8",fontSize:"$xl"}}},defaultVariants:{size:"xs"}});export const StyledIndicator=o(e.Indicator,{display:"flex",alignItems:"center",justifyContent:"center",position:"relative",color:"$surfaceLight"});