init

2023-12-20 18:30:11 +08:00
commit 29fe82a05b
56 changed files with 23021 additions and 0 deletions
--- a/src/views/Settings.vue
+++ b/src/views/Settings.vue
@@ -0,0 +1,62 @@
+<template>
+  <!--  <div class="home">-->
+  <!--    <HomePage></HomePage>-->
+  <!--  </div>-->
+  <body  translate="no">
+  <div class="video-bg">
+    <video width="320" height="240" autoplay="" loop="" muted="" __idm_id__="1581057">
+      <source src="../assets/video/background.mp4" type="video/mp4">
+      Your browser does not support the video tag.
+    </video>
+  </div>
+  <div class="dark-light">
+    <svg viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5" fill="none" stroke-linecap="round"
+         stroke-linejoin="round">
+      <path d="M21 12.79A9 9 0 1111.21 3 7 7 0 0021 12.79z"></path>
+    </svg>
+  </div>
+  <div class="app">
+    <SettingHeader></SettingHeader>
+    <!--    <router-view></router-view>-->
+    <div class="wrapper">
+      <SettingLeftSide></SettingLeftSide>
+      <router-view></router-view>
+    </div>
+    <div class="overlay-app"></div>
+  </div>
+  </body>
+</template>
+
+<script>
+// @ is an alias to /src
+import SettingHeader from "@/components/setting/SettingHeader.vue";
+import SettingLeftSide from "@/components/setting/SettingLeftSide.vue";
+
+
+export default {
+  name: 'SettingsView',
+  components: {
+    SettingLeftSide,
+    SettingHeader,
+  },
+  data() {
+    return {}
+  },
+  mounted() {
+    this.toggleDarkLight();
+  },
+  created() {
+
+  },
+  computed: {},
+  methods:{
+    toggleDarkLight() {
+      const toggleButton = document.querySelector('.dark-light');
+
+      toggleButton.addEventListener('click', () => {
+        document.body.classList.toggle('light-mode');
+      });
+    }
+  }
+}
+</script>