(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[92666],{92666:(s,e,p)=>{"use strict";p.r(e),p.d(e,{default:()=>t});var o=p(67841),a=p(64833),r=p(55158);let d=(0,a.z)("div")({name:"Wrapper",class:"wya20fe",propsAsIs:!1}),n=(0,a.z)("img")({name:"Image",class:"i1frud41",propsAsIs:!1}),l=(0,a.z)(r.ob)({name:"OutputWrapper",class:"o11qe2cf",propsAsIs:!0}),t=function(){return(0,o.jsx)(r.ZP,{id:"shadow-comp",initialValues:{mode:"filter"},outputWrapper:l,controls:[(0,o.jsx)(r.Xr,{id:"mode",label:"Shadow",options:["filter","box-shadow","none"]},"mode")],children:s=>{let{mode:e}=s,p="filter"===e?"\n            drop-shadow(2px 4px 8px hsl(220deg 60% 50% / 0.44))\n            drop-shadow(4px 8px 16px hsl(220deg 60% 50% / 0.44))\n            drop-shadow(8px 16px 32px hsl(220deg 60% 50% / 0.44))\n          ":"",a="box-shadow"===e?"\n            2px 4px 8px hsl(220deg 60% 50% / 0.44),\n            4px 8px 16px hsl(220deg 60% 50% / 0.44),\n            8px 16px 32px hsl(220deg 60% 50% / 0.44)\n          ":"";return(0,o.jsx)(d,{style:{filter:p,boxShadow:a},children:(0,o.jsx)(n,{alt:"3D illustration of a scared ghost",src:"/images/designing-shadows/ghost-transparent.png"})},p+a)}})};p(32687)},32687:s=>{s.exports={wya20fe:"wya20fe",i1frud41:"i1frud41",o11qe2cf:"o11qe2cf"}}}]);
//# sourceMappingURL=92666.33bd7590d628032f.js.map