improved css (at least tried to) and fixed bugs in management page

src/app/component/list/list.component.ts

@@ -73,21 +73,6 @@ export class ListComponent implements OnInit, OnChanges {
       setTimeout(() => {
         if (!this.positionCord) {
           this.positionNotFound = true;
-        } else {
-          if (this.waypoints) {
-            if (!this.waypoints[0].distance) {
-              this.positionNotFound = true;
-            } else {
-              this.positionNotFound = false;
-            }
-          }
-          if (this.locations) {
-            if (!this.locations[0].distance) {
-              this.positionNotFound = true;
-            } else {
-              this.positionNotFound = false;
-            }
-          }
         }
       }, 5000);
     }

src/app/component/management/management.component.html

@@ -142,7 +142,7 @@
   <div class="form-container">
     <h2>Add Location</h2>
     <form
-      (submit)="addWaypoint(newWaypoint.name, newWaypoint.lat, newWaypoint.lon, newWaypoint.description, newWaypoint.image, newWaypoint.locationName)">
+      (submit)="addWaypoint(newWaypoint.name, newWaypoint.lat, newWaypoint.lon, newWaypoint.description, newWaypoint.img, newWaypoint.locationName)">
       <div>
         <label for="waypointName">Waypoint:</label>
         <input type="text" id="waypointName" name="waypointName" [(ngModel)]="newWaypoint.name">

src/app/component/management/management.component.ts

@@ -6,6 +6,7 @@ import {ActivatedRoute} from "@angular/router";
 import {LocationService} from "../../service/http/location.service";
 import {UserService} from "../../service/http/user.service";
 import {WaypointService} from "../../service/http/waypoint.service";
+import {toNumbers} from "@angular/compiler-cli/src/version_helpers";
 
 @Component({
   selector: 'app-home',
@@ -18,9 +19,9 @@ export class ManagementComponent implements OnInit {
   showLocationForm: boolean = false;
   showWaypointForm: boolean = false;
 
-  newUser: UserEntity;
+  newUser: UserEntity = {name: "", password: "", username: ""};
-  newLocation: LocationEntity;
+  newLocation: LocationEntity = {lat: 0, location: "", lon: 0, region: ""};
-  newWaypoint: WaypointsEntity;
+  newWaypoint: WaypointsEntity = {description: "", img: "", lat: 0, locationName: "", lon: 0, name: ""};
 
   locations: LocationEntity[] | undefined;
   waypoints: WaypointsEntity[] | undefined;
@@ -56,15 +57,15 @@ export class ManagementComponent implements OnInit {
   }
 
   addLocation(name: string, region: string, lat: number, lon: number) {
-    this.newLocation = {name: name, region: region, lat: lat, lon: lon};
+    this.newLocation = {location: name, region: region, lat: lat, lon: lon};
     this.locationService.createLocation(this.newLocation).subscribe(location => {
       this.locations?.push(location);
     });
     this.showLocationForm = false;
   }
 
-  addWaypoint(name: string, lat: string, lon: string, description: string, image: string, locationName: string) {
+  addWaypoint(name: string, lat: number, lon: number, description: string, image: string, locationName: string) {
-    this.newWaypoint = {name: name, lat: lat, lon: lon, description: description, img: image, locationName: locationName};
+    this.newWaypoint = {description: description, img: image, lat: lat, locationName: locationName, lon: lon, name: name}
     this.waypointService.createWaypoint(this.newWaypoint).subscribe(waypoint => {
       this.waypoints?.push(waypoint);
     });
@@ -94,4 +95,6 @@ export class ManagementComponent implements OnInit {
   closeWaypointForm() {
     this.showWaypointForm = false;
   }
+
+  protected readonly String = String;
 }

src/app/home/home.component.css

@@ -1,12 +1,7 @@
 .search {
-  display: flex;
   align-items: center;
   justify-content: center;
   flex-direction: column;
-  position: absolute;
-  top: 35%;
-  left: 50%;
-  transform: translate(-50%, -50%);
 }
 
 input {
@@ -16,10 +11,8 @@ input {
 }
 
 #list {
-  position: absolute;
+  align-self: center;
-  top: 46%;
+  height: auto;
-  left: 44%;
-  transform: translate(-50%, -50%);
   justify-content: center;
   align-items: center;
   align-content: center;
@@ -40,13 +33,13 @@ input {
 }
 
 .bg-image {
+  padding-top: 25%;
   background-image: url('src/assets/img/mountains.png');
   background-size: cover;
   background-repeat: no-repeat;
   background-position: center center;
-  height: 100vh;
+  height: 94vh;
+  display: flex;
+  flex-direction: column;
 }
 
-#translate{
-  margin: 100px 10px 10px 10px;
-}

src/app/home/home.component.html

@@ -1,6 +1,6 @@
 <div [ngClass]="{'background-color': backgroundColor}">
 
-  <div class="alert alert-warning shadow-lg" *ngIf="allert">
+  <div class="alert alert-warning shadow-lg" *ngIf="allert" id="alert">
     <div>
       <svg xmlns="http://www.w3.org/2000/svg" class="stroke-current flex-shrink-0 h-6 w-6" fill="none"
            viewBox="0 0 24 24">
@@ -11,7 +11,7 @@
     </div>
   </div>
 
-  <div class="dropdown dropdown-hover">
+  <div class="dropdown dropdown-hover" id="translate">
     <label tabindex="0" class="btn m-1 bg-black border-neutral text-base-100">{{translations.translate}}</label>
     <ul tabindex="0" class="dropdown-content menu p-2 shadow rounded-box w-52">
       <li (click)="switchLanguage('DE')"><a>DE</a></li>
@@ -22,6 +22,7 @@
   </div >
 
   <div class="bg-image">
+
     <div class="search">
 
       <div class="inputElements">

src/app/interface/WaypointsEntity.ts

@@ -1,5 +1,5 @@
 export interface WaypointsEntity {
-  id: number;
+  id?: number;
   name: string;
   lat: number;
   lon: number;