From 01959f7cb1d95b40898f6b2ad687ca1890d8e9ca Mon Sep 17 00:00:00 2001
From: Triston Armstrong <tarmstrong95@proton.me>
Date: Sun, 14 Jan 2024 14:03:45 -0600
Subject: [PATCH] move files around

---
 components/UsefulLinks/UsefulLink.js          |   2 +-
 components/UsefulLinks/UsefulLinks.js         |   2 +-
 components/{ => portfolio}/AlienHeader.tsx    |   0
 .../{ => portfolio}/ExternalLinkIcon.js       |   0
 components/{ => portfolio}/Job.tsx            |   0
 components/{ => portfolio}/ListItem.tsx       |   0
 components/{ => portfolio}/Skill.tsx          |   0
 components/{ => portfolio}/alien_styles.css   |   0
 pages/_app.tsx                                |   2 +-
 pages/index.tsx                               | 136 +++++++++---------
 pages/playground/index.tsx                    |  27 +---
 11 files changed, 76 insertions(+), 93 deletions(-)
 rename components/{ => portfolio}/AlienHeader.tsx (100%)
 rename components/{ => portfolio}/ExternalLinkIcon.js (100%)
 rename components/{ => portfolio}/Job.tsx (100%)
 rename components/{ => portfolio}/ListItem.tsx (100%)
 rename components/{ => portfolio}/Skill.tsx (100%)
 rename components/{ => portfolio}/alien_styles.css (100%)

