From afe40a8fea53344fcedb359827b7e904f151824c Mon Sep 17 00:00:00 2001
From: JakubWalkowiak <jakub.walkowiak6@wp.pl>
Date: Tue, 8 Feb 2022 22:22:43 +0100
Subject: [PATCH] styling

---
 .../components/todo-list/todo-list.component.html  |  4 ++--
 .../app/user/components/base/base.component.html   |  4 ++--
 .../app/user/components/login/login.component.html |  1 -
 .../components/register/register.component.html    |  1 -
 .../todo-app/src/app/user/user-routing.module.ts   | 14 ++++++++++----
 todo-app/todo-app/src/styles.scss                  |  4 ++++
 6 files changed, 18 insertions(+), 10 deletions(-)

diff --git a/todo-app/todo-app/src/app/todo/components/todo-list/todo-list.component.html b/todo-app/todo-app/src/app/todo/components/todo-list/todo-list.component.html
index cf65b90..765d2f4 100644
--- a/todo-app/todo-app/src/app/todo/components/todo-list/todo-list.component.html
+++ b/todo-app/todo-app/src/app/todo/components/todo-list/todo-list.component.html
@@ -1,5 +1,5 @@
 <div class="row justify-content-center">
-    <div class="todo-item-list col-4 m-2 p-2 border rounded">
+    <div class="todo-item-list col-4 m-2 p-2 border rounded bg-white">
         <h2>TODO:</h2>
         <app-todo-item *ngFor="let todoItem of todoItemList" 
         [id]="todoItem.id" 
@@ -9,7 +9,7 @@
         (delete)="onDelete($event)"
         (doneChange)="onDone($event)"></app-todo-item>
     </div>
-    <div class="done-item-list col-4 m-2 p-2 border rounded">
+    <div class="done-item-list col-4 m-2 p-2 border rounded bg-white">
         <h2>DONE:</h2>
         <app-todo-item *ngFor="let todoItem of doneItemList" 
         [id]="todoItem.id" 
diff --git a/todo-app/todo-app/src/app/user/components/base/base.component.html b/todo-app/todo-app/src/app/user/components/base/base.component.html
index 03ec1db..bb1caee 100644
--- a/todo-app/todo-app/src/app/user/components/base/base.component.html
+++ b/todo-app/todo-app/src/app/user/components/base/base.component.html
@@ -2,8 +2,8 @@
     <div class="col-4"></div>
     <div class="col-4"><h1 class="text-center">TODO LIST</h1></div>
     <div class="col-4 d-flex justify-content-end">
-        <div class="d-flex justify-content-center flex-column mr-3">{{ userName }} ({{ fullName }})</div>
-        <button (click)="onLogout()" class="btn btn-primary">Log out</button>
+        <div *ngIf="userName" class="d-flex justify-content-center flex-column mr-3">{{ userName }} ({{ fullName }})</div>
+        <button *ngIf="userName" (click)="onLogout()" class="btn btn-primary">Log out</button>
     </div>
 </div>
 <router-outlet></router-outlet>
diff --git a/todo-app/todo-app/src/app/user/components/login/login.component.html b/todo-app/todo-app/src/app/user/components/login/login.component.html
index 502f085..f83469b 100644
--- a/todo-app/todo-app/src/app/user/components/login/login.component.html
+++ b/todo-app/todo-app/src/app/user/components/login/login.component.html
@@ -1,4 +1,3 @@
-<h1 class="text-center">TODO LIST</h1>
 <div class="login-form-container d-flex justify-content-center">
   <div class="d-flex flex-column">
     <form [formGroup]="loginForm" class="login-form d-flex flex-column mt-5">
diff --git a/todo-app/todo-app/src/app/user/components/register/register.component.html b/todo-app/todo-app/src/app/user/components/register/register.component.html
index e36fb53..3f73dfb 100644
--- a/todo-app/todo-app/src/app/user/components/register/register.component.html
+++ b/todo-app/todo-app/src/app/user/components/register/register.component.html
@@ -1,4 +1,3 @@
-<h1 class="text-center">TODO LIST</h1>
 <div class="register-form-container d-flex justify-content-center">
   <div class="d-flex flex-column">
     <form [formGroup]="registerForm" class="register-form d-flex flex-column mt-5">
diff --git a/todo-app/todo-app/src/app/user/user-routing.module.ts b/todo-app/todo-app/src/app/user/user-routing.module.ts
index 8e9692a..beee0d4 100644
--- a/todo-app/todo-app/src/app/user/user-routing.module.ts
+++ b/todo-app/todo-app/src/app/user/user-routing.module.ts
@@ -1,13 +1,19 @@
+import { BaseComponent } from './components/base/base.component';
 import { NgModule } from '@angular/core';
 import { Routes, RouterModule } from '@angular/router';
 import { LoginComponent } from './components/login/login.component';
 import { RegisterComponent } from './components/register/register.component';
 
-
 const routes: Routes = [
-    { path: '', redirectTo: 'login', pathMatch: 'full'},
-    { path: 'login', component: LoginComponent },
-    { path: 'register', component: RegisterComponent }
+    {
+      path: '',
+      component: BaseComponent,
+      children: [
+        { path: '', redirectTo: 'login', pathMatch: 'full'},
+        { path: 'login', component: LoginComponent },
+        { path: 'register', component: RegisterComponent }
+      ]
+    }
 ];
 
 @NgModule({
diff --git a/todo-app/todo-app/src/styles.scss b/todo-app/todo-app/src/styles.scss
index f222408..66b7401 100644
--- a/todo-app/todo-app/src/styles.scss
+++ b/todo-app/todo-app/src/styles.scss
@@ -5,3 +5,7 @@ body { margin: 0; font-family: Roboto, "Helvetica Neue", sans-serif; }
 
 /* Importing Bootstrap SCSS file. */
 @import '~bootstrap/scss/bootstrap';
+
+body {
+    background-color: #FFFFE8;
+}
\ No newline at end of file