RiffMaster_WPFaT2023_Project/Frontend/RiffMasterFront/src/app/login-page/login-page.component.html

<!-- login.component.html -->

<div class="container">
  <div class="margin-column"></div> <!-- First margin column -->

  <div class="col-left">
    <mat-card class="login-card">

      <mat-card-header>
        <mat-card-title class="card-title">Login</mat-card-title>
      </mat-card-header>

      <mat-card-content>

        <mat-form-field appearance="fill">
          <mat-label>Login</mat-label>
          <input matInput type="login" placeholder="Enter your login" [(ngModel)]="formData.login">
        </mat-form-field>

        <mat-form-field appearance="fill">
          <mat-label>Password</mat-label>
          <input matInput type="password" placeholder="Enter your password" [(ngModel)]="formData.password">
        </mat-form-field>

        <div class="signup-link">
          Don't have an account? <a [routerLink]="['/register']">Sign Up</a>
        </div>

        <button mat-raised-button color="primary" class="login-button" (click)="login()">
          Login
        </button>

      </mat-card-content>

    </mat-card>
  </div>


  <div class="margin-column"></div> <!-- Second margin column -->
</div>