{"source":"headspinui-staging.azp7znk3i3-yjr3on9p041m.p.temp-site.link","element":{"id":100,"data":{"type":"EssentialElements\\Div","properties":null},"children":[{"id":101,"data":{"type":"EssentialElements\\Button","properties":{"content":{"content":{"text":"Click Here"}},"design":{"button":{"style":"custom","custom":{"background":"transparent !important","typography":{"typography":{"custom":{"customTypography":{"fontSize":{"breakpoint_base":{"number":0,"unit":"px","style":"0px"}}}}},"color":{"breakpoint_base":"red"}},"icon":{"icon":{"slug":"icon-moon-solid.","name":"icon-moon-solid.","svgCode":"<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 384 512\"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d=\"M223.5 32C100 32 0 132.3 0 256S100 480 223.5 480c60.6 0 115.5-24.2 155.8-63.4c5-4.9 6.3-12.5 3.1-18.7s-10.1-9.7-17-8.5c-9.8 1.7-19.8 2.6-30.1 2.6c-96.9 0-175.5-78.8-175.5-176c0-65.8 36-123.1 89.3-153.3c6.1-3.5 9.2-10.5 7.7-17.3s-7.3-11.9-14.3-12.5c-6.3-.5-12.6-.8-19-.8z\"/></svg>","iconSetSlug":"Headspin FA Bold"},"color":"var(--hcl-neutral-12)","size":{"breakpoint_base":{"number":22,"unit":"px","style":"22px"}}},"background_hover":null,"size":{"padding":{"breakpoint_base":{"left":{"number":0,"unit":"px","style":"0px"},"right":{"number":0,"unit":"px","style":"0px"},"top":{"number":0,"unit":"px","style":"0px"},"bottom":{"number":0,"unit":"px","style":"0px"}}},"size":{"breakpoint_base":"custom"}}}}},"settings":{"advanced":{"classes":["light-only"],"attributes":[{"name":"onclick","value":"hsSwitchTheme()"}]}},"meta":{"friendlyName":"moon"}}},"children":[],"_parentId":100},{"id":102,"data":{"type":"EssentialElements\\Button","properties":{"content":{"content":{"text":"Click Here"}},"design":{"button":{"style":"custom","custom":{"background":"transparent !important","typography":{"typography":{"custom":{"customTypography":{"fontSize":{"breakpoint_base":{"number":0,"unit":"px","style":"0px"}}}}},"color":{"breakpoint_base":"red"}},"icon":{"icon":{"slug":"icon-sun-bright-solid(1).","name":"icon-sun-bright-solid(1).","svgCode":"<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><!--!Font Awesome Pro 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2024 Fonticons, Inc.--><path d=\"M256 0c-13.3 0-24 10.7-24 24V88c0 13.3 10.7 24 24 24s24-10.7 24-24V24c0-13.3-10.7-24-24-24zm0 400c-13.3 0-24 10.7-24 24v64c0 13.3 10.7 24 24 24s24-10.7 24-24V424c0-13.3-10.7-24-24-24zM488 280c13.3 0 24-10.7 24-24s-10.7-24-24-24H424c-13.3 0-24 10.7-24 24s10.7 24 24 24h64zM112 256c0-13.3-10.7-24-24-24H24c-13.3 0-24 10.7-24 24s10.7 24 24 24H88c13.3 0 24-10.7 24-24zM437 108.9c9.4-9.4 9.4-24.6 0-33.9s-24.6-9.4-33.9 0l-45.3 45.3c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0L437 108.9zM154.2 357.8c-9.4-9.4-24.6-9.4-33.9 0L75 403.1c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l45.3-45.3c9.4-9.4 9.4-24.6 0-33.9zM403.1 437c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-45.3-45.3c-9.4-9.4-24.6-9.4-33.9 0s-9.4 24.6 0 33.9L403.1 437zM154.2 154.2c9.4-9.4 9.4-24.6 0-33.9L108.9 75c-9.4-9.4-24.6-9.4-33.9 0s-9.4 24.6 0 33.9l45.3 45.3c9.4 9.4 24.6 9.4 33.9 0zM256 368a112 112 0 1 0 0-224 112 112 0 1 0 0 224z\"/></svg>","iconSetSlug":"Headspin FA Bold"},"color":"var(--hcl-neutral-11)","size":{"breakpoint_base":{"number":22,"unit":"px","style":"22px"}}},"background_hover":null,"size":{"padding":{"breakpoint_base":{"left":{"number":0,"unit":"px","style":"0px"},"right":{"number":0,"unit":"px","style":"0px"},"top":{"number":0,"unit":"px","style":"0px"},"bottom":{"number":0,"unit":"px","style":"0px"}}},"size":{"breakpoint_base":"custom"}}}}},"settings":{"advanced":{"classes":["dark-only"],"attributes":[{"value":"hsSwitchTheme()","name":"onclick"}]}},"meta":{"friendlyName":"sun"}}},"children":[],"_parentId":100},{"id":103,"data":{"type":"EssentialElements\\CodeBlock","properties":{"content":{"content":{"javascript_code":"window.hsSwitchTheme = function(textChange, event){\n  if(document.querySelector(\"html\").getAttribute(\"data-hsx\") == 'dark'){\n\tdocument.querySelector(\"html\").setAttribute(\"data-hsx\", 'light');\n    localStorage.setItem(\"headspinTheme\", \"light\");\n    if(textChange) {\n      var event=event||window.event;\n    var target = event.target;\n      target.querySelectorAll(\".button-atom__text\").forEach(s=>{\n\t\ts.innerText = \"Toggle dark mode\";\n      })\n      \n    }\n}\n  else{\n  document.querySelector(\"html\").setAttribute(\"data-hsx\", 'dark');\n    localStorage.setItem(\"headspinTheme\", \"dark\");\n    if(textChange) {\n       var event=event||window.event;\n    var target = event.target;\n      target.querySelectorAll(\".button-atom__text\").forEach(s=>{\n\t\ts.innerText = \"Toggle light mode\";\n      })\n      \n    }\n  }\n\n}\n","css_code":".dark-only {\n  display:none!important\n}\n[data-hsx=\"light\"] .light-only {\n  display:flex!important\n}\n[data-hsx=\"dark\"] .light-only {\n  display:none!important\n}\n[data-hsx=\"dark\"] .dark-only {\n  display:flex!important\n}"}}}},"children":[],"_parentId":100}],"_parentId":1},"colors":[],"presets":[]}