Docker/mealie
Docker/mealie
1
0
Fork 0
mirror of https://github.com/mealie-recipes/mealie.git synced 2025-07-23 15:19:41 +02:00
Code Issues Releases Activity

Added | Persistant Storage, final tweaks to themes

Browse source
This commit is contained in:
zackbcom 2021-01-07 22:45:24 -06:00
parent 0cdf8b9faa
commit 3e65d2cc9c
6 changed files with 152 additions and 136 deletions
Download patch file Download diff file Expand all files Collapse all files

17
frontend/src/App.vue
View file

@ -37,6 +37,7 @@ import Menu from "./components/UI/Menu";
import SearchHeader from "./components/UI/SearchHeader";
import AddRecipe from "./components/AddRecipe";
import SnackBar from "./components/UI/SnackBar";
import Vuetify from "./plugins/vuetify";
export default {
name: "App",
@ -54,8 +55,9 @@ export default {
},
mounted() {
this.$store.dispatch("initCookies");
this.$store.dispatch("initTheme");
this.$store.dispatch("requestRecentRecipes");
this.darkModeSystemCheck();
this.darkModeAddEventListener();
},
@ -63,16 +65,25 @@ export default {
search: false
}),
methods: {
/**
* Checks if 'system' is set for dark mode and then sets the corrisponding value for vuetify
*/
darkModeSystemCheck() {
if (this.$store.getters.getDarkMode === "system")
Vuetify.framework.theme.dark = window.matchMedia(
"(prefers-color-scheme: dark)"
).matches;
},
/**
* This will monitor the OS level darkmode and call to update dark mode.
*/
darkModeAddEventListener() {
const darkMediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
darkMediaQuery.addEventListener("change", () => {
this.$store.commit("setDarkMode", "system");
this.darkModeSystemCheck();
});
},
toggleSearch() {
if (this.search === true) {
this.search = false;