feat(enhancement): use system dark mode (#458)

* Use prefers-color-scheme

* Remove theme store

src/stores/style.store.ts

@@ -1,10 +1,11 @@
-import { useMediaQuery, useStorage } from '@vueuse/core';
+import { useDark, useMediaQuery, useStorage, useToggle } from '@vueuse/core';
 import { defineStore } from 'pinia';
 import { type Ref, watch } from 'vue';
 
 export const useStyleStore = defineStore('style', {
   state: () => {
-    const isDarkTheme = useStorage('isDarkTheme', true) as Ref<boolean>;
+    const isDarkTheme = useDark();
+    const toggleDark = useToggle(isDarkTheme);
     const isSmallScreen = useMediaQuery('(max-width: 700px)');
     const isMenuCollapsed = useStorage('isMenuCollapsed', isSmallScreen.value) as Ref<boolean>;
 
@@ -12,6 +13,7 @@ export const useStyleStore = defineStore('style', {
 
     return {
       isDarkTheme,
+      toggleDark,
       isMenuCollapsed,
       isSmallScreen,
     };