grassrootseconomics/cic-staff-client
5
0
Fork 0
Code Issues 26 Pull Requests Projects Releases Wiki Activity

Fix form alignment.

Browse Source
This commit is contained in:
Spencer Ofwiti 2021-04-21 12:03:09 +03:00
parent 632669ddf4
commit 53ed56460c
2 changed files with 27 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
src/app/auth/auth.component.html
View File

@ -37,23 +37,25 @@
<h4 id="passwordState" class="text-dark-50 text-center font-weight-bold"></h4> <h4 id="passwordState" class="text-dark-50 text-center font-weight-bold"></h4>
</div> </div>
<form [formGroup]="passwordForm" (ngSubmit)="onPasswordInput()"> <div class="center-items">
<form [formGroup]="passwordForm" (ngSubmit)="onPasswordInput()">
<mat-form-field appearance="outline"> <mat-form-field appearance="outline">
<mat-label>Password</mat-label> <mat-label>Password</mat-label>
<input matInput type="password" formControlName="password" placeholder="Enter your private key password..." <input matInput type="password" formControlName="password" placeholder="Enter your private key password..."
[errorStateMatcher]="matcher"> [errorStateMatcher]="matcher">
<div *ngIf="passwordForm && passwordFormStub.password.errors" class="invalid-feedback"> <div *ngIf="passwordForm && passwordFormStub.password.errors" class="invalid-feedback">
<mat-error *ngIf="passwordFormStub.password.errors.required">Private Key password is required.</mat-error> <mat-error *ngIf="passwordFormStub.password.errors.required">Private Key password is required.</mat-error>
</div> </div>
</mat-form-field> </mat-form-field>
<button mat-raised-button matRipple color="primary" type="submit" class="ml-3" [disabled]="passwordFormLoading"> <button id="passwordLoginButton" mat-raised-button matRipple color="primary" type="submit" class="ml-3" [disabled]="passwordFormLoading">
<span *ngIf="passwordFormLoading" class="spinner-border spinner-border-sm mr-1"></span> <span *ngIf="passwordFormLoading" class="spinner-border spinner-border-sm mr-1"></span>
Login Login
</button> </button>
</form> </form>
</div>
<div class="row mt-3"> <div class="row mt-3">
<div class="col-12 text-center"> <div class="col-12 text-center">

11
src/styles.scss
View File

@ -29,6 +29,12 @@ a, a:hover, a:focus {
perspective: 1500px; perspective: 1500px;
} }
.center-items {
display: flex;
justify-content: center;
align-items: center;
}
#sidebar { #sidebar {
min-width: 250px; min-width: 250px;
max-width: 250px; max-width: 250px;
@ -211,6 +217,11 @@ a[data-toggle="collapse"] {
overflow: initial; overflow: initial;
} }
#passwordLoginButton {
height: 3.0rem;
padding-top: 0.5rem;
}
button { button {
height: 2.5rem; height: 2.5rem;
} }