@useloops/design-system
Version:
The official React based Loops design system
2 lines (1 loc) • 957 B
JavaScript
import{styled as t,containerClasses as a,Stack as n,Box as i}from"@mui/material";import o from"../Button/Button.js";import e from"../ColorBackgroundContainer/ColorBackgroundContainer.js";const r=t(e)(({theme:t})=>({[`&.${a.root} `]:{padding:t.spacing(t.custom.padding.xl),borderRadius:t.spacing(t.custom.radius.xl),flexDirection:"column",gap:t.spacing(t.custom.padding.xl),display:"flex",textAlign:"center",alignItems:"center",width:"100%",[t.breakpoints.up("lgNav")]:{flexDirection:"row",textAlign:"left"},[t.breakpoints.down("md")]:{padding:t.spacing(t.custom.padding.lg)}}})),d=t(n)(({theme:t})=>({alignItems:"start",gap:t.spacing(t.custom.padding.md),flex:"1 0 0",[t.breakpoints.down("lgNav")]:{alignItems:"center"}})),l=t(i)(({theme:t})=>({flex:"1 0 0",display:"flex",maxWidth:"256px",width:"100%",[t.breakpoints.down("lg")]:{maxWidth:"480px"}})),p={TrialCard:r,Top:d,CtaButton:t(o)(({theme:t})=>({flex:1})),CtaButtonContainer:l};export{p as default};