Refactor Register component to use InputField component

This commit is contained in:
Davenludd 2024-03-16 15:14:03 +01:00
parent d6d2b6d170
commit 6d5c25be5c

View file

@ -58,42 +58,22 @@ export default function Register(): JSX.Element {
<h3 className="pb-4 mb-2 text-center font-bold text-[18px]"> <h3 className="pb-4 mb-2 text-center font-bold text-[18px]">
Register New User Register New User
</h3> </h3>
<div className="mb-4"> <InputField
<label label="Username"
className="block text-gray-700 text-sm font-sans font-bold mb-2" type="text"
htmlFor="username" value={username}
> onChange={(e) => {
Username setUsername(e.target.value);
</label> }}
<input />
className="appearance-none border-2 border-black rounded-2xl w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" <InputField
id="username" label="Password"
type="text" type="password"
placeholder="Username" value={password}
value={username} onChange={(e) => {
onChange={(e) => { setPassword(e.target.value);
setUsername(e.target.value); }}
}} />
/>
</div>
<div className="mb-6">
<label
className="block text-gray-700 text-sm font-sans font-bold mb-2"
htmlFor="password"
>
Password
</label>
<input
className="appearance-none border-2 border-black rounded-2xl w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
id="password"
type="password"
placeholder="Choose password"
value={password}
onChange={(e) => {
setPassword(e.target.value);
}}
/>
</div>
<div className="flex items-center justify-between"> <div className="flex items-center justify-between">
<Button <Button
text="Register" text="Register"