Update login page appearance

This commit is contained in:
april 2024-01-03 11:06:06 -06:00
parent 6137dde7df
commit 8e03e3dccf

View File

@ -1,8 +1,11 @@
import { useAuth } from "@/util/auth"; import { useAuth } from "@/util/auth";
import { import {
Box,
Button, Button,
Center,
Container,
Fieldset,
Group, Group,
Image,
PasswordInput, PasswordInput,
Stack, Stack,
TextInput, TextInput,
@ -21,11 +24,16 @@ export default function Login() {
const { signin } = useAuth(); const { signin } = useAuth();
return ( return (
<Container h="75%">
<Stack gap="md" h="100%" justify="center" align="stretch"> <Stack gap="md" h="100%" justify="center" align="stretch">
<Center>
<Image src="/logo.png" w="100px" />
</Center>
<Title order={2} style={{ textAlign: "center" }}> <Title order={2} style={{ textAlign: "center" }}>
Login Tailfin
</Title> </Title>
<Box maw={340} mx="auto"> <Center>
<Fieldset legend="Log In" w="350px">
<form <form
onSubmit={form.onSubmit((values) => { onSubmit={form.onSubmit((values) => {
signin(values); signin(values);
@ -45,7 +53,9 @@ export default function Login() {
<Button type="submit">Log In</Button> <Button type="submit">Log In</Button>
</Group> </Group>
</form> </form>
</Box> </Fieldset>
</Center>
</Stack> </Stack>
</Container>
); );
} }