mirror of
https://github.com/bastienwirtz/homer.git
synced 2025-06-27 13:12:07 +02:00
Toggle dark mode when prefers-color-scheme
changes
This commit is contained in:
parent
f0f9f0a017
commit
6cfa1643b4
@ -47,6 +47,7 @@ export default {
|
|||||||
}
|
}
|
||||||
this.isDark = this.getIsDark();
|
this.isDark = this.getIsDark();
|
||||||
this.$emit("updated", this.isDark);
|
this.$emit("updated", this.isDark);
|
||||||
|
this.watchIsDark();
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
toggleTheme: function () {
|
toggleTheme: function () {
|
||||||
@ -81,6 +82,13 @@ export default {
|
|||||||
];
|
];
|
||||||
return values[this.mode];
|
return values[this.mode];
|
||||||
},
|
},
|
||||||
|
|
||||||
|
watchIsDark: function () {
|
||||||
|
matchMedia("(prefers-color-scheme: dark)").addEventListener("change", () => {
|
||||||
|
this.isDark = this.getIsDark();
|
||||||
|
this.$emit("updated", this.isDark);
|
||||||
|
});
|
||||||
|
},
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user