diff options
| author | Santo Cariotti <santo@dcariotti.me> | 2022-09-27 21:28:52 +0200 |
|---|---|---|
| committer | Santo Cariotti <santo@dcariotti.me> | 2022-09-27 21:28:52 +0200 |
| commit | 0061e86084beb5ffd6acfad926d44dd49a00664a (patch) | |
| tree | 2a7c126286ebf910a122b4b07cd45174cdc1e20d | |
| parent | 6395d1ec4362fedd7854fc9a103bad8bf7ae5d3d (diff) | |
Fix theme switch
| -rw-r--r-- | assets/sass/main.sass | 9 | ||||
| -rw-r--r-- | layouts/default.vue | 16 | ||||
| -rw-r--r-- | pages/settings.vue | 6 |
3 files changed, 8 insertions, 23 deletions
diff --git a/assets/sass/main.sass b/assets/sass/main.sass index d0c5159..6c74fbe 100644 --- a/assets/sass/main.sass +++ b/assets/sass/main.sass @@ -11,8 +11,9 @@ body .border-1 border-width: 1px -body.dark - background-color: #111827 +html.dark-mode + body + background-color: #111827 -.dark\:border-b-1 - border-bottom-width: 1px + .dark\:border-b-1 + border-bottom-width: 1px diff --git a/layouts/default.vue b/layouts/default.vue index c6e249f..b6da206 100644 --- a/layouts/default.vue +++ b/layouts/default.vue @@ -6,19 +6,3 @@ </main> </div> </template> - -<script> -export default { - created() { - setTimeout(() => { - const dark = document.querySelector("#__layout .dark"); - console.log(dark); - if (dark) { - document.querySelector("body").className = "dark"; - } else { - document.querySelector("body").className = ""; - } - }, 1000); - }, -}; -</script> diff --git a/pages/settings.vue b/pages/settings.vue index bc028d4..8da18ab 100644 --- a/pages/settings.vue +++ b/pages/settings.vue @@ -62,9 +62,9 @@ select( class="cursor-pointer rounded-md border border-gray-300 bg-white py-2 px-3 text-sm font-medium leading-4 text-gray-700 shadow-sm hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2" ) - option(@click="$colorMode.preference = 'system'") System - option(@click="$colorMode.preference = 'light'") Light - option(@click="$colorMode.preference = 'dark'") Dark + option(@click="$colorMode.preference = 'system'" :selected="$colorMode.preference == 'system'") System + option(@click="$colorMode.preference = 'light'" :selected="$colorMode.preference == 'light'") Light + option(@click="$colorMode.preference = 'dark'" :selected="$colorMode.preference == 'dark'") Dark .py-3.px-4.text-right(class="sm:px-6") |