#5 Styled cards, changed content in me.json

src/lib/api/git.ts

@@ -23,4 +23,27 @@ export async function fetchRepos(): Promise<GitRepo[]> {
         console.error("Failed to fetch repos:", error);
         return [];
     }
+}
+
+export function timeSince(inputDate: Date | string): string {
+    const date = new Date(inputDate); // Ensure it's a Date object
+    if (isNaN(date.getTime())) {
+        throw new Error("Invalid date provided");
+    }
+
+    const now: Date = new Date();
+    const diffInMs: number = now.getTime() - date.getTime();
+    const diffInSeconds: number = Math.floor(diffInMs / 1000);
+    const diffInMinutes: number = Math.floor(diffInSeconds / 60);
+    const diffInHours: number = Math.floor(diffInMinutes / 60);
+    const diffInDays: number = Math.floor(diffInHours / 24);
+    const diffInMonths: number = Math.floor(diffInDays / 30); // Approximate
+    const diffInYears: number = Math.floor(diffInDays / 365); // Approximate
+
+    if (diffInDays === 0) return "Today";
+    if (diffInDays === 1) return "Yesterday";
+    if (diffInDays < 7) return `${diffInDays} days ago`;
+    if (diffInDays < 30) return `${Math.floor(diffInDays / 7)} week${diffInDays >= 14 ? 's' : ''} ago`;
+    if (diffInMonths < 12) return `${diffInMonths} month${diffInMonths > 1 ? 's' : ''} ago`;
+    return `${diffInYears} year${diffInYears > 1 ? 's' : ''} ago`;
 }

src/lib/components/Cards/Card.svelte

@@ -20,7 +20,9 @@
         border-radius: .5em;
         scroll-snap-align: start;
 		transition: all 0.2s;
+        box-shadow: .25em .25em .5em var(--hover);
     }
+
     .card:hover {
         box-shadow: .5em .5em .5em var(--hover);
     }