Add Contact Me section

src/components/content/index/Contact.astro

@@ -1,6 +0,0 @@
----
-layout: './Section.astro'
-title: 'Contact Me'
-slug: 'contact'
-background: true
----

src/components/content/index/Contact.mdx

@@ -0,0 +1,14 @@
+---
+layout: './Section.astro'
+title: 'Contact Me'
+slug: 'contact'
+background: true
+---
+
+import Socials from './Socials.astro'
+
+Are you looking for help on a web project, or interested in learning more about myself or my projects?
+
+Feel free to contact or follow me at any time using these links:
+
+<Socials />

src/components/content/index/Experience.mdx

@@ -13,15 +13,19 @@ I have also used multiple web frameworks. I am most familiar with Express.js and
 
 I am also familiar with Linux since I use Arch Linux on my laptop and work with Linux Debian VMs on my server. Along with that, I have worked with PostgreSQL and MS SQL in my projects and at work, and I have also touched Google Cloud and Azure, using them for my self-hosted cloud, a cybersecurity course, and for work-related tasks.
 
-Although I have learned most of these skills in my spare time, I have also used them in the professional world:
+Although I have learned most of these skills in my spare time, I have also used them in my internships:
 
-<Subsection title="Scrumfish" subtitle="Nampa, ID">
+<Subsection title="Scrumfish" subtitle="Nampa, ID" url="https://scrumfish.com/">
     Worked on backend and frontend for multiple projects using ASP.NET, MS SQL,
     and React to create APIs, a login system with MFA, and functional frontend
     components.
 </Subsection>
 
-<Subsection title="R-Technics" subtitle="Boise, ID">
+<Subsection
+    title="R-Technics"
+    subtitle="Boise, ID"
+    url="https://www.rtechnics.com/"
+>
     Performed Windows server maintenance tasks and created a prototype in C# to
     pull song data using the SongSelect API, which was later integrated into the
     company's main product.

src/components/content/index/Projects.mdx

@@ -9,7 +9,7 @@ import Subsection from './Subsection.astro'
 
 My biggest personal project so far is building a server to self-host my cloud ecosystem. My server uses a Proxmox hypervisor along with Linux Debian VMs and Docker containers running services such as TrueNAS, Syncthing, Nextcloud, Plex, Forejo, Pterodactyl, and others. To get around carrier-grade NAT limitations, I host a VPN using Google Cloud and use nftables to route traffic so I can make services publicly accessible.
 
-I also have other projects viewable on multiple git platforms [Github, Forgejo], most of which came from hackathons, game jams, and school projects. Of these, the most interesting are:
+I also have other projects viewable on multiple git platforms, most of which came from hackathons, game jams, and school projects. Of these, the most interesting are:
 
 <Subsection
     title="GroceRead"
@@ -21,13 +21,21 @@ I also have other projects viewable on multiple git platforms [Github, Forgejo],
     Chooch API for object detection.
 </Subsection>
 
-<Subsection title="zzzz" subtitle="Axxess Hackathon, UTD 2023">
+<Subsection
+    title="Med-Terms"
+    subtitle="Axxess Hackathon, UTD 2023"
+    url="https://devpost.com/software/med-terms"
+>
     Educational chatbot that teaches anatomical terminology and suggests others
     for the user to learn about. Wrote the API layer of the backend using
     Django, and created most of the frontend using React.
 </Subsection>
 
-<Subsection title="Score Tracker" subtitle="HS senior project">
+<Subsection
+    title="Score Tracker"
+    subtitle="HS senior project"
+    url="https://git.sudoer.ch/sudoer777/score-tracker"
+>
     Web app that allows coaches of HS sports teams to submit game scores. Scores
     would then be publicly viewable on the app's homepage and could be managed
     through an admin interface. Created with Express.js, PostgreSQL, and vanilla

src/components/content/index/Section.astro

@@ -6,7 +6,7 @@ type Props = MDXLayoutProps<{
     background: boolean
 }>
 
-const { frontmatter } = Astro.props
+const { title, slug, background } = Astro.props.frontmatter
 
 const fontSize = 'text-[1rem]'
 const fontSizeH2 = 'text-[1.5rem]'
@@ -19,13 +19,13 @@ const anchorDistance = 'mt-[-5rem] pt-[5rem]'
 
 <section
     class={`${paddingX} ${paddingT} ${paddingB} ${fontSize} ${
-        frontmatter.background ? 'bg-background-dark' : ''
+        background ? 'bg-background-dark' : ''
     }`}
 >
-    <div class={anchorDistance} id={frontmatter.slug}>
+    <div class={anchorDistance} id={slug}>
         <div class={`mx-auto max-w-page-w space-y-paragraph`}>
             <h2 class={`font-bold ${fontSizeH2}`}>
-                {frontmatter.title}
+                {title}
             </h2>
             <slot />
         </div>

src/components/content/index/Socials.astro

@@ -0,0 +1,2 @@
+---
+---

src/pages/index.astro

@@ -4,6 +4,7 @@ import About from '../components/content/index/About.mdx'
 import Projects from '../components/content/index/Projects.mdx'
 import Experience from '../components/content/index/Experience.mdx'
 import Hobbies from '../components/content/index/Hobbies.mdx'
+import Contact from '../components/content/index/Contact.mdx'
 
 import Base from '../layouts/Base.astro'
 
@@ -17,4 +18,5 @@ const description = ''
     <Projects />
     <Experience />
     <Hobbies />
+    <Contact />
 </Base>