From 2d9db19df463eb24545ef69fa0edd78ae630c947 Mon Sep 17 00:00:00 2001
From: Jacob Hilker <jacob.hilker2@gmail.com>
Date: Thu, 12 Oct 2023 11:44:22 -0400
Subject: [PATCH] fix HeroSection

---
 src/components/HeroSection.astro       | 59 --------------------------
 src/components/index/HeroSection.astro | 21 +++++++++
 src/pages/index.astro                  |  2 +-
 3 files changed, 22 insertions(+), 60 deletions(-)
 delete mode 100644 src/components/HeroSection.astro

diff --git a/src/components/HeroSection.astro b/src/components/HeroSection.astro
deleted file mode 100644
index 7c1986af..00000000
--- a/src/components/HeroSection.astro
+++ /dev/null
@@ -1,59 +0,0 @@
----
-import { Image } from "astro:assets";
-import Button from "./Button.astro";
-import Hero from "@assets/Hero.jpeg";
-import Icon from "astro-icon";
-import { SITE_META } from "@consts";
----
-
-<div class="z-0 flex flex-col lg:flex-row-reverse items-center justify-center">
-  <Image
-    src={Hero}
-    format="webp"
-    class="aspect-square object-cover rounded-sm"
-    width="300"
-    height="500"
-    alt="Myself leaning on a tree."
-  />
-  <div class="ml-4 lg:ml-0 text-center lg:text-justify">
-    <h1
-      class="text-5xl font-bold font-serif uppercase text-branding-black dark:text-branding-white">
-      Hi, I'm
-      <span class="text-branding-navy-600 dark:text-branding-navy-400"
-        >Jacob</span
-      >
-      <Icon
-        name="twemoji/waving-hand"
-        class="text-5xl inline w-10 h-10 -mt-4 ml-2"
-      />
-    </h1>
-    <h2
-      class="text-3xl font-bold my-4 lg:my-6 text-branding-text/90 dark:text-branding-white/90">
-      Freelance Web Developer
-    </h2>
-    <p
-      class="-mt-4 lg:mt-0 py-3 lg:py-6 max-w-[80ch] text-branding-text/75 mx-auto lg:mr-8 dark:text-branding-white/75">
-      I create accessible, performant, and easy-to-use websites using free and
-      open-source technologies such as TailwindCSS, Hugo, and Astro.
-      {
-        SITE_META.availableForHire
-          ? "I'm currently available for hire, so feel free to reach out using the button below."
-          : ""
-      }
-    </p>
-    <div class="space-x-3">
-      <a
-        href="mailto:jacob.hilker2@gmail.com"
-        class="focus:ring focus:ring-offset-4 focus:ring-offset-branding-white dark:focus:ring-offset-branding-black focus:outline-none cursor-pointer transition duration-200 motion-reduce:duration-0 font-bold disabled:cursor-not-allowed ease-out text-white uppercase bg-branding-navy hover:bg-branding-navy-800 dark:hover:bg-branding-navy-400 disabled:text-branding-navy-200 text-base py-2 px-4 rounded inline-flex place-items-center focus:hover:ring-branding-navy-800 dark:focus:hover:ring-branding-navy-400">
-        Reach Out
-      </a>
-      <Button
-        theme="secondary"
-        size="medium"
-        type="button"
-        @click="$refs.about.scrollIntoView()">
-        About Me
-      </Button>
-    </div>
-  </div>
-</div>
diff --git a/src/components/index/HeroSection.astro b/src/components/index/HeroSection.astro
index 80f94741..7a8c3ba2 100644
--- a/src/components/index/HeroSection.astro
+++ b/src/components/index/HeroSection.astro
@@ -42,5 +42,26 @@ import { SITE_META } from "@consts";
           : ""
       }
     </p>
+    <div class="space-x-3">
+      <a
+        href="mailto:jacob.hilker2@gmail.com"
+        class="focus:ring focus:ring-offset-4 focus:ring-offset-branding-white dark:focus:ring-offset-branding-black focus:outline-none cursor-pointer transition duration-200 motion-reduce:duration-0 font-bold disabled:cursor-not-allowed ease-out text-white uppercase bg-branding-navy hover:bg-branding-navy-800 dark:hover:bg-branding-navy-400 disabled:text-branding-navy-200 text-base py-2 px-4 rounded inline-flex place-items-center focus:hover:ring-branding-navy-800 dark:focus:hover:ring-branding-navy-400">
+        Reach Out
+      </a>
+      <Button
+        theme="secondary"
+        size="medium"
+        type="button"
+        @click="$refs.about.scrollIntoView()">
+        About Me
+      </Button>
+      <Button
+        theme="tertiary"
+        size="medium"
+        type="button"
+        @click="$refs.projects.scrollIntoView()">
+        Featured Projects
+      </Button>
+    </div>
   </div>
 </div>
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 3b9cd02c..8027a955 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -3,7 +3,7 @@ import BaseLayout from "@layouts/BaseLayout.astro";
 import "@fontsource/ibm-plex-serif/700.css";
 import "@fontsource/ibm-plex-sans/700.css";
 import { SITE_META } from "@consts";
-import HeroSection from "@components/HeroSection.astro";
+import HeroSection from "@components/index/HeroSection.astro";
 //import { type BlogPost, type Project } from "@content";
 import FeaturedProjectSection from "@components/index/FeaturedProjectSection.astro";
 ---