Fix: Remove status bar black background in light theme

android/app/build.gradle

@@ -8,8 +8,8 @@ android {
         applicationId "com.compassconnections.app"
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
-        versionCode 22
-        versionName "1.1.10"
+        versionCode 23
+        versionName "1.1.11"
         testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
         aaptOptions {
              // Files and dirs to omit from the packaged assets dir, modified to accommodate modern web apps.

web/hooks/use-theme.ts

@@ -67,11 +67,11 @@ export const updateStatusBar = async () => {
     if (isDark(theme)) {
       // Dark theme: light text on dark background
       await StatusBar.setStyle({style: Style.Dark});
-      // await StatusBar.setBackgroundColor({color: '#000000'}); // or your dark bg color
+      await StatusBar.setBackgroundColor({color: '#141414'}); // dark bg color (canvas-0)
     } else {
       // Light theme: dark text on light background
       await StatusBar.setStyle({style: Style.Light});
-      // await StatusBar.setBackgroundColor({color: '#ffffff'}); // or your light bg color
+      await StatusBar.setBackgroundColor({color: '#ffffff'}); // light bg color (canvas-0)
     }
   } catch (error) {
     console.error('Failed to update status bar:', error);

web/pages/_app.tsx

@@ -27,7 +27,6 @@ if (Capacitor.isNativePlatform()) {
   // Only runs on iOS/Android native
   // Note sure it's doing anything, though. Need to check
   StatusBar.setOverlaysWebView({overlay: false}).catch(console.warn)
-  // StatusBar.setStyle({style: Style.Light}).catch(console.warn)
 
   App.addListener('backButton', () => {
     window.dispatchEvent(new CustomEvent('appBackButton'))