@useloops/design-system
Version:
The official React based Loops design system
2 lines (1 loc) • 1.89 kB
JavaScript
;var e=require("@mui/material");const t=e=>`linear-gradient(135deg, ${e.custom.palette.blue[400]} 0%, ${e.custom.palette.purple[600]} 100%)`;exports.tone1=e=>`linear-gradient(135deg, ${e.custom.palette.purple[400]} 0%, ${e.custom.palette.purple[200]} 100%)`,exports.tone2=e=>`linear-gradient(135deg, ${e.custom.palette.purple[0]} 0%, ${e.custom.palette.purple[100]} 100%)`,exports.tone3=t,exports.tone3_ai_icon=e=>({color:"transparent",background:t(e),maskImage:"url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8.75 3c.207 0 .375.168.375.375a3 3 0 003 3 .375.375 0 010 .75 3 3 0 00-3 3 .375.375 0 01-.75 0 3 3 0 00-3-3 .375.375 0 110-.75 3 3 0 003-3c0-.207.168-.375.375-.375zM15.875 7.875a.375.375 0 00-.75 0c0 2.9-2.35 5.25-5.25 5.25a.375.375 0 000 .75c2.9 0 5.25 2.35 5.25 5.25a.375.375 0 00.75 0c0-2.9 2.35-5.25 5.25-5.25a.375.375 0 000-.75 5.25 5.25 0 01-5.25-5.25zM6.125 13.875a.375.375 0 00-.75 0 3 3 0 01-3 3 .375.375 0 000 .75 3 3 0 013 3 .375.375 0 00.75 0 3 3 0 013-3 .375.375 0 000-.75 3 3 0 01-3-3z'/%3E%3C/svg%3E\")",maskSize:"contain",maskRepeat:"no-repeat",maskPosition:"center"}),exports.tone3_border=(e,a=1,r)=>{const o=r??e.custom.palette.surface.default;return{border:`${a}px solid transparent`,background:`${o.includes("gradient")?o:`linear-gradient(${o}, ${o})`} padding-box, ${t(e)} border-box`}},exports.tone3_lowOpacity_text=e=>({background:t(e),backgroundClip:"text",WebkitBackgroundClip:"text",WebkitTextFillColor:"transparent"}),exports.tone4=t=>`radial-gradient(54.59% 50% at 0% 50.04%, ${e.alpha(t.custom.palette.blue[1e3],.2)} 0%, ${e.alpha(t.custom.palette.blue[500],.2)} 100%), linear-gradient(135deg, ${t.custom.palette.purple[500]} 0%, ${t.custom.palette.purple[1e3]} 100%)`,exports.tone5=e=>`linear-gradient(135deg, ${e.custom.palette.blue[0]} 0%, ${e.custom.palette.purple[0]} 100%)`;