Kavita/UI/Web/src/app/user-login/user-login.component.html

44 lines
No EOL
2.3 KiB
HTML

<div class="mx-auto login">
<div class="display: inline-block" *ngIf="firstTimeFlow">
<h3 class="card-title text-center">Create an Admin Account</h3>
<div class="card p-3">
<p>Please create an admin account for yourself to start your reading journey.</p>
<app-register-member (created)="onAdminCreated($event)" [firstTimeFlow]="firstTimeFlow"></app-register-member>
</div>
</div>
<form [formGroup]="loginForm" (ngSubmit)="login()" novalidate class="needs-validation" *ngIf="!firstTimeFlow">
<div class="row row-cols-4 row-cols-md-4 row-cols-sm-2 row-cols-xs-2">
<ng-container *ngFor="let member of memberNames">
<div class="col align-self-center card p-3 m-3" style="width: 12rem;">
<span tabindex="0" (click)="select(member)" a11y-click="13,32">
<div class="logo-container">
<h3 class="card-title text-center">{{member | titlecase}}</h3>
</div>
</span>
<div class="card-text" #collapse="ngbCollapse" [(ngbCollapse)]="isCollapsed[member]" (keyup.enter)="$event.stopPropagation()">
<div class="form-group" [ngStyle]="authDisabled ? {display: 'none'} : {}">
<label for="username--{{member}}">Username</label>
<input class="form-control" formControlName="username" id="username--{{member}}" type="text" [readonly]="authDisabled">
</div>
<div class="form-group">
<label for="password--{{member}}">Password</label>
<input class="form-control" formControlName="password" id="password--{{member}}" type="password" autofocus>
<div *ngIf="authDisabled" class="invalid-feedback">
Authentication is disabled. Only type password if this is an admin account.
</div>
</div>
<div class="float-right">
<button class="btn btn-primary alt" type="submit--{{member}}">Login</button>
</div>
</div>
</div>
</ng-container>
</div>
</form>
</div>