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";

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>
					<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>
	);
};

export default UserLoginScreen;