LP2000482 Angular 15 and Bootstrap 5 upgrade
[evergreen-equinox.git] / Open-ILS / src / eg2 / src / app / staff / login.component.html
index 31edfcf..939fe52 100644 (file)
@@ -5,54 +5,60 @@
       <hr class="mt-1"/>
       <form (ngSubmit)="handleSubmit()" #loginForm="ngForm" class="form-validated">
 
-        <div class="form-group row">
-          <label class="col-lg-4 text-right font-weight-bold" for="username" i18n>Username</label>
-          <input 
-            type="text" 
-            class="form-control col-lg-8"
-            id="username" 
-            name="username"
-            required
-            autocomplete="username"
-            i18n-placeholder
-            placeholder="Username" 
-            [(ngModel)]="args.username"/>
+        <div class="row row-cols-auto">
+          <label class="form-label col-form-label fw-bold col-4 text-end" for="username" i18n>Username</label>
+          <div class="col-8">
+            <input 
+              type="text" 
+              class="form-control"
+              id="username" 
+              name="username"
+              required
+              autocomplete="username"
+              i18n-placeholder
+              placeholder="Username" 
+              [(ngModel)]="args.username"/>
+          </div>
         </div>
 
-        <div class="form-group row">
-          <label class="col-lg-4 text-right font-weight-bold" for="password" i18n>Password</label>
-          <input 
-            type="password" 
-            class="form-control col-lg-8"
-            id="password" 
-            name="password"
-            required
-            autocomplete="current-password"
-            i18n-placeholder
-            placeholder="Password" 
-            [(ngModel)]="args.password"/>
+        <div class="row row-cols-auto mt-3">
+          <label class="form-label col-form-label fw-bold col-4 text-end" for="password" i18n>Password</label>
+          <div class="col-8">
+            <input 
+              type="password" 
+              class="form-control"
+              id="password" 
+              name="password"
+              required
+              autocomplete="current-password"
+              i18n-placeholder
+              placeholder="Password" 
+              [(ngModel)]="args.password"/>
+          </div>
         </div>
 
-        <div class="form-group row" *ngIf="workstations && workstations.length">
-          <label class="col-lg-4 text-right font-weight-bold" for="workstation" i18n>Workstation</label>
-          <select 
-            class="form-control col-lg-8" 
-            id="workstation" 
-            name="workstation"
-            required
-            [(ngModel)]="args.workstation">
-            <option *ngFor="let ws of workstations" [value]="ws.name">
-              {{ws.name}}
-            </option>
-          </select>
+        <div class="row row-cols-auto mt-3" *ngIf="workstations && workstations.length">
+          <label class="form-label col-form-label col-4 text-end fw-bold" for="workstation" i18n>Workstation</label>
+          <div class="col-8">
+            <select 
+              class="form-control" 
+              id="workstation" 
+              name="workstation"
+              required
+              [(ngModel)]="args.workstation">
+              <option *ngFor="let ws of workstations" [value]="ws.name">
+                {{ws.name}}
+              </option>
+            </select>
+          </div>
         </div>
 
-        <div class="row">
-          <div class="col-lg-2 offset-lg-4 pl-0">
+        <div class="row row-cols-auto mt-3">
+          <div class="col-2 offset-4">
             <button type="submit" class="btn btn-outline-dark" i18n>Sign In</button>
           </div>
-          <div class="col-lg-4" *ngIf="loginFailed">
-            <div class="badge badge-warning p-2" i18n>Login Failed</div>
+          <div class="col-4" *ngIf="loginFailed">
+            <div class="badge rounded-pill bg-warning p-2" i18n>Login Failed</div>
           </div>
         </div>