Skip to content

B
beasy-mobile
You need to sign in or sign up before continuing.
Commit d47a9478 by G
Options

add header part of the screen for closing and 'forgotten password'

parent 1ab5a6e5
Showing with 53 additions and 38 deletions
src/screens/UserLoginScreen.tsx
...@@ -3,52 +3,67 @@ import Input from "@components/Input"; ...@@ -3,52 +3,67 @@ import Input from "@components/Input";
import BackgroundGreenWhiteContentArea from "@components/backgrounds/BackgroundGreenWhiteContentArea"; import BackgroundGreenWhiteContentArea from "@components/backgrounds/BackgroundGreenWhiteContentArea";
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 { Fontisto } from "@expo/vector-icons";
import { containers } from "@styles/Commons"; import { containers } from "@styles/Commons";
import { KeyboardAvoidingView, Platform, View } from "react-native"; import { KeyboardAvoidingView, Platform, SafeAreaView, TouchableOpacity, View } from "react-native";
const UserLoginScreen = () => { const UserLoginScreen = () => {
return ( return (
<BackgroundGreenWhiteContentArea> <BackgroundGreenWhiteContentArea>
<Box <SafeAreaView style={{ flex: 1 }}>
style={[containers.containerFull]} <Box
p={"xl"} px={"m"}
paddingTop={"x240"} justifyContent={"space-between"}
flexDirection={"column"} flexDirection={"row"}
justifyContent={"space-between"} alignItems={"center"}
>
<KeyboardAvoidingView
behavior={Platform.OS === "ios" ? "height" : "height"}
style={{ flex: 1 }}
> >
<View> <Fontisto name="close-a" size={12} color="black" />
<Box mb={"x100"}>
<Text fontSize={40} fontWeight={"bold"}>
Connexion
</Text>
<Text color={"gray"}>Bienvenue, vous nous avez manqué !</Text>
</Box>
<Box gap={"m"}> <TouchableOpacity>
<Input label="Email" /> <Text>Mot de passe oublie ?</Text>
<Input label="Mot de passe" secureTextEntry={true} /> </TouchableOpacity>
</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> <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>
</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>
</SafeAreaView>
</BackgroundGreenWhiteContentArea> </BackgroundGreenWhiteContentArea>
); );
}; };
......
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