sfp_front_vue_diarista_backoffice/src/App.vue

<template>
  <router-view />
</template>

<script setup>
import { Cookies, useQuasar } from "quasar";
import { useI18n } from "vue-i18n";
import { watch } from "vue";

defineOptions({
  name: "App",
});

const { locale } = useI18n();

const $q = useQuasar();
const systemTheme = window.matchMedia("(prefers-color-scheme: dark)").matches
  ? "dark"
  : "light";

const theme = $q.cookies.get("theme") || systemTheme;

const localeCookie = Cookies.get("locale") || window.navigator.language;

console.log(theme, localeCookie);

$q.dark.set(theme === "dark");

watch(
  () => $q.dark.isActive,
  (value) => {
    $q.cookies.set("theme", value ? "dark" : "light", {
      expires: 365,
    });
  },
);

watch(
  () => locale.value,
  (value) => {
    Cookies.set("locale", value, {
      expires: 365,
    });
  },
);
</script>