spacing, link display, jhunterdeloche prep

src/components/Link.astro

@@ -7,7 +7,7 @@ const { class: cls, ...rest }: HTMLAttributes<"a"> = Astro.props;
 
 <a
   class={cn(
-    "underline underline-offset-4 hover:underline-offset-8 hover:text-white transition-all duration-300 p-3",
+    "inline-block underline underline-offset-4 hover:underline-offset-8 hover:text-white transition-all duration-300 p-3",
     cls,
   )}
   {...rest}><slot /> →</a

src/components/Project.astro

@@ -14,7 +14,7 @@ const props: Props = Astro.props;
 ---
 
 <div
-  class={"flex justify-around items-center" +
+  class={"flex justify-around items-center my-3" +
     (props.reverse
       ? " md:flex-row-reverse flex-col-reverse"
       : " md:flex-row flex-col")}

src/components/sections/Projects.astro

@@ -6,6 +6,7 @@ import Project from "@/components/Project.astro";
 
 import drfeelycom from "@/assets/drfeelycom.png";
 import ngen from "@/assets/ngen.png";
+import jhdcom from "@/assets/jhdcom.png";
 ---
 
 <Section id="projects">
@@ -39,6 +40,22 @@ import ngen from "@/assets/ngen.png";
     treatment methods.
   </Project>
 
+  <!-- <Project -->
+  <!--   name="JHUNTERDELOCHE.COM" -->
+  <!--   image={{ src: jhdcom, alt: "Picture of jhunterdeloche.com homepage" }} -->
+  <!--   links={[ -->
+  <!--     { text: "JHunterDeLoche.com", url: "https://jhunterdeloche.com" }, -->
+  <!--     { -->
+  <!--       text: "Git Repo", -->
+  <!--       url: "https://git.noahsw.xyz/noah/jhunterdeloche.com", -->
+  <!--     }, -->
+  <!--   ]} -->
+  <!-- > -->
+  <!--   Personal website for Hunter DeLoche, a fellow University of Chicago student. -->
+  <!--   Includes information about Hunter's studies and music production activities -->
+  <!--   in his band, "Amnesium." -->
+  <!-- </Project> -->
+
   <div class="flex justify-around mt-10">
     <LinkButton href="https://git.noahsw.xyz">
       View all projects at git.noahsw.xyz

tailwind.config.mjs

@@ -16,5 +16,8 @@ export default {
       },
     },
   },
+  future: {
+    hoverOnlyWhenSupported: true,
+  },
   plugins: [],
 };