initial commit

components/blog-card.tsx

@@ -0,0 +1,31 @@
+import Link from 'next/link';
+import { BlogPost } from '@/lib/content';
+
+interface BlogCardProps {
+  post: BlogPost;
+}
+
+export function BlogCard({ post }: BlogCardProps) {
+  return (
+    <Link
+      href={`/blog/${post.slug}`}
+      className="block group"
+    >
+      <article className="space-y-3">
+        <time className="text-sm text-muted-foreground">
+          {new Date(post.date).toLocaleDateString('en-US', {
+            year: 'numeric',
+            month: 'long',
+            day: 'numeric'
+          })}
+        </time>
+        <h3 className="text-xl font-semibold text-foreground group-hover:text-primary transition-colors">
+          {post.title}
+        </h3>
+        <p className="text-base text-muted-foreground line-clamp-2">
+          {post.excerpt}
+        </p>
+      </article>
+    </Link>
+  );
+}

components/navigation.tsx

@@ -0,0 +1,38 @@
+import Link from "next/link";
+
+export function Navigation() {
+  return (
+    <nav className="w-full border-b border-border/40">
+      <div className="container mx-auto px-6 py-4">
+        <div className="flex items-center justify-between">
+          <Link
+            href="/"
+            className="text-xl font-semibold text-foreground hover:text-foreground/80 transition-colors"
+          >
+            Muszyn
+          </Link>
+          <div className="flex gap-8">
+            <Link
+              href="/blog"
+              className="text-base text-muted-foreground hover:text-foreground transition-colors"
+            >
+              Blog
+            </Link>
+            <Link
+              href="/projects"
+              className="text-base text-muted-foreground hover:text-foreground transition-colors"
+            >
+              Projects
+            </Link>
+            <Link
+              href="/about"
+              className="text-base text-muted-foreground hover:text-foreground transition-colors"
+            >
+              About
+            </Link>
+          </div>
+        </div>
+      </div>
+    </nav>
+  );
+}

components/project-card.tsx

@@ -0,0 +1,55 @@
+import Link from 'next/link';
+import { Project } from '@/lib/content';
+import { Github, ExternalLink, Code } from 'lucide-react';
+
+interface ProjectCardProps {
+  project: Project;
+}
+
+export function ProjectCard({ project }: ProjectCardProps) {
+  return (
+    <article className="group rounded-lg border border-border/40 bg-card p-6 transition-all hover:border-border hover:shadow-lg">
+      <h3 className="text-2xl font-semibold text-foreground mb-3">
+        {project.title}
+      </h3>
+      <p className="text-base text-muted-foreground mb-4">
+        {project.description}
+      </p>
+      <div className="flex gap-4 mt-4">
+        {project.links?.github && (
+          <a
+            href={project.links.github}
+            target="_blank"
+            rel="noopener noreferrer"
+            className="flex items-center gap-2 text-sm text-muted-foreground hover:text-foreground transition-colors"
+          >
+            <Github size={16} />
+            GitHub
+          </a>
+        )}
+        {project.links?.gitea && (
+          <a
+            href={project.links.gitea}
+            target="_blank"
+            rel="noopener noreferrer"
+            className="flex items-center gap-2 text-sm text-muted-foreground hover:text-foreground transition-colors"
+          >
+            <Code size={16} />
+            Gitea
+          </a>
+        )}
+        {project.links?.live && (
+          <a
+            href={project.links.live}
+            target="_blank"
+            rel="noopener noreferrer"
+            className="flex items-center gap-2 text-sm text-muted-foreground hover:text-foreground transition-colors"
+          >
+            <ExternalLink size={16} />
+            Live Demo
+          </a>
+        )}
+      </div>
+    </article>
+  );
+}