diff --git a/screens/WatchLaterScreen.tsx b/screens/WatchLaterScreen.tsx index 31d36ee..fcc9623 100644 --- a/screens/WatchLaterScreen.tsx +++ b/screens/WatchLaterScreen.tsx @@ -5,8 +5,36 @@ import { FontAwesomeIcon} from "@fortawesome/react-native-fontawesome"; import { faClock} from "@fortawesome/free-solid-svg-icons"; import LinearGradient from 'react-native-linear-gradient'; import {RootTabScreenProps} from "../types.js"; - +import {useSafeAreaInsets} from "react-native-safe-area-context"; export default function WatchLaterScreen({ navigation }: RootTabScreenProps<'WatchLater'>) { + const insets = useSafeAreaInsets(); + + const styles = StyleSheet.create({ + container: { + flex: 1, + paddingTop: insets.top + 22, + backgroundColor: "#232323" + }, + linearGradient: { + flex: 1, + paddingLeft: 15, + paddingRight: 15, + borderRadius: 5 + }, + item: { + padding: 10, + fontSize: 18, + height: 44, + color: "white" + }, + filmCard: { + width: 70, + height: 100, + borderRadius: 8, + + + }, + }); return ( @@ -37,33 +65,9 @@ export default function WatchLaterScreen({ navigation }: RootTabScreenProps<'Wat /> ); + } -const styles = StyleSheet.create({ - container: { - flex: 1, - paddingTop: 22, - backgroundColor: "#232323" - }, - linearGradient: { - flex: 1, - paddingLeft: 15, - paddingRight: 15, - borderRadius: 5 - }, - item: { - padding: 10, - fontSize: 18, - height: 44, - color: "white" - }, - filmCard: { - width: 70, - height: 100, - borderRadius: 8, - - - }, -}); + type ListWidgetProps = { name : String @@ -71,6 +75,17 @@ type ListWidgetProps = { } export function ListWidget(props: ListWidgetProps) { + const insets = useSafeAreaInsets(); + + const styles = StyleSheet.create({ + filmCard: { + width: 70, + height: 100, + borderRadius: 8, + + + }, + }); return (