41 lines
2.1 KiB
HTML
41 lines
2.1 KiB
HTML
<div class="container-centered">
|
|
@if(error()) {
|
|
<div class="flex items-start sm:items-center p-4 mb-4 text-sm text-fg-danger-strong rounded-base bg-danger-soft"
|
|
role="alert">
|
|
<svg class="w-4 h-4 me-2 shrink-0 mt-0.5 sm:mt-0" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
|
|
width="24" height="24" fill="none" viewBox="0 0 24 24">
|
|
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M10 11h2v5m-2 0h4m-2.592-8.5h.01M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
|
|
</svg>
|
|
<p><span class="font-medium me-1">Error</span> {{error()}}</p>
|
|
</div>
|
|
}
|
|
<div class="card-container">
|
|
<div class="card">
|
|
<h1 class="title">Sign In</h1>
|
|
<form class="form-group" #form="ngForm" (ngSubmit)="onSubmit(form)">
|
|
<div class="form-control">
|
|
<label class="label" for="email">Email</label>
|
|
<input id="email" type="email" name="email" class="input" ngModel placeholder="example@domain.it"
|
|
#email="ngModel" email required />
|
|
@if(isInvalid(email)) {
|
|
<p class="helper-text text-red-500!">Invalid Email</p>
|
|
}
|
|
</div>
|
|
<div class="form-control">
|
|
<label class="label" for="password">Password</label>
|
|
<input id="password" type="password" name="password" class="input" autocomplete="off" ngModel
|
|
placeholder="********" #password="ngModel" required />
|
|
@if(isInvalid(password)) {
|
|
<p class="helper-text text-red-500!">Password Required</p>
|
|
}
|
|
</div>
|
|
<button type="submit" [disabled]="form.invalid" class="button">Sign In</button>
|
|
<p class="helper-text">
|
|
Don't have an account yet?
|
|
<a routerLink="/sign-up" class="link">Sign Up</a>
|
|
</p>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div> |