feat: add navigation theme

src/routes/index.tsx

@@ -1,12 +1,19 @@
-import { NavigationContainer } from "@react-navigation/native";
+import { DefaultTheme, NavigationContainer } from "@react-navigation/native";
+import { Box } from "@gluestack-ui/themed";
 
 import { AuthRoutes } from "./auth.routes";
+import { gluestackUIConfig } from "../../config/gluestack-ui.config";
 
 export function Routes() {
+  const theme = DefaultTheme;
+  theme.colors.background = gluestackUIConfig.tokens.colors.gray700;
+
   return (
-    <NavigationContainer>
-      <AuthRoutes />
-    </NavigationContainer>
+    <Box flex={1} bg="$gray700">
+      <NavigationContainer theme={theme}>
+        <AuthRoutes />
+      </NavigationContainer>
+    </Box>
   )
 }
       

src/screens/SignIn.tsx

@@ -11,7 +11,7 @@ export function SignIn() {
       contentContainerStyle={{ flexGrow: 1 }}
       showsVerticalScrollIndicator={false}
     >
-    <VStack flex={1} bg="$gray700">
+    <VStack flex={1}>
       <Image
         source={BackgroundImg}
         defaultSource={BackgroundImg}

src/screens/SignUp.tsx

@@ -11,7 +11,7 @@ export function SignUp() {
       contentContainerStyle={{ flexGrow: 1 }}
       showsVerticalScrollIndicator={false}
     >
-    <VStack flex={1} bg="$gray700">
+    <VStack flex={1}>
       <Image
         source={BackgroundImg}
         defaultSource={BackgroundImg}