routing added

src/app/app-routing.module.ts

@@ -1,10 +1,19 @@
-import { NgModule } from '@angular/core';
+import { NgModule } from "@angular/core";
-import { Routes, RouterModule } from '@angular/router';
+import { Routes, RouterModule } from "@angular/router";
+import { AppComponent } from "./app.component";
+import { AdminComponent } from "./admin/admin.component";
+import { StatusListComponent } from "./status-list/status-list.component";
 
-const routes: Routes = [];
+const routes: Routes = [
+  { path: "", component: StatusListComponent },
+  {
+    path: "admin",
+    component: AdminComponent
+  }
+];
 
 @NgModule({
   imports: [RouterModule.forRoot(routes)],
   exports: [RouterModule]
 })
-export class AppRoutingModule { }
+export class AppRoutingModule {}

src/app/app.component.html

@@ -1,6 +1,4 @@
 <div class="container">
-  <router-outlet></router-outlet>
   <app-header></app-header>
-  <!--<app-status-list> </app-status-list>-->
+  <router-outlet></router-outlet>
-  <app-admin></app-admin>
 </div>

src/app/status-list/status-list.component.html

@@ -5,13 +5,30 @@
       <button
         class="room-button"
         [ngStyle]="{
-          color: device.lastStatus == 1 ? 'red' : 'green',
+          color: 'black',
-          borderColor: device.lastStatus == 1 ? 'red' : 'green'
+          backgroundColor:
+            device.lastStatus == 1
+              ? 'red'
+              : device.lastStatus == 0
+              ? 'green'
+              : 'yellow',
+          borderColor:
+            device.lastStatus == 1
+              ? 'red'
+              : device.lastStatus == 0
+              ? 'green'
+              : 'yellow'
         }"
       >
         {{ device.name }}
       </button>
-      <b>{{ device.lastStatus == 1 ? "Zajęte" : "Wolne" }}</b>
+      <b>{{
+        device.lastStatus == 1
+          ? "Zajęte"
+          : device.lastStatus == 0
+          ? "Wolne"
+          : "Brak połączenia z czujnikiem"
+      }}</b>
     </div>
   </div>
 </div>

src/app/status-list/status-list.component.less

@@ -195,3 +195,8 @@ table {
     }
   }
 }
+
+.example-button-row button,
+.example-button-row a {
+  margin-right: 8px;
+}