{"version":3,"sources":["webpack:///./src/components/mode/ButtonSetTheme.vue","webpack:///src/components/mode/ButtonSetTheme.vue","webpack:///./src/components/mode/ButtonSetTheme.vue?daad","webpack:///./src/components/mode/ButtonSetTheme.vue?0216","webpack:///./src/components/mode/ButtonSetTheme.vue?6872"],"names":["render","_vm","this","_c","_self","staticClass","class","isDarkModeActive","on","toggleTheme","staticRenderFns","mounted","darkMode","methods","JSON","parse","localStorage","getItem","body","document","querySelector","classList","add","remove","$forceUpdate","setItem","stringify","data","component"],"mappings":"8IAAA,IAAIA,EAAS,WAAkB,IAAIC,EAAIC,KAAKC,EAAGF,EAAIG,MAAMD,GAAG,OAAOA,EAAG,MAAM,CAACA,EAAG,SAAS,CAACE,YAAY,eAAeC,MAAM,CACrH,eAAgBL,EAAIM,iBACpB,aAAcN,EAAIM,kBAClBC,GAAG,CAAC,MAAQP,EAAIQ,cAAc,CAACN,EAAG,IAAI,CAACE,YAAY,WAAWC,MAAM,CAClE,WAAYL,EAAIM,iBAChB,SAAUN,EAAIM,yBAGlBG,EAAkB,GCPP,GACfC,UACA,KAAAC,YAEAC,QAAA,CACAD,WACA,MAAAL,EAAA,MAAAO,KAAAC,MAAAC,aAAAC,QAAA,YAAAH,KAAAC,MAAAC,aAAAC,QAAA,WACA,KAAAV,mBAGA,MAAAW,EAAAC,SAAAC,cAAA,QACAb,EACAW,EAAAG,UAAAC,IAAA,SAEAJ,EAAAG,UAAAE,OAAA,QACA,KAAAC,iBAGAf,cAEA,KAAAF,kBAAA,KAAAA,iBAEA,MAAAW,EAAAC,SAAAC,cAAA,QACAJ,aAAAS,QAAA,SAAAX,KAAAY,UAAA,KAAAnB,mBACA,KAAAA,iBACAW,EAAAG,UAAAC,IAAA,QAEAJ,EAAAG,UAAAE,OAAA,QAEA,KAAAC,iBAGAG,OACA,OACApB,kBAAA,KCnCyY,I,wBCQrYqB,EAAY,eACd,EACA5B,EACAU,GACA,EACA,KACA,WACA,MAIa,aAAAkB,E,2CCnBf","file":"js/chunk-74524708.91182d63.js","sourcesContent":["var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',[_c('button',{staticClass:\"button-theme\",class:{\n      'styles-moon': !_vm.isDarkModeActive,\n      'styles-sun': _vm.isDarkModeActive,\n    },on:{\"click\":_vm.toggleTheme}},[_c('i',{staticClass:\"fa-solid\",class:{\n        'fa-moon': !_vm.isDarkModeActive,\n        'fa-sun': _vm.isDarkModeActive,\n      }})])])\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<script>\r\nexport default {\r\n  mounted() {\r\n    this.darkMode();\r\n  },\r\n  methods: {\r\n    darkMode() {\r\n      const isDarkModeActive = JSON.parse(localStorage.getItem(\"isdark\")) == null ? false : JSON.parse(localStorage.getItem(\"isdark\"));\r\n      this.isDarkModeActive = isDarkModeActive;\r\n      console.log(\"localstorage dark toogle \", this.isDarkModeActive);\r\n      // console.log(\"localstorage dark button \", isDarkModeActive);\r\n      const body = document.querySelector(\"body\");\r\n      if (isDarkModeActive) {\r\n        body.classList.add(\"dark\");\r\n      } else {\r\n        body.classList.remove(\"dark\");\r\n        this.$forceUpdate();\r\n      }\r\n    },\r\n    toggleTheme() {\r\n      // const isDark = document.body.classList.toggle(\"dark\");\r\n      this.isDarkModeActive = !this.isDarkModeActive;\r\n      console.log(\"localstorage dark toogle \", this.isDarkModeActive);\r\n      const body = document.querySelector(\"body\");\r\n      localStorage.setItem(\"isdark\", JSON.stringify(this.isDarkModeActive));\r\n      if (this.isDarkModeActive) {\r\n        body.classList.add(\"dark\");\r\n      } else {\r\n        body.classList.remove(\"dark\");\r\n      }\r\n      this.$forceUpdate();\r\n    },\r\n  },\r\n  data() {\r\n    return {\r\n      isDarkModeActive: false,\r\n    };\r\n  },\r\n};\r\n</script>\r\n\r\n<template>\r\n  <div>\r\n    <button\r\n      @click=\"toggleTheme\"\r\n      class=\"button-theme\"\r\n      :class=\"{\r\n        'styles-moon': !isDarkModeActive,\r\n        'styles-sun': isDarkModeActive,\r\n      }\"\r\n    >\r\n      <i\r\n        class=\"fa-solid\"\r\n        :class=\"{\r\n          'fa-moon': !isDarkModeActive,\r\n          'fa-sun': isDarkModeActive,\r\n        }\"\r\n      ></i>\r\n    </button>\r\n  </div>\r\n</template>\r\n\r\n<style scoped>\r\n.button-theme {\r\n  border-radius: 50%;\r\n  font-size: 2rem;\r\n  justify-content: center;\r\n  align-items: center;\r\n  display: flex;\r\n  width: 40px;\r\n  height: 40px;\r\n  padding: 22px;\r\n  cursor: pointer;\r\n  transition: 0.3s;\r\n  border: none;\r\n}\r\n\r\n.styles-moon {\r\n  background-color: #0c1a30;\r\n  color: #fff;\r\n}\r\n\r\n.styles-sun {\r\n  background-color: #fe721c;\r\n  color: white;\r\n}\r\n</style>\r\n","import mod from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/@vue/cli-plugin-babel/node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./ButtonSetTheme.vue?vue&type=script&lang=js\"; export default mod; export * from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/@vue/cli-plugin-babel/node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./ButtonSetTheme.vue?vue&type=script&lang=js\"","import { render, staticRenderFns } from \"./ButtonSetTheme.vue?vue&type=template&id=8ae01a10&scoped=true\"\nimport script from \"./ButtonSetTheme.vue?vue&type=script&lang=js\"\nexport * from \"./ButtonSetTheme.vue?vue&type=script&lang=js\"\nimport style0 from \"./ButtonSetTheme.vue?vue&type=style&index=0&id=8ae01a10&prod&scoped=true&lang=css\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"8ae01a10\",\n  null\n  \n)\n\nexport default component.exports","export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--7-oneOf-1-0!../../../node_modules/@vue/cli-service/node_modules/css-loader/dist/cjs.js??ref--7-oneOf-1-1!../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../node_modules/postcss-loader/src/index.js??ref--7-oneOf-1-2!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./ButtonSetTheme.vue?vue&type=style&index=0&id=8ae01a10&prod&scoped=true&lang=css\""],"sourceRoot":""}