carbon-react
Version:
A library of reusable React components for easily building user interfaces.
2 lines (1 loc) • 3.05 kB
JavaScript
import e,{css as t}from"styled-components";import{padding as o}from"styled-system";import n from"../../style/utils/add-focus-styling.js";import i from"../../style/themes/apply-base-theme.js";import r from"../icon/icon.style.js";import a from"../icon/icon.component.js";import l from"../box/box.style.js";const d=e.ul.withConfig({displayName:"vertical-menu.style__StyledList",componentId:"sc-3e966cd0-0"})(["list-style:none;margin:0;padding:0;"]),s=e.div.attrs(i).withConfig({displayName:"vertical-menu.style__StyledVerticalMenuItem",componentId:"sc-3e966cd0-1"})(["min-height:",";width:100%;display:flex;border:none;align-items:center;font-weight:500;font-size:14px;cursor:pointer;color:var(--colorsComponentsLeftnavWinterStandardContent);position:relative;box-sizing:border-box;text-decoration:none;background-color:var(--colorsComponentsLeftnavWinterStandardBackground);"," &:hover{background-color:var(--colorsComponentsLeftnavWinterStandardHover);}&:focus{","}"," ","{width:20px;}"],(({height:e})=>e),o,n(!0),(({active:e})=>e&&t(['&:before{background:var(--colorsComponentsLeftnavWinterStandardSelected);border-radius:var(--borderRadius100);content:"";height:calc(100% - 16px);left:24px;position:absolute;top:8px;width:calc(100% - 48px);z-index:0;}&:hover{&:before{background:var(--colorsComponentsLeftnavWinterStandardHover);}}'])),r),c=e.h3.withConfig({displayName:"vertical-menu.style__StyledTitle",componentId:"sc-3e966cd0-2"})(["font-weight:500;font-size:14px;line-height:21px;margin:0;z-index:1;text-align:left;"]),p=e.div.withConfig({displayName:"vertical-menu.style__StyledAdornment",componentId:"sc-3e966cd0-3"})(["display:flex;align-items:center;justify-content:flex-end;flex:1;"]),m=e(a).withConfig({displayName:"vertical-menu.style__StyledTitleIcon",componentId:"sc-3e966cd0-4"})(["margin-right:12px;width:20px;color:var(--colorsComponentsLeftnavWinterStandardContent);"]),f=e(a).withConfig({displayName:"vertical-menu.style__StyledChevronIcon",componentId:"sc-3e966cd0-5"})(["margin-left:auto;padding-left:12px;width:20px;color:var(--colorsComponentsLeftnavWinterStandardContent);"]),v=e(l).withConfig({displayName:"vertical-menu.style__StyledVerticalMenu",componentId:"sc-3e966cd0-6"})(["&::-webkit-scrollbar{width:12px;}"]),y=e(l).withConfig({displayName:"vertical-menu.style__StyledVerticalMenuFullScreen",componentId:"sc-3e966cd0-7"})(["position:fixed;top:0;bottom:0;height:100vh;width:100%;outline:none;padding:8px 0px;overflow:auto;background-color:var(--colorsComponentsLeftnavWinterStandardBackground);box-sizing:border-box;z-index:",";"," "," "," &::-webkit-scrollbar{width:12px;}"],(({theme:e})=>e.zIndex.fullScreenModal),(({prefersReducedMotion:e})=>!e&&t(["transition:all 0.3s ease;"])),(({isOpen:e})=>e&&t(["visibility:visible;transform:translateX(0);"])),(({isOpen:e})=>!e&&t(["transform:translateX(-100%);visibility:hidden;"])));export{p as StyledAdornment,f as StyledChevronIcon,d as StyledList,c as StyledTitle,m as StyledTitleIcon,v as StyledVerticalMenu,y as StyledVerticalMenuFullScreen,s as StyledVerticalMenuItem};