Minor changes on which buttons open a new page.

src/info/components/project-block.js

@@ -9,6 +9,7 @@ export default function ProjectCardBlock({ title, cards }) {
           <PCard
             key={card}
             title={card}
+            new_tab={cards[card].new_tab}
             url={cards[card].url}
             src={cards[card].src}
             alt={cards[card].alt}

src/info/components/project-card.js

@@ -9,16 +9,43 @@ export default function projectCard({
   alt,
   description,
 }) {
-  const open_new_tab = new_tab ? "_blank" : "";
-
+  if (Boolean(new_tab)) {
     return (
       <div>
         <Link href={url}>
-        <a target={open_new_tab}>
+          <a target="_blank">
             <li className="p-4 space-y-2 rounded-sm ring-2 text-werefox-blue-dark dark:text-werefox-blue hover:text-werefox-pink-dark dark:hover:text-werefox-pink ring-werefox-blue-dark dark:ring-werefox-blue hover:ring-werefox-pink-dark dark:hover:ring-werefox-pink hover:animate-yip transition">
               <div className="text-lg text-center">
                 <span className="animate-jiggle sm:w-6 sm:h-6 w-4 h-6 inline-block align-top">
-                <Image src={src} layout="fill" objectFit="contain" alt={alt} />
+                  <Image
+                    src={src}
+                    layout="fill"
+                    objectFit="contain"
+                    alt={alt}
+                  />
+                </span>
+                {` ${title}`}
+              </div>
+              <div className="text-md text-center">{description}</div>
+            </li>
+          </a>
+        </Link>
+      </div>
+    );
+  } else {
+    return (
+      <div>
+        <Link href={url}>
+          <a>
+            <li className="p-4 space-y-2 rounded-sm ring-2 text-werefox-blue-dark dark:text-werefox-blue hover:text-werefox-pink-dark dark:hover:text-werefox-pink ring-werefox-blue-dark dark:ring-werefox-blue hover:ring-werefox-pink-dark dark:hover:ring-werefox-pink hover:animate-yip transition">
+              <div className="text-lg text-center">
+                <span className="animate-jiggle sm:w-6 sm:h-6 w-4 h-6 inline-block align-top">
+                  <Image
+                    src={src}
+                    layout="fill"
+                    objectFit="contain"
+                    alt={alt}
+                  />
                 </span>
                 {` ${title}`}
               </div>
@@ -29,3 +56,4 @@ export default function projectCard({
       </div>
     );
   }
+}

src/info/data/homepage/other.yml

@@ -4,8 +4,10 @@ Servers:
   url: "https://info.werefox.dev/servers"
   images:
     - { src: "/emoji/computer.svg", alt: "Computer emoji" }
+  new_tab: true
 
 "Support Us?":
   url: "https://info.werefox.dev/support"
   images:
     - { src: "/emoji/green_money.svg", alt: "Green money emoji" }
+  new_tab: true