added dark mode

src/pages/login/index.vue

@@ -1,14 +1,18 @@
 <template>
   <div
     :style="{ backgroundImage: `url(${bg1})` }"
-    class="w-screen h-screen top-0 right-0 fixed bg-cover flex z-[1000]"
+    class="login-page w-screen h-screen top-0 right-0 fixed bg-cover flex z-[1000]"
   >
+    <div class="login-page__toggle">
+      <ThemeToggle />
+    </div>
     <LoginPanel @enter="enterTest" class="shadow-2xl" />
   </div>
 </template>
 
 <script setup lang="ts">
 import LoginPanel from './components/LoginPanel.vue'
+import ThemeToggle from '@core/components/ThemeToggle.vue'
 import bg1 from '../login/assets/img/loginBack.svg'
 
 const emits = defineEmits(['enter'])
@@ -19,4 +23,24 @@ function enterTest() {
 }
 </script>
 
-<style scoped></style>
+<style scoped>
+.login-page {
+  position: relative;
+}
+
+.login-page__toggle {
+  position: absolute;
+  top: 16px;
+  left: 16px;
+  z-index: 1001;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 40px;
+  height: 40px;
+  border-radius: 9999px;
+  background: var(--admin-bg-elevated);
+  border: 1px solid var(--admin-border);
+  box-shadow: 0 2px 8px var(--admin-shadow);
+}
+</style>