devops/encoach_frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Improved the responsiveness of the login and register pages on mobile

Browse Source
This commit is contained in:
Tiago Ribeiro
2023-08-28 15:47:04 +01:00
parent c879d5d8de
commit 3c711e0279
3 changed files with 19 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/pages/register.tsx
View File

@@ -59,12 +59,12 @@ export default function Register() {
<div className="absolute h-full w-full bg-mti-rose-light z-10 bg-opacity-50" />
<img src="/people-talking-tablet.png" alt="People smiling looking at a tablet" className="h-full aspect-auto" />
</section>
<section className="h-full w-full flex flex-col items-center justify-center gap-12">
<div className="flex flex-col gap-2 items-center relative">
<img src="/logo_title.png" alt="EnCoach's Logo" className="w-64 absolute -top-64" />
<h1 className="font-bold text-4xl">Create new account</h1>
<section className="h-full w-full flex flex-col items-center justify-center gap-4">
<div className="flex flex-col gap-2 items-center relative mb-4">
<img src="/logo_title.png" alt="EnCoach's Logo" className="w-36 lg:w-64 absolute -top-36 lg:-top-64" />
<h1 className="font-bold text-2xl lg:text-4xl">Create new account</h1>
</div>
<form className="flex flex-col items-center gap-6 w-1/2" onSubmit={register}>
<form className="flex flex-col items-center gap-6 w-full -lg:px-8 lg:w-1/2" onSubmit={register}>
<Input type="text" name="name" onChange={(e) => setName(e)} placeholder="Enter your name" required />
<Input type="email" name="email" onChange={(e) => setEmail(e)} placeholder="Enter email address" required />
<Input type="password" name="password" onChange={(e) => setPassword(e)} placeholder="Enter your password" required />
@@ -75,7 +75,7 @@ export default function Register() {
placeholder="Confirm your password"
required
/>
<Button className="mt-8 w-full" color="purple" disabled={isLoading}>
<Button className="lg:mt-8 w-full" color="purple" disabled={isLoading}>
{!isLoading && "Create account"}
{isLoading && (
<div className="flex items-center justify-center">