From 7db5436f7a4f5f8c8856e2a447e1bba8e3ff0b46 Mon Sep 17 00:00:00 2001
From: Benny Samir Hierl <bennysamir@posteo.de>
Date: Sun, 13 Feb 2022 02:38:26 +0100
Subject: [PATCH] fix darkmode issue

Signed-off-by: Benny Samir Hierl <bennysamir@posteo.de>
---
 src/components/Header.vue        | 8 ++++----
 src/components/InputCheckbox.vue | 5 ++++-
 2 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/src/components/Header.vue b/src/components/Header.vue
index 8c2a3e6..f932415 100644
--- a/src/components/Header.vue
+++ b/src/components/Header.vue
@@ -8,17 +8,17 @@
       @click="() => toggle()"
     >
       <IconToggleOn v-if="editMode" class="h-6 w-6 fill-emerald-700" />
-      <IconToggleOff v-else class="h-6 w-6 cursor-pointer" />
+      <IconToggleOff v-else class="h-6 w-6 cursor-pointer fill-current" />
       <span>{{ t('components.header.edit-mode.text') }}</span>
     </div>
     <div @click="() => toggleDark()">
-      <IconLightDark class="h-6 w-6 cursor-pointer" />
+      <IconLightDark class="h-6 w-6 cursor-pointer fill-current" />
     </div>
     <div v-if="isAuthenticated" @click="() => setToken('')">
-      <IconLogout class="h-6 w-6 cursor-pointer"></IconLogout>
+      <IconLogout class="h-6 w-6 cursor-pointer fill-current"></IconLogout>
     </div>
     <router-link to="/login" v-else>
-      <IconLogin class="h-6 w-6 cursor-pointer"></IconLogin>
+      <IconLogin class="h-6 w-6 cursor-pointer fill-current"></IconLogin>
     </router-link>
   </header>
 </template>
diff --git a/src/components/InputCheckbox.vue b/src/components/InputCheckbox.vue
index 0dd08ef..b6e0337 100644
--- a/src/components/InputCheckbox.vue
+++ b/src/components/InputCheckbox.vue
@@ -3,7 +3,10 @@
     <label class="mb-1 block w-full" :for="name">{{ label }}</label>
     <div @click="handleChange(checked)">
       <IconToggleOn v-if="!checked" class="h-12 w-12 fill-emerald-700" />
-      <IconToggleOff v-else class="h-12 w-12 cursor-pointer fill-stone-500" />
+      <IconToggleOff
+        v-else
+        class="h-12 w-12 cursor-pointer fill-stone-500 dark:fill-current"
+      />
     </div>
   </div>
 </template>