GKaszewski/blog
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fun improvements #1

Merged
GKaszewski merged 21 commits from fun into main 2026-03-31 00:50:17 +00:00
Conversation 0 Commits 21 Files Changed 13 +20 -4
1 changed files with 20 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit c20b33e6af - Show all commits

24
app/page.tsx
View File

@@ -2,11 +2,18 @@ import { getSortedPostsData, PostMeta } from "../lib/posts";
import Link from "next/link"; import Link from "next/link";
import Window from "../components/window"; import Window from "../components/window";
function isNew(dateStr: string): boolean {
const postDate = new Date(dateStr);
const now = new Date();
const diffDays = (now.getTime() - postDate.getTime()) / (1000 * 60 * 60 * 24);
return diffDays <= 30;
}
export default function Home() { export default function Home() {
const allPostsData: PostMeta[] = getSortedPostsData(); const allPostsData: PostMeta[] = getSortedPostsData();
return ( return (
<div className="space-y-12"> <div className="space-y-6">
<header className="text-center"> <header className="text-center">
<h1 className="text-5xl font-bold text-white [text-shadow:_2px_2px_4px_rgb(0_0_0_/_40%)]"> <h1 className="text-5xl font-bold text-white [text-shadow:_2px_2px_4px_rgb(0_0_0_/_40%)]">
Gabriel's Kaszewski Blog Gabriel's Kaszewski Blog
@@ -17,16 +24,25 @@ export default function Home() {
</header> </header>
<section> <section>
{/* The list of posts is displayed inside our custom Window component */}
<Window title="Blog Posts"> <Window title="Blog Posts">
{allPostsData.length > 0 ? ( {allPostsData.length > 0 ? (
<ul className="space-y-4"> <ul className="space-y-4">
{allPostsData.map(({ id, date, title }) => ( {allPostsData.map(({ id, date, title, wip }) => (
<li key={id}> <li key={id}>
<Link <Link
href={`/posts/${id}`} href={`/posts/${id}`}
className="block rounded-md bg-white/50 p-4 transition-all duration-200 hover:bg-white/80 hover:shadow-md" className="relative block overflow-hidden rounded-md bg-white/50 p-4 transition-all duration-200 hover:bg-white/80 hover:shadow-md"
> >
{isNew(date) && !wip && (
<div className="animate-blink absolute top-[10px] right-[-24px] w-[100px] rotate-[35deg] bg-[#e05010] py-0.5 text-center text-[9px] font-bold text-white shadow-sm">
NEW!
</div>
)}
{wip && (
<div className="absolute top-[10px] right-[-24px] w-[100px] rotate-[35deg] bg-amber-500 py-0.5 text-center text-[9px] font-bold text-white shadow-sm">
🚧 WIP
</div>
)}
<h3 className="font-bold text-lg text-blue-800">{title}</h3> <h3 className="font-bold text-lg text-blue-800">{title}</h3>
<small className="text-gray-600"> <small className="text-gray-600">
{new Date(date).toLocaleDateString("en-US", { {new Date(date).toLocaleDateString("en-US", {