<div class="popup">
  <form [formGroup]="form" (submit)="onSubmit()">
    <div class="header">
      <h2>Вход</h2>
      <button type="button" class="close" (click)="close()"></button>
    </div>
    <div class="body">
      <div class="field" [class.invalid]="username.invalid && username.touched">
        <label for="username">Логин</label>
        <input id="username" formControlName="username" type="email" />
      </div>
      <div class="field" [class.invalid]="password.invalid && password.touched">
        <label for="password">Пароль</label>
        <input id="password" formControlName="password" [type]="type" autocomplete="off" />
        <div class="eye {{type==='password'?'show':'hide'}}" (click)="type=type==='password'?'text':'password'"></div>
      </div>
      <div *ngIf="error" class="error">{{error}}</div>
      <div class="bar">
        <div class="remember">
          <input id="remember" type="checkbox" class="checkbox" />
          <label for="remember">Запомнить меня</label>
        </div>
        <div class="forget" (click)="forget()">Забыли пароль?</div>
      </div>
    </div>
    <div class="footer">
      <!-- <button type="button" class="btn secondary" (click)="signup()">Зарегистрироваться</button> -->
      <button [disabled]="loading" type="submit" class="btn">Войти</button>
    </div>
  </form>
</div>
