Add app shell built using angular-material and flex-layout. Refractor code due to configuration changes. Fixes #52
65 lines
2.8 KiB
HTML
65 lines
2.8 KiB
HTML
<!-- TODO: UPDATE WITH ANGULAR MATERIAL -->
|
|
|
|
<div class="login-container bg-light">
|
|
<div class="login-box">
|
|
<img class="text-center img-responsive" src="assets/images/mifos-logo-flat.png" style="width:30%">
|
|
<div>
|
|
<h6 class="d-inline-block">v{{version}}</h6>
|
|
<div class="d-inline-block ml-3" ngbDropdown>
|
|
<button id="language-dropdown" class="btn btn-sm btn-secondary" ngbDropdownToggle>
|
|
{{currentLanguage}}
|
|
</button>
|
|
<div ngbDropdownMenu aria-labelledby="language-dropdown">
|
|
<button class="dropdown-item" *ngFor="let language of languages" (click)="setLanguage(language)">
|
|
{{language}}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="container">
|
|
<div class="card col-md-6 mt-3 mx-auto">
|
|
<div class="card-body">
|
|
<h4 class="card-title text-center">
|
|
<i class="far fa-3x fa-user-circle text-muted"></i>
|
|
</h4>
|
|
<form (ngSubmit)="login()" [formGroup]="loginForm" novalidate>
|
|
<div class="alert alert-danger" [hidden]="!error || isLoading" translate>
|
|
Username or password incorrect.
|
|
</div>
|
|
<div class="form-group">
|
|
<label class="d-block">
|
|
<input type="text" class="form-control" formControlName="username" autocomplete="username"
|
|
[placeholder]="'Username' | translate"/>
|
|
<span hidden translate>Username</span>
|
|
<small [hidden]="loginForm.controls.username.valid || loginForm.controls.username.untouched"
|
|
class="text-danger" translate>
|
|
Username is required
|
|
</small>
|
|
</label>
|
|
<label class="d-block">
|
|
<input type="password" class="form-control" formControlName="password" autocomplete="current-password"
|
|
[placeholder]="'Password' | translate" required/>
|
|
<span hidden translate>Password</span>
|
|
<small [hidden]="loginForm.controls.password.valid || loginForm.controls.password.untouched"
|
|
class="text-danger" translate>
|
|
Password is required
|
|
</small>
|
|
</label>
|
|
<div class="form-check">
|
|
<label class="form-check-label">
|
|
<input type="checkbox" class="form-check-input" formControlName="remember"/>
|
|
<span translate>Remember me</span>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<button class="btn btn-primary w-100" type="submit" [disabled]="loginForm.invalid || isLoading">
|
|
<i class="fas fa-cog fa-spin" [hidden]="!isLoading"></i>
|
|
<span translate>Login</span>
|
|
</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|