fix light dark

quasar.config.js

@@ -169,7 +169,7 @@ export default defineConfig((ctx) => {
     framework: {
       lang: "pt-BR",
       config: {
-        dark: "auto",
+        dark: false,
         notify: {
           position: "top-right",
         },

src-capacitor/android/app/src/main/res/values/styles.xml

@@ -13,6 +13,9 @@
         <item name="windowActionBar">false</item>
         <item name="windowNoTitle">true</item>
         <item name="android:background">@null</item>
+
+        <item name="android:windowLightStatusBar">true</item>
+        <item name="android:windowLightNavigationBar">true</item>
     </style>
 
 

src-capacitor/capacitor.config.json

@@ -8,7 +8,8 @@
       "resizeOnFullScreen": true
     },
     "StatusBar": {
-      "overlaysWebView": true
+      "overlaysWebView": true,
+      "style": "LIGHT"
     },
     "SplashScreen": {
       "launchAutoHide": false,

src/App.vue

@@ -18,11 +18,7 @@ const { locale } = useI18n();
 
 const $q = useQuasar();
 
-const systemTheme = window.matchMedia("(prefers-color-scheme: dark)").matches
-  ? "dark"
-  : "light";
-
-const updateStatusBar = async (isDark) => {
+const updateStatusBar = async () => {
   if (!Capacitor.isNativePlatform()) {
     return;
   }
@@ -30,24 +26,10 @@ const updateStatusBar = async (isDark) => {
   await StatusBar.show();
 
   await StatusBar.setStyle({
-    style: isDark ? Style.Dark : Style.Light,
+    style: Style.Light,
   });
 };
 
-watch(
-  () => $q.dark.isActive,
-  async (value) => {
-    const theme = value ? "dark" : "light";
-
-    await Preferences.set({
-      key: "theme",
-      value: theme,
-    });
-
-    await updateStatusBar(value);
-  },
-);
-
 watch(
   () => locale.value,
   async (value) => {
@@ -59,16 +41,9 @@ watch(
 );
 
 onBeforeMount(async () => {
-  const { value: themePref } = await Preferences.get({
-    key: "theme",
-  });
+  $q.dark.set(false);
 
-  const theme = themePref || systemTheme;
-  const isDark = theme === "dark";
-
-  $q.dark.set(isDark);
-
-  await updateStatusBar(isDark);
+  await updateStatusBar();
 
   const { value: localePref } = await Preferences.get({
     key: "locale",
@@ -76,6 +51,7 @@ onBeforeMount(async () => {
 
   const userLocale = localePref || window.navigator.language;
 
-  console.log(theme, userLocale);
+  console.log(userLocale);
 });
+
 </script>