58 lines
2.4 KiB
TypeScript
58 lines
2.4 KiB
TypeScript
import { RegisterFormAction } from '@/actions/auth/AuthActions'
|
|
import Link from 'next/link'
|
|
import React, { ViewTransition } from 'react'
|
|
// import { ViewTransition } from 'react'
|
|
export default function Register() {
|
|
return (<ViewTransition enter={'auto'} exit={'auto'} default={'auto'}>
|
|
|
|
<div className='bg-black flex flex-col'>
|
|
<div
|
|
className='bg-white/10 h-svh max-w-[100vw] overflow-hidden backdrop-blur-lg flex flex-col border border-white/20 shadow-lg'
|
|
>
|
|
|
|
<div className='bg-purple-950 text-white flex justify-evenly p-2 font-bold'>
|
|
<div>Register Your Profile</div>
|
|
</div>
|
|
<form action={RegisterFormAction} className='m-2 flex flex-col grow'>
|
|
<div className='grow'>
|
|
<div className='text-white'>
|
|
<div className='flex'>
|
|
<label className='me-2 w-1/2'>Your name</label>
|
|
<input placeholder='Your name' type='text' name='name' className='grow' />
|
|
</div>
|
|
<small style={{ fontSize: '0.5rem' }} className='text-xs text-justify '>This will be used for your records but aliases are allowed while using chats</small>
|
|
</div>
|
|
<hr />
|
|
<div className='text-white'>
|
|
<div className='flex'>
|
|
<label className='me-2 w-1/2'>Email</label>
|
|
<input placeholder='Email' type='email' name='email' className='grow' />
|
|
</div>
|
|
<small style={{ fontSize: '0.5rem' }} className='text-xs text-justify '>This will be used to login to the system and gain access to restricted groups</small>
|
|
</div>
|
|
<hr />
|
|
<div className='text-white'>
|
|
<div className='flex'>
|
|
<label className='me-2 w-1/2'>Password</label>
|
|
<input placeholder='Password' type='password' name='password' className='grow' />
|
|
</div>
|
|
</div>
|
|
<hr />
|
|
</div>
|
|
<div className='flex w-full justify-between p-2'>
|
|
<Link href={`/`}><button type='button' className='self-end bg-purple-900 p-2 text-white'>Cancel</button></Link>
|
|
<ViewTransition name='register-button' enter={'animate-in'}>
|
|
<button className='self-end bg-purple-900 p-2 text-white'>Register</button>
|
|
</ViewTransition>
|
|
</div>
|
|
{/*
|
|
|
|
</div>
|
|
*/}
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</ViewTransition>
|
|
)
|
|
}
|