add background image to the screen

src/screens/UserLoginScreen.tsx

@@ -2,51 +2,59 @@ import Button from "@components/Button";
 import Input from "@components/Input";
 import Box from "@components/bases/Box";
 import Text from "@components/bases/Text";
-import { containers } from "@styles/Commons";
-import { KeyboardAvoidingView, Platform, View } from "react-native";
+import { containers, images } from "@styles/Commons";
+import { ImageBackground, KeyboardAvoidingView, Platform, View } from "react-native";
 
 const UserLoginScreen = () => {
 	return (
-		<Box
-			style={[containers.containerFull]}
-			p={"xl"}
-			paddingTop={"x140"}
-			flexDirection={"column"}
-			justifyContent={"space-between"}
-		>
-			<KeyboardAvoidingView
-				behavior={Platform.OS === "ios" ? "height" : "height"}
-				style={{ flex: 1 }}
+		<View style={{ height: "100%", width: "100%" }}>
+			<ImageBackground
+				source={require("../../assets/beasy_background.png")}
+				resizeMode="cover"
+				style={images.cover}
 			>
-				<View>
-					<Box mb={"x100"}>
-						<Text fontSize={40} fontWeight={"bold"}>
-							Connexion
-						</Text>
-						<Text color={"gray"}>Bienvenue, vous nous avez manqué !</Text>
-					</Box>
+				<Box
+					style={[containers.containerFull]}
+					p={"xl"}
+					paddingTop={"x240"}
+					flexDirection={"column"}
+					justifyContent={"space-between"}
+				>
+					<KeyboardAvoidingView
+						behavior={Platform.OS === "ios" ? "height" : "height"}
+						style={{ flex: 1 }}
+					>
+						<View>
+							<Box mb={"x100"}>
+								<Text fontSize={40} fontWeight={"bold"}>
+									Connexion
+								</Text>
+								<Text color={"gray"}>Bienvenue, vous nous avez manqué !</Text>
+							</Box>
 
-					<Box gap={"m"}>
-						<Input label="Email" />
-						<Input label="Mot de passe" secureTextEntry={true} />
+							<Box gap={"m"}>
+								<Input label="Email" />
+								<Input label="Mot de passe" secureTextEntry={true} />
+							</Box>
+						</View>
+					</KeyboardAvoidingView>
+					<Box mt={"xl"}>
+						<Button
+							variant={"full"}
+							textVariants={"primary"}
+							label="Se connecter"
+							onPress={() => {}}
+						/>
+						<Button
+							variant={"lightGray"}
+							textVariants={"black"}
+							label="Creer un compte"
+							onPress={() => {}}
+						/>
 					</Box>
-				</View>
-			</KeyboardAvoidingView>
-			<Box mt={"xl"}>
-				<Button
-					variant={"full"}
-					textVariants={"primary"}
-					label="Se connecter"
-					onPress={() => {}}
-				/>
-				<Button
-					variant={"lightGray"}
-					textVariants={"black"}
-					label="Creer un compte"
-					onPress={() => {}}
-				/>
-			</Box>
-		</Box>
+				</Box>
+			</ImageBackground>
+		</View>
 	);
 };