Create pages for footer section

src/Client/src/app/pages/legal/about/about.component.css

@@ -0,0 +1,16 @@
+.center {
+    width: 100%;
+    display: flex;
+    justify-content: center;
+}
+
+.frame {
+    background-color: #000;
+    padding: 20px;
+    margin: 20px 0;
+    border-radius: 10px;
+}
+
+.center p {
+    color: #FFF;
+}

src/Client/src/app/pages/legal/about/about.component.html

@@ -1,5 +1,5 @@
 <div class="center">
-    <div class="big-frame background-border text-frame">
+    <div class="frame">
         <p>Welcome to Mistox LLC. A project and hobby of Derek Holloway.</p>
         <br />
         <p>I am an indi-developer who has been making small projects since I was 13. I originally learned lua and spent 4 years mastering it. Then I moved onto C# which is my preferred language</p>
@@ -15,14 +15,11 @@
         <p>After you make your account. All the data in the database is easily accessable through the account settings and</p>
         <p>you can delete your account at any time. Including all your data with it so there is no risk.</p>
         <p>I wont show ads and never will and I refuse to use trackers on this site.</p>
-        <br />
-        <br />
-        <p>If you have any questions, concerns, or would like to suggest a feature, bug-fix, or request to help. Please feel</p>
-        <p>free to reach out to me at <a href="mailto://derek@mistox.net">derek&commat;mistox.net</a></p>
 
+        <div class="center">
             <a href='https://ko-fi.com/A0A3TSI2D' target='_blank'>
                 <img height='36' style='border:0px;height:36px;' src='https://storage.ko-fi.com/cdn/kofi6.png?v=6' alt='Buy Me a Coffee at ko-fi.com' />
             </a>
-
+        </div>
     </div>
 </div>

src/Client/src/app/pages/legal/about/about.component.ts

@@ -8,6 +8,7 @@ import { CommonModule } from '@angular/common';
 @Component({
   selector: 'legal-about',
   templateUrl: './about.component.html',
+    styleUrls: [ './about.component.css' ],
   imports: [ FormsModule, CommonModule ]
 })
 export class AboutComponent {

src/Client/src/app/pages/legal/contact/contact.component.css

@@ -0,0 +1,15 @@
+.center {
+    background-color: green;
+}
+
+.tile-frame {
+    column-count: 4;
+    column-gap: 20px;
+    padding: 20px;
+    width: calc(100% - 40px);
+}
+
+.tile{
+    background-color: aqua;
+    height: 40px;
+}

src/Client/src/app/pages/legal/contact/contact.component.html

@@ -0,0 +1,11 @@
+<div class="tile-frame">
+
+    <div class="tile">
+
+    </div>
+
+    <div class="tile">
+        
+    </div>
+
+</div>

src/Client/src/app/pages/legal/contact/contact.component.ts

@@ -0,0 +1,20 @@
+import { Component } from '@angular/core';
+import { HttpClient } from '@angular/common/http';
+import { FormsModule } from '@angular/forms';
+import { Router, ActivatedRoute } from '@angular/router';
+import { Title } from '@angular/platform-browser';
+import { CommonModule } from '@angular/common';
+
+@Component({
+  selector: 'legal-contact',
+  templateUrl: './contact.component.html',
+  styleUrls: [ './contact.component.css' ],
+  imports: [ FormsModule, CommonModule ]
+})
+export class ContactComponent {
+
+  constructor( private http: HttpClient, private router: Router, private route: ActivatedRoute, private title: Title ) {
+    this.title.setTitle("Contact | BoredCareers");
+  };
+
+}

src/Client/src/app/pages/legal/privacy/privacy.component.css

@@ -0,0 +1,15 @@
+.center {
+    background-color: green;
+}
+
+.tile-frame {
+    column-count: 4;
+    column-gap: 20px;
+    padding: 20px;
+    width: calc(100% - 40px);
+}
+
+.tile{
+    background-color: aqua;
+    height: 40px;
+}

src/Client/src/app/pages/legal/privacy/privacy.component.html

@@ -0,0 +1,11 @@
+<div class="tile-frame">
+
+    <div class="tile">
+
+    </div>
+
+    <div class="tile">
+        
+    </div>
+
+</div>

src/Client/src/app/pages/legal/privacy/privacy.component.ts

@@ -0,0 +1,20 @@
+import { Component } from '@angular/core';
+import { HttpClient } from '@angular/common/http';
+import { FormsModule } from '@angular/forms';
+import { Router, ActivatedRoute } from '@angular/router';
+import { Title } from '@angular/platform-browser';
+import { CommonModule } from '@angular/common';
+
+@Component({
+  selector: 'legal-privacy',
+  templateUrl: './privacy.component.html',
+  styleUrls: [ './privacy.component.css' ],
+  imports: [ FormsModule, CommonModule ]
+})
+export class PrivacyComponent {
+
+  constructor( private http: HttpClient, private router: Router, private route: ActivatedRoute, private title: Title ) {
+    this.title.setTitle("Contact | BoredCareers");
+  };
+
+}