You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
67 lines
2.2 KiB
67 lines
2.2 KiB
import { Text } from "@/components/ui/text";
|
|
import { VStack } from "@/components/ui/vstack";
|
|
import { Button, ButtonGroup } from "@/components/ui/button";
|
|
import { Feather } from "@expo/vector-icons";
|
|
import { HStack } from "@/components/ui/hstack";
|
|
import React from "react";
|
|
import { Box } from "@/components/ui/box";
|
|
import { Heading } from "@/components/ui/heading";
|
|
import { Link } from "expo-router";
|
|
import { LinkText } from "@/components/ui/link";
|
|
import LoginForm from "@/components/form/LoginForm";
|
|
import Screen from "@/components/Screen";
|
|
|
|
const socialNetworkButtons: ISocialNetworkButtons[] = [
|
|
{ icon: "instagram" },
|
|
{ icon: "facebook" },
|
|
{ icon: "linkedin" },
|
|
];
|
|
|
|
interface ISocialNetworkButtons {
|
|
icon: any;
|
|
}
|
|
|
|
export default function LoginPage() {
|
|
return (
|
|
<Screen>
|
|
<Box className="h-full justify-center">
|
|
<VStack space="2xl">
|
|
<VStack space="sm">
|
|
<Heading className="text-center" size="3xl">
|
|
Connexion à Optifit
|
|
</Heading>
|
|
<Text size="lg" className="text-center">
|
|
Personnalise ton expérience du sport avec Optifit, ton nouveau
|
|
coach IA.
|
|
</Text>
|
|
</VStack>
|
|
<LoginForm />
|
|
<ButtonGroup className="justify-center" flexDirection="row">
|
|
{socialNetworkButtons.map((socialNetworkButton) => (
|
|
<Button
|
|
key={socialNetworkButton.icon}
|
|
size="xl"
|
|
variant="outline"
|
|
action="primary"
|
|
>
|
|
<Feather name={socialNetworkButton.icon} size={27} />
|
|
</Button>
|
|
))}
|
|
</ButtonGroup>
|
|
<VStack>
|
|
<HStack className="justify-center items-center" space="xs">
|
|
<Text>Tu n'as pas encore de compte ?</Text>
|
|
<Link href="/(auth)/sign-in">
|
|
<LinkText bold={true}>Inscris-toi !</LinkText>
|
|
</Link>
|
|
</HStack>
|
|
<Link className="text-center" href="/reset-password">
|
|
<LinkText bold={true}>Mot de passe oublié ?</LinkText>
|
|
</Link>
|
|
</VStack>
|
|
</VStack>
|
|
</Box>
|
|
</Screen>
|
|
);
|
|
}
|