From cabb4eb2f3894fa1aac0dafb15f3eb5b77fc9379 Mon Sep 17 00:00:00 2001
From: Zak Timson <zaktimson@gmail.com>
Date: Wed, 11 Jul 2018 22:41:41 -0400
Subject: [PATCH 1/2] Made footer slightly better

---
 src/app/app.component.html | 20 +++++++++++++++-----
 src/app/app.component.ts   |  9 +++++++--
 2 files changed, 22 insertions(+), 7 deletions(-)

diff --git a/src/app/app.component.html b/src/app/app.component.html
index 0677c36..fd0c896 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -38,9 +38,9 @@
     <div class="container-fluid bg-light">
         <div class="container">
             <div class="d-inline-block py-3">
-                <div class="d-inline-block mr-5">
+                <div class="align-top d-inline-block mr-5">
                     <h5>MAIN MENU</h5>
-                    <ul style="padding-left: 20px;">
+                    <ul style="list-style-type: none; padding-left: 0;">
                         <li>
                             <a [routerLink]="['/about']">About</a>
                         </li>
@@ -52,11 +52,21 @@
                         </li>
                     </ul>
                 </div>
-                <div class="d-inline-block mx-5">
+                <div class="align-top d-inline-block mr-5">
                     <h5>PRODUCTS</h5>
+                    <ul style="list-style-type: none; padding-left: 0; columns: 3;">
+                        <li *ngFor="let c of categories | async">
+                            <a [routerLink]="['/store', c.name]">{{c.name}}</a>
+                        </li>
+                    </ul>
                 </div>
-                <div class="d-inline-block ml-5">
-                    <h5>REVIEWS</h5>
+                <div class="align-top d-inline-block">
+                    <h5>CONTACT</h5>
+                    <p>
+                        Toll Free:1-888-422-7737
+                        <br> Local: 416-744-2723
+                        <br> Fax: 416-744-4078
+                    </p>
                 </div>
             </div>
         </div>
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index 8658d03..9bb67c2 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -1,16 +1,21 @@
 import {Component, OnInit} from '@angular/core';
 import {Router} from '@angular/router';
 import {ElectronService} from 'ngx-electron';
+import {AngularFirestore} from 'angularfire2/firestore';
 
 @Component({
   selector: 'app-root',
   templateUrl: 'app.component.html'
 })
 export class AppComponent implements OnInit {
-  constructor(private router: Router, public electron: ElectronService) {}
+  categories;
+
+  constructor(private router: Router, private db: AngularFirestore, public electron: ElectronService) {
+    this.categories = this.db.collection('categories').valueChanges();
+  }
 
   ngOnInit() {
-    if(this.electron.isElectronApp) {
+    if (this.electron.isElectronApp) {
       this.router.navigate(['/formulaManager']);
     }
   }

From 1538458e8a5782612d98bfbb23814bf6ef58ec31 Mon Sep 17 00:00:00 2001
From: Zak Timson <zaktimson@gmail.com>
Date: Wed, 11 Jul 2018 22:45:33 -0400
Subject: [PATCH 2/2] Make card lines match

---
 src/app/home/home.component.html | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/app/home/home.component.html b/src/app/home/home.component.html
index 110ec0b..7f0f972 100644
--- a/src/app/home/home.component.html
+++ b/src/app/home/home.component.html
@@ -8,7 +8,7 @@
                     <mat-card class="dark-hover" style="min-height: 320px;">
                         <mat-icon class="my-5" style="transform: scale(4); color: #87a9cd;">help_outline</mat-icon>
                         <h3 class="text-dark mb-4">About Us</h3>
-                        <mat-divider></mat-divider>
+                        <mat-divider class="custom-line"></mat-divider>
                         <p class="text-black-50 mt-5">Learn more about us and our 30+ years experience!</p>
                     </mat-card>
                 </a>
@@ -18,7 +18,7 @@
                     <mat-card class="dark-hover" style="min-height: 320px;">
                         <mat-icon class="my-5" style="transform: scale(4); color: #87a9cd;">local_grocery_store</mat-icon>
                         <h3 class="text-dark mb-4">Store</h3>
-                        <mat-divider></mat-divider>
+                        <mat-divider class="custom-line"></mat-divider>
                         <p class="text-black-50 mt-5">Buy equipment, ink and anything else you might need!</p>
                     </mat-card>
                 </a>
@@ -28,7 +28,7 @@
                     <mat-card class="dark-hover" style="min-height: 320px;">
                         <mat-icon class="my-5" style="transform: scale(4); color: #87a9cd;">opacity</mat-icon>
                         <h3 class="text-dark mb-4">Formula Manager</h3>
-                        <mat-divider></mat-divider>
+                        <mat-divider class="custom-line"></mat-divider>
                         <p class="text-black-50 mt-5">Check out our browser formula manager!</p>
                     </mat-card>
                 </a>