standardize component structure more

7 files changed, 106 insertions, 60 deletions

diff --git a/app/Footer.tsx b/app/Footer.tsx
deleted file mode 100644
index 49089b4..0000000
--- a/app/Footer.tsx
+++ /dev/null
@@ -1,9 +0,0 @@
-export default function Footer() {
-  return (
-    <footer>
-      <span>Website by Ashelyn Rose</span>
-      <a href="https://git.tempest.dev/ashe/tempest.dev">Site Source</a>
-      <a href="/pay-transparency">Pay Transparency</a>
-    </footer>
-  )
-}
diff --git a/app/Header.tsx b/app/Header.tsx
deleted file mode 100644
index b5749ba..0000000
--- a/app/Header.tsx
+++ /dev/null
@@ -1,43 +0,0 @@
-'use client'
-
-import React from 'react'
-import Image from 'next/image'
-
-import { usePathname } from 'next/navigation'
-
-import header from '~/images/aurora-1197753.jpg'
-
-export default function Title() {
-  const pathname = usePathname()
-
-  const isHomepage = pathname === '/'
-
-  return (
-    <header className={isHomepage ? 'homepage' : undefined}>
-      {isHomepage
-        ? <h1 className="siteTitle">tempest.dev</h1>
-        : <a href="/" className="siteTitle">tempest.dev</a>
-      }
-      <nav>
-        <a href="/system">system</a>
-        <a href="/posts">posts</a>
-        <a href="/contact">contact</a>
-      </nav>
-      <div className="headerBackground">
-        <Image
-          src={header}
-          alt=""
-          role="presentation"
-          fill={true}
-          sizes={`
-            (max-width: 2560) 100vw,
-            (max-width: 1920) 100vw,
-            (max-width: 1280) 100vw,
-            (max-width: 800) 100vw,
-            (max-width: 600) 100vw,
-          `}
-        />
-      </div>
-    </header>
-  )
-}
diff --git a/app/layout.tsx b/app/layout.tsx
index 3d25c44..22e1191 100644
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -4,8 +4,8 @@ import 'victormono'
 import '~/styles/layout.css'
 import '~/styles/text.css'
 
-import Header from './Header'
-import Footer from './Footer'
+import Header from '~/components/layout/Header'
+import Footer from '~/components/layout/Footer'
 
 export default function SiteLayout({ children }: { children: ReactNode }) {
   return (
diff --git a/app/not-found.tsx b/app/not-found.tsx
index 44753b0..b3a0fd4 100644
--- a/app/not-found.tsx
+++ b/app/not-found.tsx
@@ -1,12 +1,14 @@
+import InfoBar from "~/components/InfoBar/"
+
 export default function NotFound() {
   return (
     <>
       <h1 className="pageTitle">Not Found (404)</h1>
       <main className="mainColumn">
-        <aside className="infobar">
+        <InfoBar>
           <strong>Error:&nbsp;</strong>
           Unable to find the requested resource
-        </aside>
+        </InfoBar>
 
         <p>
           Feel free to start again from the <a href="/">home page</a>, or
diff --git a/app/page.tsx b/app/page.tsx
index 49d887c..bc84594 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -24,8 +24,8 @@ export default function Index() {
         <span className={styles.label}>Cohort:</span>
         <span>millenial</span>
 
-        <span className={styles.label}>Poly:</span>
-        <span>yes</span>
+        <span className={styles.label}>Orientation:</span>
+        <span>ace</span>
 
         <span className={styles.label}>Partners:</span>
         <span>three</span>
@@ -39,9 +39,8 @@ export default function Index() {
 
       <p>
         <em>Note:</em> This is the information for our system in aggregate,
-        for individual info see <a href="/system">system</a>
+        for individual info see our <a href="/system">about</a> page
       </p>
-
     </main>
   )
 }
diff --git a/app/pay-transparency/page.tsx b/app/pay-transparency/page.tsx
new file mode 100644
index 0000000..cb4b053
--- /dev/null
+++ b/app/pay-transparency/page.tsx
@@ -0,0 +1,85 @@
+import InfoBar from "~/components/InfoBar/"
+
+import styles from '~/styles/pay-transparency.module.css'
+
+export default function PayTransparency() {
+  return (
+    <>
+      <h1 className="pageTitle">
+        Pay Transparency
+      </h1>
+      <main className="mainColumn">
+        <InfoBar text="Last updated: May 2023" />
+        <p>
+          This page lists the title and pay rate of every job we have held
+          since university graduation, and is inspired by{' '}
+          <a target="_blank" href="https://rin.systems/pay-transparency/">Rin's pay transparency</a>
+          {' '}page.  That page is what inspired us to make this one, and we hope the
+          idea continues to spread, as the more people know what common compensation is
+          across the industry, the more we can all benefit.
+        </p>
+
+        <div className={styles.horizOverflow}>
+          <div className={styles.table}>
+            <span className={styles.heading}>Role</span>
+            <span className={styles.heading}>Start</span>
+            <span className={styles.heading}>End</span>
+            <span className={styles.heading}>Rate / Salary</span>
+
+            <span className={styles.position}>Software Developer</span>
+            <span>Jan 2020</span>
+            <span>Sept 2020</span>
+            <span>$35 USD / hour</span>
+
+            <span className={styles.position}>Software Engineer</span>
+            <span>Jan 2021</span>
+            <span>Sept 2021</span>
+            <span>$90,000 USD / year
+              <em>*</em>
+            </span>
+
+            <span className={styles.position}>Software Engineer</span>
+            <span>Sept 2021</span>
+            <span>Oct 2022</span>
+            <span>$100,800 USD / year
+              <em>*</em>
+            </span>
+
+            <span className={styles.position}>Software Engineer</span>
+            <span>Oct 2021</span>
+            <span>Jan 2022</span>
+            <span>$105,840 USD / year
+              <em>*</em>
+            </span>
+
+            <span className={styles.position}>Senior Software Engineer</span>
+            <span>Jan 2022</span>
+            <span>May 2022</span>
+            <span>$121,716 USD / year
+              <em>*</em>
+            </span>
+
+            <span className={styles.position}>Senior Software Engineer</span>
+            <span>June 2022</span>
+            <span>March 2023</span>
+            <span>$158,000 USD / year
+              <em>**</em>
+            </span>
+          </div>
+        </div>
+
+        <p>
+          All positions listed here included health, dental, and vision insurance.
+        </p>
+        <p>
+          The positions listed with <em>*</em> came with
+          a retirement account.
+        </p>
+        <p>
+          The position listed with <em>**</em> came with
+          stock options and a retirement account.
+        </p>
+      </main>
+    </>
+  )
+}
diff --git a/app/posts/page.tsx b/app/posts/page.tsx
new file mode 100644
index 0000000..34f0e7f
--- /dev/null
+++ b/app/posts/page.tsx
@@ -0,0 +1,12 @@
+export default function Posts() {
+  return (
+    <>
+      <h1 className="pageTitle">
+        Posts
+      </h1>
+      <main className="mainColumn">
+        <p>This will have posts here eventually we promise</p>
+      </main>
+    </>
+  )
+}