{
  "version": 3,
  "sources": ["ssg:https://framerusercontent.com/modules/Kkk6SgLv998RuW0A3Om0/UgzDZPGxLgpP7XsmmOWb/ScrollColor.js"],
  "sourcesContent": ["import{jsx as _jsx}from\"react/jsx-runtime\";const scrollbarWidth=5;const mobileScrollbarWidth=1// \uBAA8\uBC14\uC77C \uC2A4\uD06C\uB864\uBC14 \uB113\uC774\uB97C 1px\uB85C \uC904\uC784\n;const scrollbarBorderRadius=20;const scrollbarBackgroundColor=\"#efe8ef\";const thumbBorderRadius=20;const thumbColor=\"#e0d3e8\";const hoverColor=\"#5c2b5f\";const focusColor=\"#321e33\";import{useEffect}from\"react\";export function customScrollbar(Component){return props=>{useEffect(()=>{const styleTag=document.createElement(\"style\");styleTag.innerHTML=`\n                ::-webkit-scrollbar {\n                    width: ${scrollbarWidth}px;\n                }\n                @media (max-width: 768px) {\n                    ::-webkit-scrollbar {\n                        width: ${mobileScrollbarWidth}px;\n                        height: 5px;\n                    }\n                    ::-webkit-scrollbar-track {\n                        padding: 0; /* \uBAA8\uBC14\uC77C\uC5D0\uC11C\uB294 \uD328\uB529 \uC81C\uAC70 */\n                    }\n                    ::-webkit-scrollbar-thumb {\n                        border-radius: ${thumbBorderRadius/2}px; /* \uBAA8\uBC14\uC77C\uC5D0\uC11C\uB294 \uB354 \uC791\uC740 radius */\n                    }\n                }\n                ::-webkit-scrollbar-track {\n                    background: ${scrollbarBackgroundColor};\n                    padding: 4px;\n                    border-radius: ${scrollbarBorderRadius}px;\n                }\n                ::-webkit-scrollbar-thumb {\n                    background-color: ${thumbColor};\n                    border: transparent;\n                    border-radius: ${thumbBorderRadius}px;\n                }\n                ::-webkit-scrollbar-thumb:hover {\n                    background-color: ${hoverColor};\n                }\n                ::-webkit-scrollbar-thumb:active {\n                    background-color: ${focusColor};\n                }\n            `;document.head.appendChild(styleTag);return()=>{document.head.removeChild(styleTag);};},[scrollbarWidth,mobileScrollbarWidth,thumbColor,scrollbarBackgroundColor,scrollbarBorderRadius,thumbBorderRadius,hoverColor,focusColor]);return /*#__PURE__*/_jsx(Component,{...props});};}\nexport const __FramerMetadata__ = {\"exports\":{\"customScrollbar\":{\"type\":\"reactHoc\",\"name\":\"customScrollbar\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./ScrollColor.map"],
  "mappings": "gDAA2C,IAAMA,EAAe,EAAQC,EAAqB,EACtFC,EAAsB,GAASC,EAAyB,UAAgBC,EAAkB,GAASC,EAAW,UAAgBC,EAAW,UAAgBC,EAAW,UAA8C,SAASC,EAAgBC,EAAU,CAAC,OAAOC,IAAQC,EAAU,IAAI,CAAC,IAAMC,EAAS,SAAS,cAAc,OAAO,EAAE,OAAAA,EAAS,UAAU;AAAA;AAAA,6BAEhUZ;AAAA;AAAA;AAAA;AAAA,iCAIIC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,yCAOQG,EAAkB;AAAA;AAAA;AAAA;AAAA,kCAIzBD;AAAA;AAAA,qCAEGD;AAAA;AAAA;AAAA,wCAGGG;AAAA;AAAA,qCAEHD;AAAA;AAAA;AAAA,wCAGGE;AAAA;AAAA;AAAA,wCAGAC;AAAA;AAAA,cAE1B,SAAS,KAAK,YAAYK,CAAQ,EAAQ,IAAI,CAAC,SAAS,KAAK,YAAYA,CAAQ,CAAE,CAAE,EAAE,CAACZ,EAAeC,EAAqBI,EAAWF,EAAyBD,EAAsBE,EAAkBE,EAAWC,CAAU,CAAC,EAAsBM,EAAKJ,EAAU,CAAC,GAAGC,CAAK,CAAC,EAAI",
  "names": ["scrollbarWidth", "mobileScrollbarWidth", "scrollbarBorderRadius", "scrollbarBackgroundColor", "thumbBorderRadius", "thumbColor", "hoverColor", "focusColor", "customScrollbar", "Component", "props", "ue", "styleTag", "p"]
}