chore: clean up nav styling

src/app/about/about.html

@@ -1 +1,19 @@
-<p>about works!</p>
+<h1>YuriGPT</h1>
+<p>
+  YuriGPT is a webcomic about two girls in an online relationship, and all of
+  the zany antics that stem from that.
+</p>
+<p>
+  Because of this, our comics take the format of online chat conversations,
+  rather than a traditional comic. This may feel strange to you, but we are
+  hopeful that you come to love the story we tell.
+</p>
+<p>
+  We publish a new comic every Monday, and offer an RSS feed so you can use your
+  favourite application to stay updated.
+</p>
+<p>
+  If you love our comic, hate our comic, want to complain about something, or
+  are just looking for your own companion, we invite you to
+  <a href="https://chat.nhcarrigan.com" target="_blank">join our community</a>.
+</p>

src/app/about/about.ts

@@ -1,10 +1,16 @@
-import { Component } from '@angular/core';
+/**
+ * @copyright nhcarrigan
+ * @license Naomi's Public License
+ * @author Naomi Carrigan
+ */
+
+import { Component } from "@angular/core";
 
 @Component({
-  selector: 'app-about',
-  imports: [],
-  templateUrl: './about.html',
-  styleUrl: './about.css'
+  imports:     [],
+  selector:    "app-about",
+  styleUrl:    "./about.css",
+  templateUrl: "./about.html",
 })
 export class About {
 

src/app/nav/nav.css

@@ -15,10 +15,12 @@ ul {
   margin: 0;
   padding: 0;
   flex-wrap: nowrap;
+  height: 50px;
 }
 
 li {
   margin: 0 10px;
+  padding: 0;
 }
 
 img {
@@ -26,7 +28,6 @@ img {
 }
 
 #highlight {
-  font-size: 1.2em;
   background: var(--foreground);
   color: var(--background);
   padding: 5px 10px;
@@ -40,9 +41,4 @@ img {
   ul {
     flex-wrap: wrap;
   }
-  #highlight {
-    font-size: 1em;
-    color: var(--foreground);
-    background: transparent;
-  }
 }

src/app/nav/nav.html

@@ -1,6 +1,6 @@
 <nav>
   <ul>
-    <li><a routerLink="/"><img src="https://cdn.yurigpt.com/yurigpt.png" alt="YuriGPT Logo" /></a></li>
+    <li style="height: 50px;"><a routerLink="/" style="height: 0; display: inline-block;"><img src="https://cdn.yurigpt.com/yurigpt.png" alt="YuriGPT Logo" /></a></li>
     <li><a routerLink="/about">About</a></li>
     <li id="highlight"><a routerLink="/comic">Start Reading</a></li>
     <li><a routerLink="/characters">Characters</a></li>