Skip to content

B
beasy-mobile
Commit 39cfcfba by G
Options

add background image to the screen

parent 56dfe234
Showing with 47 additions and 39 deletions
src/screens/UserLoginScreen.tsx
...@@ -2,51 +2,59 @@ import Button from "@components/Button"; ...@@ -2,51 +2,59 @@ import Button from "@components/Button";
import Input from "@components/Input"; import Input from "@components/Input";
import Box from "@components/bases/Box"; import Box from "@components/bases/Box";
import Text from "@components/bases/Text"; import Text from "@components/bases/Text";
import { containers } from "@styles/Commons"; import { containers, images } from "@styles/Commons";
import { KeyboardAvoidingView, Platform, View } from "react-native"; import { ImageBackground, KeyboardAvoidingView, Platform, View } from "react-native";
const UserLoginScreen = () => { const UserLoginScreen = () => {
return ( return (
<Box <View style={{ height: "100%", width: "100%" }}>
style={[containers.containerFull]} <ImageBackground
p={"xl"} source={require("../../assets/beasy_background.png")}
paddingTop={"x140"} resizeMode="cover"
flexDirection={"column"} style={images.cover}
justifyContent={"space-between"}
>
<KeyboardAvoidingView
behavior={Platform.OS === "ios" ? "height" : "height"}
style={{ flex: 1 }}
> >
<View> <Box
<Box mb={"x100"}> style={[containers.containerFull]}
<Text fontSize={40} fontWeight={"bold"}> p={"xl"}
Connexion paddingTop={"x240"}
</Text> flexDirection={"column"}
<Text color={"gray"}>Bienvenue, vous nous avez manqué !</Text> justifyContent={"space-between"}
</Box> >
<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"}> <Box gap={"m"}>
<Input label="Email" /> <Input label="Email" />
<Input label="Mot de passe" secureTextEntry={true} /> <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> </Box>
</View> </Box>
</KeyboardAvoidingView> </ImageBackground>
<Box mt={"xl"}> </View>
<Button
variant={"full"}
textVariants={"primary"}
label="Se connecter"
onPress={() => {}}
/>
<Button
variant={"lightGray"}
textVariants={"black"}
label="Creer un compte"
onPress={() => {}}
/>
</Box>
</Box>
); );
}; };
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment