soma-frontend/src/app/components/login/login.component.html

<div id="wrapper">
  <div class="vertical-align-wrap">
    <div class="vertical-align-middle auth-main">
      <div class="auth-box">
        <div class="top">
          <img alt="Inverlec" src="./assets/img/inverlec_logo.png">
        </div>
        <div class="card">
          <div class="header">
            <p class="lead">Iniciar sesión con tu cuenta</p>
          </div>
          <div class="body">
            <form [formGroup]="loginForm" (ngSubmit)="login()">
              <div class="form-group">
                <label for="email">Correo electrónico</label>

                <input type="text" name="email" class="form-control"
                formControlName="email" [ngClass]="{ 'is-invalid': submitted && f.email.errors }" email/>
                <div *ngIf="submitted && f.email.errors" class="invalid-feedback">
                  <div>Ingresar un correo válido</div>
                </div>
  
              </div>
              <div class="form-group">
                <label for="password">Contraseña</label>
                <input type="password" name="password"  class="form-control"
                formControlName="password" minlength="5"  [ngClass]="{ 'is-invalid': submitted && f.password.errors }"/>
                <div *ngIf="submitted && f.password.errors" class="invalid-feedback">
                  <div *ngIf="f.password.errors.required">Ingresar contraseña</div>
                </div>
  
              </div>
  
              <button class="btn btn-primary" type="submit"> 
                Iniciar sesión
              </button>
            </form>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>