101 lines
3.1 KiB
TypeScript
101 lines
3.1 KiB
TypeScript
'use client';
|
|
|
|
import NextLink from 'next/link';
|
|
import Box from '@mui/material/Box';
|
|
import Grid from '@mui/material/Grid';
|
|
import Stack from '@mui/material/Stack';
|
|
import Typography from '@mui/material/Typography';
|
|
import { styled } from '@mui/material/styles';
|
|
import PageContainer from '../components/forms/container/PageContainer';
|
|
import AuthLogin from '../authForms/AuthLogin';
|
|
|
|
const GradientGrid = styled(Grid)(({ theme }) => ({
|
|
position: 'relative',
|
|
backgroundColor: '#d2f1df',
|
|
backgroundImage:
|
|
'linear-gradient(45deg, #d2f1df 0%, #d3d7fa 50%, #bad8f4 100%)',
|
|
backgroundSize: '400% 400%',
|
|
backgroundPosition: '0% 50%',
|
|
animation: 'gradient 15s ease infinite',
|
|
display: 'none',
|
|
[theme.breakpoints.up('lg')]: {
|
|
display: 'block',
|
|
},
|
|
}));
|
|
|
|
export default function Login() {
|
|
return (
|
|
<PageContainer title="Login" description="Página de Login">
|
|
<Grid
|
|
container
|
|
spacing={0}
|
|
justifyContent="center"
|
|
sx={{ height: '100vh', width: '100%' }}
|
|
>
|
|
<GradientGrid size={{ xs: 12, lg: 7, xl: 8 }}>
|
|
<Box
|
|
display="flex"
|
|
alignItems="center"
|
|
justifyContent="center"
|
|
height="100%"
|
|
sx={{
|
|
backgroundColor: 'rgba(255, 255, 255, 0.15)',
|
|
backdropFilter: 'blur(10px)',
|
|
}}
|
|
>
|
|
<Box textAlign="center">
|
|
{/* Background image placeholder */}
|
|
<Box mb={3}>
|
|
<Typography variant="h3" fontWeight="700" color="primary">
|
|
Jurunense
|
|
</Typography>
|
|
</Box>
|
|
<Typography variant="h4" fontWeight="600" color="textPrimary">
|
|
Bem-vindo de volta
|
|
</Typography>
|
|
<Typography variant="subtitle1" color="textSecondary" mt={1}>
|
|
Acesse sua conta para continuar
|
|
</Typography>
|
|
</Box>
|
|
</Box>
|
|
</GradientGrid>
|
|
<Grid size={{ xs: 12, lg: 5, xl: 4 }}>
|
|
<Box
|
|
display="flex"
|
|
justifyContent="center"
|
|
alignItems="center"
|
|
sx={{ backgroundColor: 'white' }}
|
|
>
|
|
<Box p={4} sx={{ width: '100%', maxWidth: '450px' }}>
|
|
<AuthLogin
|
|
subtitle={
|
|
<Stack direction="row" spacing={1} mt={3} flexWrap="wrap">
|
|
<Typography
|
|
fontWeight="500"
|
|
sx={{
|
|
textDecoration: 'none',
|
|
color: 'primary.main',
|
|
}}
|
|
>
|
|
<NextLink
|
|
href="/auth/auth1/register"
|
|
style={{
|
|
textDecoration: 'none',
|
|
color: 'inherit',
|
|
whiteSpace: 'nowrap',
|
|
}}
|
|
>
|
|
Criar uma conta
|
|
</NextLink>
|
|
</Typography>
|
|
</Stack>
|
|
}
|
|
/>
|
|
</Box>
|
|
</Box>
|
|
</Grid>
|
|
</Grid>
|
|
</PageContainer>
|
|
);
|
|
}
|