App.js

import { StatusBar } from "expo-status-bar";
import { createNativeStackNavigator } from "@react-navigation/native-stack";
import {
  NavigationContainer,
  DefaultTheme
  
} from "@react-navigation/native";
import { StyleSheet, Text, View } from "react-native";
import { useFonts } from "expo-font";
import Home from "./Screens/Home";
import Details from "./Screens/Details";

const Stack = createNativeStackNavigator();

const theme = {
  ...DefaultTheme,
  colors: {
    ...DefaultTheme.colors,
    background: "transparent",
  },
};

const App = () => {
  const [loaded] = useFonts({
    InterBold:require('./assets/fonts/Inter-Bold.ttf'),
    InterSemiBold:require('./assets/fonts/Inter-SemiBold.ttf'),
    InterMedium:require('./assets/fonts/Inter-Medium.ttf'),
    InterRegular:require('./assets/fonts/Inter-Regular.ttf'),
    InterLight:require('./assets/fonts/Inter-Light.ttf')
  });
  if (!loaded) return null;
  return (
    <NavigationContainer theme={theme}>
      <Stack.Navigator
        screenOptions={{ headerShown: false }}
        initialRouteName={"Home"}
      >
        <Stack.Screen name="Home" component={Home} />
        <Stack.Screen name="Details" component={Details} />
      </Stack.Navigator>
    </NavigationContainer>
  );
};

export default App;