From aeaaddf970b49320f5c2bf68b0c64f6415a0fa59 Mon Sep 17 00:00:00 2001
From: Nikos <53112175+nikosszzz@users.noreply.github.com>
Date: Sat, 14 Sep 2024 16:52:38 +0000
Subject: [PATCH] about: small fix

---
 src/app/about/page.tsx      | 5 ++---
 src/app/components/Card.tsx | 6 ++++--
 2 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/src/app/about/page.tsx b/src/app/about/page.tsx
index c017740..086b7da 100644
--- a/src/app/about/page.tsx
+++ b/src/app/about/page.tsx
@@ -93,7 +93,6 @@ const projects = [
     }
 ]
 
-// ../../../public/
 export default function About() {
     return (
         <div>
@@ -111,7 +110,7 @@ export default function About() {
                             <div className="flex flex-row items-center gap-1.5">
                                 {entries.map(({ name, url }) =>
                                     <Link href={{ pathname: url }} key={name.toLowerCase()}>
-                                        <Icon icon={name.toLowerCase()} className="sm:w-[32px] sm:h-[32px]" />
+                                        <Icon icon={name.toLowerCase()} className="w-[32px] h-[32px]" />
                                     </Link>
                                 )}
                             </div>
@@ -122,7 +121,7 @@ export default function About() {
 
             <div>
                 <div className="mt-5 mb-3 md:text-5xl sm:text-4xl font-extrabold">Projects</div>
-                <div className="grid gap-1 grid-cols-3 sm:grid-cols-2">
+                <div className="grid gap-1 md:grid-cols-3 sm:grid-cols-2">
                     {
                         Object.values(projects).map((i) => (
                             <Card
diff --git a/src/app/components/Card.tsx b/src/app/components/Card.tsx
index 784c4f2..54e9f3e 100644
--- a/src/app/components/Card.tsx
+++ b/src/app/components/Card.tsx
@@ -1,8 +1,9 @@
-import Link from "next/link";
+import type { ReactNode } from "react";
 
-export function Card({ className, button, cardUrl, title, description, icon, children }: { className?: string, button?: React.ReactNode, cardUrl?: string, title: string, description?: string | React.ReactNode, icon?: React.ReactNode, children?: React.ReactNode }): JSX.Element {
+export function Card({ className, button, cardUrl, title, description, icon, children, footer, header }: { className?: string, button?: ReactNode, cardUrl?: string, title: string, description?: string | ReactNode, icon?: ReactNode, children?: ReactNode, footer?: ReactNode, header?: ReactNode }): JSX.Element {
     return (
         <a href={cardUrl ?? undefined} target="_blank" className={`${className} px-4 py-4 rounded-lg shadow bg-primary`}>
+            {header}
             <div className="flex flex-row items-start gap-2 mb-2 shrink">
                 {icon}
                 <h5 className="md:text-lg sm:text-base font-semibold place-self-center text-pretty text-gray-900 dark:text-white">{title}</h5>
@@ -14,6 +15,7 @@ export function Card({ className, button, cardUrl, title, description, icon, chi
                 </span>
                 {button}
             </div>
+            {footer}
         </a>
     )
 }
\ No newline at end of file