From 45a81d90df43c668a98c76316a82545dc9d32213 Mon Sep 17 00:00:00 2001
From: flfeders <f.federspiel@federspiel.tech>
Date: Fri, 8 Nov 2024 18:54:42 +0100
Subject: [PATCH] Moved Dark Mode

---
 layouts/default.vue          |  2 +-
 pages/profiles/show/[id].vue | 23 +++++++++++++++++++++++
 2 files changed, 24 insertions(+), 1 deletion(-)

diff --git a/layouts/default.vue b/layouts/default.vue
index f723564..8f855f3 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -539,7 +539,7 @@ const footerLinks = [/*{
     <NotificationsSlideover />
 
     <ClientOnly>
-      <LazyUDashboardSearch :groups="groups" />
+      <LazyUDashboardSearch :groups="groups" hide-color-mode/>
     </ClientOnly>
   </UDashboardLayout>
   <div
diff --git a/pages/profiles/show/[id].vue b/pages/profiles/show/[id].vue
index aa3aeb6..fc0f5f0 100644
--- a/pages/profiles/show/[id].vue
+++ b/pages/profiles/show/[id].vue
@@ -172,6 +172,15 @@ const calcWeeklyWorkingHours = () => {
       itemInfo.value.weeklyRegularWorkingHours[7]
 }
 
+const colorMode = useColorMode()
+const isLight = computed({
+  get() {
+    return colorMode.value !== 'dark'
+  },
+  set() {
+    colorMode.preference = colorMode.value === 'dark' ? 'light' : 'dark'
+  }
+})
 </script>
 
 <template>
@@ -284,6 +293,20 @@ const calcWeeklyWorkingHours = () => {
             </UFormGroup>
           </InputGroup>
 
+          <UDivider class="my-5">
+            Helligkeitseinstellung
+          </UDivider>
+
+          <UButton
+              :icon="!isLight ? 'i-heroicons-moon-20-solid' : 'i-heroicons-sun-20-solid'"
+              color="white"
+              variant="outline"
+              aria-label="Theme"
+              @click="isLight = !isLight"
+          >
+            {{!isLight ? "Hell" : "Dunkel"}}
+          </UButton>
+
           <UDivider class="my-5">
             E-Mail Signatur
           </UDivider>