From 00ecf3705fcb18b30255b259bd9510339165afb5 Mon Sep 17 00:00:00 2001
From: Fenrikur <3359222+Fenrikur@users.noreply.github.com>
Date: Thu, 12 Sep 2024 21:28:33 +0200
Subject: [PATCH] fix(style): themed safe area color (#167)

---
 src/routes/IndexRouter.tsx | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/routes/IndexRouter.tsx b/src/routes/IndexRouter.tsx
index 3b7f620..9064ab8 100644
--- a/src/routes/IndexRouter.tsx
+++ b/src/routes/IndexRouter.tsx
@@ -7,7 +7,7 @@ import { SafeAreaView } from "react-native-safe-area-context";
 
 import { Toast } from "../components/Toast";
 import { useToastMessages } from "../context/ToastContext";
-import { useTheme, useThemeName } from "../hooks/themes/useThemeHooks";
+import { useTheme, useThemeMemo, useThemeName } from "../hooks/themes/useThemeHooks";
 import { RecordId } from "../store/eurofurence/types";
 import { About } from "./About";
 import { AreasRouter, AreasRouterParams } from "./AreasRouter";
@@ -80,8 +80,10 @@ export const IndexRouter: FC<IndexRouterProps> = () => {
     const toastMessages = useToastMessages(5);
     const isAreas = useNavigationState((s) => (!s ? false : s.routes?.[s.index]?.name === "Areas"));
 
+    const safeAreaStyle = useThemeMemo((theme) => ({ ...StyleSheet.absoluteFillObject, backgroundColor: theme.background }));
+
     return (
-        <SafeAreaView style={StyleSheet.absoluteFill}>
+        <SafeAreaView style={safeAreaStyle}>
             <StatusBar backgroundColor={theme.background} style={themeType === "light" ? "dark" : "light"} />
             <Stack.Navigator screenOptions={{ headerShown: false, detachPreviousScreen: false }}>
                 <Stack.Screen name="Areas" component={AreasRouter} />