added featured project component

jhilker98 · Oct 11, 2023 · 7fc9dd0 · 7fc9dd0
1 parent 320979c
commit 7fc9dd0
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 2 deletions.
diff --git a/src/components/Button.astro b/src/components/Button.astro
@@ -6,7 +6,7 @@ things to add:
  */
 import type { HTMLAttributes } from "astro/types";
 interface Props extends HTMLAttributes<"button"> {
-  theme?: "primary" | "secondary";
+  theme?: "primary" | "secondary" | "tertiary";
   size?: "small" | "medium" | "large";
   textCase?: "upper" | "lower";
 }
@@ -47,6 +47,9 @@ const {
       "bg-branding-brown hover:bg-branding-brown-600 disabled:text-branding-brown-50/95 focus:ring-branding-brown focus:hover:ring-branding-brown-600":
         theme === "secondary",
     },
+    {
+      "bg-neutral-700": theme === "tertiary",
+    },
     { "text-sm py-1 px-2 rounded-sm": size === "small" },
     { "text-base py-2 px-4 rounded": size === "medium" },
     { "text-lg py-3 px-6 rounded-lg": size === "large" },

diff --git a/src/components/index/HeroSection.astro b/src/components/index/HeroSection.astro
@@ -48,13 +48,22 @@ import { SITE_META } from "@consts";
         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"
+        theme="primary"
         size="medium"
         type="button"
         @click="$refs.about.scrollIntoView()">
         About Me
       </Button>
+
+      <Button
+        theme="tertiary"
+        size="medium"
+        type="button"
+        @click="alert('master hacker')">
+        Featured Projects
+      </Button>
     </div>
   </div>
 </div>