import Button from "@components/Button";
import Box from "@components/bases/Box";
import Text from "@components/bases/Text";
import { Image, StyleSheet } from "react-native";
const HomeUserNotLoggedIn = () => {
	return (
		<Box style={style.container} p={"xl"}>
			<Box mt={"s"}>
				<Box
					height={300}
					backgroundColor={"primary"}
					mb={"l"}
					alignItems={"center"}
					justifyContent={"center"}
				>
					<Image
						source={require("../../assets/payment_processing.png")}
						style={style.image}
					/>
				</Box>
				<Text color={"gray"} fontSize={16} textAlign={"center"}>
					Acceptez des paiements en magasin et en ligne et recevez votre argent en
					quelques secondes
				</Text>
				<Box mt={"xl"}>
					<Button
						variant={"full"}
						textVariants={"primary"}
						label="Se connecter"
						onPress={() => {}}
					/>
					<Button
						variant={"clean"}
						textVariants={"secondary"}
						label="Creer un compte"
						onPress={() => {}}
					/>
				</Box>
			</Box>
		</Box>
	);
};

const style = StyleSheet.create({
	container: {
		width: "100%",
		height: "100%",
		flex: 1,
		alignItems: "center",
		justifyContent: "center",
	},
	image: {
		width: "100%",
		height: "100%",
	},
});

export default HomeUserNotLoggedIn;