1 files changed, 64 insertions, 0 deletions
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/core/auth/login/login.component.html b/src/pybind/mgr/dashboard/frontend/src/app/core/auth/login/login.component.html
new file mode 100644
index 000000000..8565c3615
--- /dev/null
+++ b/src/pybind/mgr/dashboard/frontend/src/app/core/auth/login/login.component.html
@@ -0,0 +1,64 @@
+<div class="container"
+     *ngIf="isLoginActive">
+  <form name="loginForm"
+        (ngSubmit)="login()"
+        #loginForm="ngForm"
+        novalidate>
+
+    <!-- Username -->
+    <div class="form-group has-feedback d-flex flex-column py-3">
+      <label class="placeholder pl-4"
+             for="username"
+             i18n>Username</label>
+      <input id="username"
+             name="username"
+             [(ngModel)]="model.username"
+             #username="ngModel"
+             type="text"
+             [attr.aria-invalid]="username.invalid"
+             aria-labelledby="username"
+             class="form-control pl-4"
+             required
+             autofocus>
+      <div class="invalid-feedback pl-4"
+           *ngIf="(loginForm.submitted || username.dirty) && username.invalid"
+           i18n>Username is required</div>
+    </div>
+
+    <!-- Password -->
+    <div class="form-group has-feedback"
+         id="password-div">
+      <div class="input-group d-flex flex-nowrap">
+        <div class="d-flex flex-column flex-grow-1 py-3">
+          <label class="placeholder pl-4"
+                 for="password"
+                 i18n>Password</label>
+          <input id="password"
+                 name="password"
+                 [(ngModel)]="model.password"
+                 #password="ngModel"
+                 type="password"
+                 [attr.aria-invalid]="password.invalid"
+                 aria-labelledby="password"
+                 class="form-control pl-4"
+                 required>
+          <div class="invalid-feedback pl-4"
+               *ngIf="(loginForm.submitted || password.dirty) && password.invalid"
+               i18n>Password is required</div>
+        </div>
+        <span class="form-group-append">
+          <button type="button"
+                  class="btn btn-outline-light btn-password h-100 px-4"
+                  cdPasswordButton="password">
+          </button>
+        </span>
+      </div>
+    </div>
+
+    <input type="submit"
+           class="btn btn-accent px-5 py-2"
+           [disabled]="loginForm.invalid"
+           value="Log in"
+           i18n-value>
+  </form>
+</div>