frontend/src/app/app.config.ts

@@ -5,5 +5,8 @@ import { provideAnimations } from '@angular/platform-browser/animations';
 import { routes } from './app.routes';
 
 export const appConfig: ApplicationConfig = {
-  providers: [provideRouter(routes, withComponentInputBinding()), provideAnimations()],
+  providers: [
+    provideRouter(routes, withComponentInputBinding()),
+    provideAnimations(),
+  ],
 };

frontend/src/app/app.routes.ts

@@ -2,5 +2,11 @@ import { Routes } from '@angular/router';
 
 export const routes: Routes = [
   { path: '', pathMatch: 'full', redirectTo: '' },
-  { path: 'signup', loadComponent: () => import('./pages/register-root/register-root.component').then(m => m.RegisterRootComponent) },
+  {
+    path: 'signup',
+    loadComponent: () =>
+      import('./pages/register-root/register-root.component').then(
+        (m) => m.RegisterRootComponent
+      ),
+  },
 ];

frontend/src/app/pages/register-root/register-root.component.html

@@ -8,19 +8,25 @@
     <h1>
       @if (this.isSignupSignal()) {
         Registrieren
-      }
-      @else if (this.isRegisterSignal()) {
+      } @else if (this.isRegisterSignal()) {
         Anmelden
-      }
-      @else {
+      } @else {
         Erste Schritte
       }
     </h1>
 
     @if (this.isDisplayButtons()) {
       <div class="action">
-        <button pButton type="button" label="Anmelden" (click)="toggleAction('register')"></button>
-        <button pButton type="button" label="Registrieren" (click)="toggleAction('signup')"></button>
+        <button
+          pButton
+          type="button"
+          label="Anmelden"
+          (click)="toggleAction('register')"></button>
+        <button
+          pButton
+          type="button"
+          label="Registrieren"
+          (click)="toggleAction('signup')"></button>
       </div>
     }
 
@@ -35,8 +41,7 @@
               pInputText
               id="email"
               formControlName="email"
-              aria-describedby="e-mail"
-            />
+              aria-describedby="e-mail" />
           </div>
           <div class="password">
             <div class="label">
@@ -47,8 +52,7 @@
               id="password"
               formControlName="password"
               aria-describedby="password"
-              type="password"
-            />
+              type="password" />
           </div>
           <div class="signup">
             <button pButton type="submit" label="Anmelden"></button>

frontend/src/app/pages/register-root/register-root.component.scss

@@ -52,7 +52,8 @@
       padding: 0 0 0.5em;
     }
 
-    .e-mail, .password {
+    .e-mail,
+    .password {
       .label {
         font-size: 1.5em;
       }

frontend/src/app/pages/register-root/register-root.component.ts

@@ -1,7 +1,19 @@
-import { CommonModule } from "@angular/common";
-import { ChangeDetectionStrategy, Component, OnInit, WritableSignal, signal } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import {
+  ChangeDetectionStrategy,
+  Component,
+  OnInit,
+  WritableSignal,
+  signal,
+} from '@angular/core';
 import { InputTextModule } from 'primeng/inputtext';
-import { FormBuilder, FormGroup, FormsModule, ReactiveFormsModule, Validators } from "@angular/forms";
+import {
+  FormBuilder,
+  FormGroup,
+  FormsModule,
+  ReactiveFormsModule,
+  Validators,
+} from '@angular/forms';
 import { ButtonModule } from 'primeng/button';
 
 type AuthAction = 'register' | 'signup';
@@ -14,25 +26,24 @@ type AuthAction = 'register' | 'signup';
     FormsModule,
     InputTextModule,
     ReactiveFormsModule,
-        ButtonModule
+    ButtonModule,
   ],
   templateUrl: './register-root.component.html',
   styleUrl: './register-root.component.scss',
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class RegisterRootComponent implements OnInit {
-
   public form: FormGroup | undefined;
-  public isRegisterSignal: WritableSignal<boolean> = signal(false)
-  public isSignupSignal: WritableSignal<boolean> = signal(false)
-  public isDisplayButtons: WritableSignal<boolean> = signal(true)
+  public isRegisterSignal: WritableSignal<boolean> = signal(false);
+  public isSignupSignal: WritableSignal<boolean> = signal(false);
+  public isDisplayButtons: WritableSignal<boolean> = signal(true);
 
   constructor(private readonly formBuilder: FormBuilder) {}
 
   ngOnInit() {
     this.form = this.formBuilder.group({
       email: ['', [Validators.required, Validators.email]],
-      password: ['', [Validators.required, Validators.minLength(6)]]
+      password: ['', [Validators.required, Validators.minLength(6)]],
     });
   }
 
@@ -46,5 +57,4 @@ export class RegisterRootComponent implements OnInit {
   public onSubmit() {
     console.log('signup');
   }
-  
 }

frontend/src/environments/environment.prod.ts

@@ -2,6 +2,6 @@ export const environment = {
   production: true,
   oauth: {
     clinetId: 'app_FLXnxSBnnaKkXoYCgk3J62iA',
-    redirectUri: 'https://commonly-hot-airedale.ngrok-free.app/oauth'
-  }
+    redirectUri: 'https://commonly-hot-airedale.ngrok-free.app/oauth',
+  },
 };

frontend/src/environments/environment.ts

@@ -2,6 +2,6 @@ export const environment = {
   production: false,
   oauth: {
     clinetId: 'app_FLXnxSBnnaKkXoYCgk3J62iA',
-    redirectUri: 'https://commonly-hot-airedale.ngrok-free.app/oauth'
-  }
+    redirectUri: 'https://commonly-hot-airedale.ngrok-free.app/oauth',
+  },
 };

frontend/src/styles.scss

@@ -1,3 +1,9 @@
 // Import PrimeNG styles
 @import 'primeng/resources/themes/lara-light-blue/theme.css';
 @import 'primeng/resources/primeng.css';
+
+html,
+body {
+  height: 100%;
+  margin: 0;
+}