47 lines
1.7 KiB
HTML
47 lines
1.7 KiB
HTML
@if (successMessage) {
|
|
<div
|
|
class="px-4 py-3 mb-8 bg-teal-100 rounded-lg text-teal-800 text-sm mt-10 max-w-11/12 sm:max-w-8/12 mx-auto"
|
|
>
|
|
<p>{{successMessage}}</p>
|
|
</div>
|
|
}
|
|
<section class="my-5 sm:my-10 flex justify-center items-center">
|
|
<article class="card max-w-11/12 sm:max-w-8/12 grid md:grid-cols-2 lg:grid-cols-3 gap-4">
|
|
<div class="md:col-span-1 lg:col-span-2">
|
|
<img
|
|
src="/assets/images/login-page.jpg"
|
|
alt=""
|
|
class="rounded-lg object-cover w-full h-full"
|
|
/>
|
|
</div>
|
|
|
|
<article class="space-y-4">
|
|
<h1 class="text-3xl text-gray-800 font-space font-bold">Login</h1>
|
|
|
|
<h2 class="text-xl text-gray-600">Get access to your Orders, Wishlist and Recommendations</h2>
|
|
|
|
<form [formGroup]="loginForm" (ngSubmit)="loginUser()" class="flex flex-col space-y-5">
|
|
<fieldset class="fieldset">
|
|
<legend class="fieldset-legend">Email</legend>
|
|
<input formControlName="email" type="text" class="input" placeholder="Enter email here" />
|
|
<p class="label">your-email-address@email.com</p>
|
|
<app-error fieldName="email" [control]="loginForm.get('email')" />
|
|
</fieldset>
|
|
|
|
<fieldset class="fieldset">
|
|
<legend class="fieldset-legend">Password</legend>
|
|
<input formControlName="password" type="password" class="input" placeholder="Type here" />
|
|
<app-error fieldName="password" [control]="loginForm.get('password')" />
|
|
</fieldset>
|
|
|
|
<button type="submit" class="btn btn-black py-2">Login</button>
|
|
</form>
|
|
<a
|
|
routerLink="/register"
|
|
class="text-xs text-gray-800 text-center w-full block hover:text-teal-600"
|
|
>New User ? Sign Up</a
|
|
>
|
|
</article>
|
|
</article>
|
|
</section>
|