diff --git a/components/UsefulLinks/UsefulLink.js b/components/UsefulLinks/UsefulLink.js
index dbfad4f..c34dbba 100644
--- a/components/UsefulLinks/UsefulLink.js
+++ b/components/UsefulLinks/UsefulLink.js
@@ -1,4 +1,4 @@
-import ExternalLinkIcon from "../ExternalLinkIcon.js";
+import ExternalLinkIcon from "../portfolio/ExternalLinkIcon.js";
 
 export function UsefulLink({ title, link }) {
   return (
diff --git a/components/UsefulLinks/UsefulLinks.js b/components/UsefulLinks/UsefulLinks.js
index c611270..62e45a2 100644
--- a/components/UsefulLinks/UsefulLinks.js
+++ b/components/UsefulLinks/UsefulLinks.js
@@ -1,4 +1,4 @@
-import ListItem from "../ListItem"
+import ListItem from "../portfolio/ListItem"
 import { UsefulLink } from "./UsefulLink"
 
 export function UsefulLinksList() {
diff --git a/components/AlienHeader.tsx b/components/portfolio/AlienHeader.tsx
similarity index 100%
rename from components/AlienHeader.tsx
rename to components/portfolio/AlienHeader.tsx
diff --git a/components/ExternalLinkIcon.js b/components/portfolio/ExternalLinkIcon.js
similarity index 100%
rename from components/ExternalLinkIcon.js
rename to components/portfolio/ExternalLinkIcon.js
diff --git a/components/Job.tsx b/components/portfolio/Job.tsx
similarity index 100%
rename from components/Job.tsx
rename to components/portfolio/Job.tsx
diff --git a/components/ListItem.tsx b/components/portfolio/ListItem.tsx
similarity index 100%
rename from components/ListItem.tsx
rename to components/portfolio/ListItem.tsx
diff --git a/components/Skill.tsx b/components/portfolio/Skill.tsx
similarity index 100%
rename from components/Skill.tsx
rename to components/portfolio/Skill.tsx
diff --git a/components/alien_styles.css b/components/portfolio/alien_styles.css
similarity index 100%
rename from components/alien_styles.css
rename to components/portfolio/alien_styles.css
diff --git a/pages/_app.tsx b/pages/_app.tsx
index 701854e..bccde0e 100644
--- a/pages/_app.tsx
+++ b/pages/_app.tsx
@@ -1,6 +1,6 @@
 import '../styles/global.css'
 import '../styles/prism.css'
-import '../components/alien_styles.css'
+import '../components/portfolio/alien_styles.css'
 import type { AppProps } from 'next/app'
 import type { HomeProps } from './notes'
 import React from 'react'
diff --git a/pages/index.tsx b/pages/index.tsx
index 5591cf1..976901f 100644
--- a/pages/index.tsx
+++ b/pages/index.tsx
@@ -1,10 +1,11 @@
-import Job, { type JobProps } from '../components/Job'
-import Skill, { type SkillProps } from '../components/Skill'
-import ListItem, { type ListItemProps } from '../components/ListItem'
+import Job, { type JobProps } from '../components/portfolio/Job'
+import Skill, { type SkillProps } from '../components/portfolio/Skill'
+import ListItem, { type ListItemProps } from '../components/portfolio/ListItem'
 import { UsefulLinksList } from '../components/UsefulLinks/index'
 import { SocialLinksList } from '../components/SocialLinks/SocialLinks'
 import type { GetStaticProps } from 'next'
-import AlienHeader from 'components/AlienHeader'
+import AlienHeader from 'components/portfolio/AlienHeader'
+import Head from 'next/head'
 
 interface LandingProps {
   jobs: JobsType[]
@@ -14,80 +15,85 @@ interface LandingProps {
 
 export default function Landing({ jobs, skills, projects }: LandingProps): React.JSX.Element {
   return (
-    <div>
-      <article className='flex-row align-baseline'>
-        <p>❗👷 This site is under construction 🚧 🏗️ 🚧</p>
-      </article>
+    <>
+      <Head>
+        <title>Triston Armstrong</title>
+      </Head>
+      <div>
+        <article className='flex-row align-baseline'>
+          <p>❗👷 This site is under construction 🚧 🏗️ 🚧</p>
+        </article>
 
-      <br />
+        <br />
 
-      <header>
-        <div className="flex-col gap-05">
+        <header>
+          <div className="flex-col gap-05">
 
-          <AlienHeader />
-          <h1 className='m-0'>Triston Armstrong 🫰</h1>
-        </div>
-
-        <p>
-          Full Stack Software Developer {' '}
-          <a target="_blank" href="https://ventrahealth.com">
-            @VentraHealth
-          </a>
-        </p>
-
-        <p className='font-muted'>
-          I am a self taught Full Stack Software Developer with an unhealthy addiction to solving
-          problems using code.
-        </p>
-
-        <hr />
-      </header>
-
-      <main className="">
-        <section>
-          <h4>🤹 Skills</h4>
-          <div className="flex gap-1" id="skills">
-            {skills.map(skill => <Skill key={skill.label} label={skill.label} link={skill.link} />)}
+            <AlienHeader />
+            <h1 className='m-0'>Triston Armstrong 🫰</h1>
           </div>
-        </section>
 
-        <section>
-          <h4>💼 Jobs</h4>
-          <div className="flex-col " id="jobs">
-            {jobs.map(job => <Job key={job.name} logo={job.logo} name={job.name} details={job.details} dateFrom={job.dateFrom} dateTo={job.dateTo} />)}
-          </div>
-        </section>
+          <p>
+            Full Stack Software Developer {' '}
+            <a target="_blank" href="https://ventrahealth.com">
+              @VentraHealth
+            </a>
+          </p>
 
-        <section>
-          <h4>🚧 Projects</h4>
-          <div className='flex-col'>
-            {projects.map(project => <ListItem key={project.label} label={project.label} date={project.date} url={project.url} />)}
-          </div>
-        </section>
-      </main>
+          <p className='font-muted'>
+            I am a self taught Full Stack Software Developer with an unhealthy addiction to solving
+            problems using code.
+          </p>
 
-      <footer className='flex-col flex-between gap-1 mt-4 '>
-        <div className='flex-row gap-1'>
-          <a href="/notes" target="_blank" className='text-md font-muted font-bold'>🏃 Notes</a>
-          {'|'}
-          <a href="/playground" target="_blank" className='text-md font-muted font-bold'>🏃 Playground</a>
-        </div>
+          <hr />
+        </header>
 
-        <div className='flex-row gap-1'>
-          <UsefulLinksList />
-        </div>
+        <main className="">
+          <section>
+            <h4>🤹 Skills <i className='font-muted'><small>(Click me to fast track to docs)</small></i></h4>
+            <div className="flex gap-1" id="skills">
+              {skills.map(skill => <Skill key={skill.label} label={skill.label} link={skill.link} />)}
+            </div>
+          </section>
 
-        <div style={{ margin: '10px 0' }} />
+          <section>
+            <h4>💼 Jobs</h4>
+            <div className="flex-col " id="jobs">
+              {jobs.map(job => <Job key={job.name} logo={job.logo} name={job.name} details={job.details} dateFrom={job.dateFrom} dateTo={job.dateTo} />)}
+            </div>
+          </section>
 
-        <div className='flex-row flex-between '>
+          <section>
+            <h4>🚧 Projects</h4>
+            <div className='flex-col'>
+              {projects.map(project => <ListItem key={project.label} label={project.label} date={project.date} url={project.url} />)}
+            </div>
+          </section>
+        </main>
+
+        <footer className='flex-col flex-between gap-1 mt-4 '>
           <div className='flex-row gap-1'>
-            <SocialLinksList />
+            <a href="/notes" target="_blank" className='text-md font-muted font-bold'>🏃 Notes</a>
+            {'|'}
+            <a href="/playground" target="_blank" className='text-md font-muted font-bold'>🏃 Playground</a>
           </div>
-          <small>©2023-2024 Triston Armstrong. All rights reserved.</small>
-        </div>
 
-      </footer>
-    </div >
+          <div className='flex-row gap-1'>
+            <UsefulLinksList />
+          </div>
+
+          <div style={{ margin: '10px 0' }} />
+
+          <div className='flex-row flex-between '>
+            <div className='flex-row gap-1'>
+              <SocialLinksList />
+            </div>
+            <small>©2023-2024 Triston Armstrong. All rights reserved.</small>
+          </div>
+
+        </footer>
+      </div >
+    </>
   )
 }
 
diff --git a/pages/playground/index.tsx b/pages/playground/index.tsx
index 3a266da..c50c8c5 100644
--- a/pages/playground/index.tsx
+++ b/pages/playground/index.tsx
@@ -7,31 +7,8 @@ export default function Home() {
         <title>🛝 Playground</title>
       </Head>
 
-      <div>
-        <Head>
-          <body className="bg-[radial-gradient(ellipse_at_top_right,_var(--tw-gradient-stops))] from-gray-600 to-gray-900  " />
-        </Head>
-        <div className="parent min-h-screen grid grid-cols-23 grid-rows-22 gap-5 p-10 scale-75">
-          <div className="shadow-xl rounded-lg [grid-area:1_/_1_/_14_/_6] bg-white bg-opacity-5 border border-t-gray-400 border-r-gray-500 border-l-transparent border-b-transparent "> </div>
-          <div className="shadow-xl rounded-lg [grid-area:14_/_1_/_17_/_6] bg-white bg-opacity-5 border border-t-gray-400 border-r-gray-500 border-l-transparent border-b-transparent"> </div>
-          <div className="shadow-xl rounded-lg [grid-area:1_/_6_/_8_/_12] bg-white bg-opacity-5 border border-t-gray-400 border-r-gray-500 border-l-transparent border-b-transparent"> </div>
-          <div className="shadow-xl rounded-lg [grid-area:1_/_12_/_8_/_18] bg-white bg-opacity-5 border border-t-gray-400 border-r-gray-500 border-l-transparent border-b-transparent"> </div>
-          <div className="shadow-xl rounded-lg [grid-area:17_/_1_/_21_/_10] bg-white bg-opacity-5 border border-t-gray-400 border-r-gray-500 border-l-transparent border-b-transparent"> </div>
-          <div className="shadow-xl rounded-lg [grid-area:21_/_1_/_23_/_10] bg-white bg-opacity-5 border border-t-gray-400 border-r-gray-500 border-l-transparent border-b-transparent"> </div>
-          <div className="shadow-xl rounded-lg [grid-area:17_/_18_/_23_/_24] bg-white bg-opacity-5 border border-t-gray-400 border-r-gray-500 border-l-transparent border-b-transparent"> </div>
-          <div className="shadow-xl rounded-lg [grid-area:12_/_18_/_17_/_24] bg-white bg-opacity-5 border border-t-gray-400 border-r-gray-500 border-l-transparent border-b-transparent"> </div>
-          <div className="shadow-xl rounded-lg [grid-area:7_/_18_/_12_/_24] bg-white bg-opacity-5 border border-t-gray-400 border-r-gray-500 border-l-transparent border-b-transparent"> </div>
-          <div className="shadow-xl rounded-lg [grid-area:1_/_18_/_7_/_24] bg-white bg-opacity-5 border border-t-gray-400 border-r-gray-500 border-l-transparent border-b-transparent"> </div>
-          <div className="shadow-xl rounded-lg [grid-area:8_/_6_/_17_/_18] bg-white bg-opacity-5 border border-t-gray-400 border-r-gray-500 border-l-transparent border-b-transparent"> </div>
-          <div className="shadow-xl rounded-lg [grid-area:17_/_10_/_23_/_18] bg-white bg-opacity-5 border border-t-gray-400 border-r-gray-500 border-l-transparent border-b-transparent"> </div>
-        </div>
-
-        <div className="p-10 flex gap-4  bg-white">
-          <div className="bg-sky-50 transition-all duration-500 hover:w-36 hover:bg-sky-500 w-20 h-20 shadow-lg hover:shadow-sky-300 rounded-full" />
-          <div className="bg-red-50 transition-all duration-500 hover:w-36 hover:bg-red-500 w-20 h-20 shadow-lg hover:shadow-red-300 rounded-full" />
-          <div className="bg-purple-50 transition-all duration-500 hover:w-36 hover:bg-purple-500 w-20 h-20 shadow-lg hover:shadow-purple-300 rounded-full" />
-        </div>
-      </div>
+      <h1>Playground</h1>
+      <article>I may play with some ideas here</article>
     </>
   )
 }