Not fully styled/finished version of header and home page + all images

frontend/src/app/header/header.component.ts

@@ -0,0 +1,38 @@
+import {Component, Input, OnInit} from '@angular/core';
+
+@Component({
+  standalone: false,
+  selector: 'app-header',
+  templateUrl: './header.component.html',
+  styleUrls: ['./header.component.scss']
+})
+export class HeaderComponent implements OnInit {
+  @Input() title: string = '';
+  @Input() current_page: string = ''
+
+  public ngOnInit(): void {
+    this.toggleTheme()//TODO fix theme
+  }
+
+  public getCurrentPageId(options: string[]) {
+    if (options.includes(this.current_page)) {
+      return 'current_page'
+    }
+    return null;
+  }
+
+  public setTheme(themeName: string) {
+    localStorage.setItem('theme', themeName);
+    document.body.className = themeName;
+  }
+
+  // function to toggle between light and dark theme
+  public toggleTheme() {
+    if (localStorage.getItem('theme') === 'theme-light') {
+      this.setTheme('theme-dark');
+    } else {
+      this.setTheme('theme-light');
+    }
+  }
+
+}