summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--assets/sass/main.sass9
-rw-r--r--layouts/default.vue16
-rw-r--r--pages/settings.vue6
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")