Adds sightings page

Author: brian-petersen

src/layouts/Link.astro

@@ -0,0 +1,9 @@
+---
+export interface Props {
+	to: string;
+}
+
+const { to } = Astro.props;
+---
+
+<a href={to} class="text-xl text-gray-200 underline hover:text-gray-400"><slot /></a>

src/pages/about.astro

@@ -0,0 +1,28 @@
+---
+import Layout from '../layouts/Layout.astro';
+import tips from '../data/tips.json'
+
+const tipsCounts = tips.length;
+---
+
+<Layout>
+	<main>
+		<h1 class="text-gray-100 text-4xl font-bold">about</h1>
+
+		<p class="text-gray-300 text-l my-3">
+			while i was in highschool (circa 2009-2013), these quotes circulated
+			the social media platforms. i originally wrote an android app to
+			display them (which search, saving as favorites, and sharing functionality)
+			-- but they've since disappeared from the internet.
+		</p>
+
+		<p class="text-gray-300 text-l my-4">
+			i built this to resurrect and provide a way
+			for them to live on (in some fashion)
+		</p>
+
+		<p class="text-gray-300 text-l my-4">
+			there are {tipsCounts} tips recorded
+		</p>
+	</main>
+</Layout>

src/pages/index.astro

@@ -1,30 +1,14 @@
 ---
 import Layout from '../layouts/Layout.astro';
-import tips from '../data/tips.json'
-
-const tipsCounts = tips.length;
+import Link from '../layouts/Link.astro';
 ---
 
 <Layout>
-	<main>
-		<h1 class="text-gray-100 text-2xl">Welcome to the brotips archive!</h1>
-
-		<p class="text-gray-300 text-l my-3">
-			While I was in highschool (circa 2009-2013), these quotes circulated
-			the social media platforms. I originally wrote an Android app to
-			display them (which search, saving as favorites, and sharing functionality)
-			-- but they've since disappeared slowly from the internet.
-		</p>
-
-		<p class="text-gray-300 text-l my-3">
-			I built this resurrect and provide a way
-			for them to live on (in some fashion).
-		</p>
-
-		<p class="text-gray-300 text-l my-3">
-			There are {tipsCounts} tips recorded.
-		</p>
+	<main class="flex flex-col items-center space-y-3">
+		<h1 class="text-gray-100 text-4xl font-bold">brotips archive</h1>
 
-		<a href="/brotips/tips/1/" class="text-lg text-gray-200 underline hover:text-gray-400">Get started!</a>
+		<Link to="/brotips/tips/1/">browse</a>
+		<Link to="/brotips/about/">about</a>
+		<Link to="/brotips/sightings/">sightings</a>
 	</main>
 </Layout>

src/pages/sightings.astro

@@ -0,0 +1,16 @@
+---
+import Layout from '../layouts/Layout.astro';
+import Link from '../layouts/Link.astro';
+---
+
+<Layout>
+	<main class="flex flex-col space-y-3">
+		<h1 class="text-gray-100 text-4xl font-bold">sightings</h1>
+
+		<p class="text-xl text-gray-200">the quotes found in unexpected places accross the internet</p>
+
+		<Link to="https://github.com/notepad-plus-plus/notepad-plus-plus/blob/1f4cbdb8b76c736c9ec1e69d4157c9650fd6f590/PowerEditor/src/Notepad_plus.cpp#L7596">
+			brotips #1001 in notepad++
+		</Link>
+	</main>
+</Layout>