More styling

src/app/components/contact/contact.component.ts

@@ -0,0 +1,9 @@
+import {Component} from '@angular/core';
+
+@Component({
+	selector: 'app-contact',
+	templateUrl: './contact.component.html'
+})
+export class ContactComponent {
+
+}

src/app/components/footer/footer.component.html

@@ -20,11 +20,11 @@
 		</div>
 		<h3 class="mt-4 mb-0">so we can invade your feed ⚔️</h3>
 	</div>
-	<div style="background: #333">
-		<div class="mx-auto d-flex justify-content-center flex-wrap text-center text-sm-start">
-			<div *ngFor="let group of navigation" class="m-3" style="min-width: 175px">
+	<div class="bg-dark text-center text=sm=start">
+		<div class="d-flex flex-column flex-sm-row flex-wrap justify-content-around container p-3">
+			<div *ngFor="let group of navigation">
 				<h2 class="sitemap-header">{{group.label}}</h2>
-				<ul class="m-0">
+				<ul>
 					<ng-container *ngFor="let section of group.children">
 						<li *ngFor="let item of section">
 							<a [routerLink]="item.url" [fragment]="item.fragment">{{item.label}}</a>
@@ -32,6 +32,14 @@
 					</ng-container>
 				</ul>
 			</div>
+			<div>
+				<h2 class="sitemap-header">Contact</h2>
+				<ul>
+					<li class="font-weight-strong">Robert Sacco</li>
+					<li>Legio XXX President</li>
+					<li>Email: <a href="mailto:sacco.c.r@bell.net" target="_blank">sacco.c.r@bell.net</a></li>
+				</ul>
+			</div>
 		</div>
 	</div>
 	<div class="py-3 text-center">

src/app/components/footer/footer.component.scss

@@ -1,14 +1,20 @@
-a, a:visited {
-	color: rgba(255, 255, 255, 0.6);
-}
+
 
 ul {
 	list-style: none;
 	padding: 0;
+
+	a, a:visited {
+		color: rgba(255, 255, 255, 0.6);
+	}
+
+	li {
+		color: rgba(255, 255, 255, 0.75);
+	}
 }
 
 .sitemap-header {
-	color: rgba(255, 255, 255, 0.8);
+	color: rgba(255, 255, 255, 0.9);
 	margin: 0;
 }