Add new documents and images to the public directory

- Added essays: qui-sumus-existential-dread.pdf and licencjat.pdf
- Added scripts: loop.pdf
- Added images: DSC_1283.avif, GAK00015.avif, GAK00017.avif, GAK00041.avif, GAK00042.avif, painter.avif, parasitic-god-1.avif, parasitic-god-2.avif, parasitic-god-3.avif, parasitic-god-4.avif, parasitic-god-5.avif, spanish-inq-1.avif, spanish-inq-2.avif, spanish-inq-3.avif, spanish-inq-4.avif, typing-game-1.avif, typing-game-2.avif

components/photo-gallery.tsx

@@ -0,0 +1,134 @@
+"use client";
+
+import Image from "next/image";
+import { Photo } from "@/lib/types";
+import { useState, useEffect, useCallback, useRef } from "react";
+import { X, ChevronLeft, ChevronRight } from "lucide-react";
+
+const PhotoGallery = ({ photos }: { photos: Photo[] }) => {
+  const [selectedIndex, setSelectedIndex] = useState<number | null>(null);
+  const touchStart = useRef<number | null>(null);
+
+  const selected = selectedIndex !== null ? photos[selectedIndex] : null;
+
+  const close = useCallback(() => setSelectedIndex(null), []);
+
+  const prev = useCallback(() => {
+    setSelectedIndex((i) => (i !== null && i > 0 ? i - 1 : i));
+  }, []);
+
+  const next = useCallback(() => {
+    setSelectedIndex((i) =>
+      i !== null && i < photos.length - 1 ? i + 1 : i
+    );
+  }, [photos.length]);
+
+  useEffect(() => {
+    if (selectedIndex === null) return;
+
+    document.body.style.overflow = "hidden";
+
+    const handleKey = (e: KeyboardEvent) => {
+      if (e.key === "Escape") close();
+      if (e.key === "ArrowLeft") prev();
+      if (e.key === "ArrowRight") next();
+    };
+
+    window.addEventListener("keydown", handleKey);
+    return () => {
+      document.body.style.overflow = "";
+      window.removeEventListener("keydown", handleKey);
+    };
+  }, [selectedIndex, close, prev, next]);
+
+  const handleTouchStart = (e: React.TouchEvent) => {
+    touchStart.current = e.touches[0].clientX;
+  };
+
+  const handleTouchEnd = (e: React.TouchEvent) => {
+    if (touchStart.current === null) return;
+    const diff = e.changedTouches[0].clientX - touchStart.current;
+    if (Math.abs(diff) > 50) {
+      if (diff > 0) prev();
+      else next();
+    }
+    touchStart.current = null;
+  };
+
+  return (
+    <>
+      <div className="columns-2 md:columns-3 gap-4 w-full max-w-4xl">
+        {photos.map((photo, i) => (
+          <button
+            key={photo.src}
+            onClick={() => setSelectedIndex(i)}
+            className="mb-4 w-full block cursor-zoom-in"
+          >
+            <Image
+              src={photo.src}
+              alt={photo.alt}
+              width={photo.width}
+              height={photo.height}
+              className="w-full h-auto rounded-lg hover:opacity-80 transition-opacity"
+            />
+          </button>
+        ))}
+      </div>
+
+      {selected && (
+        <div
+          role="dialog"
+          aria-modal="true"
+          aria-label="Photo lightbox"
+          className="fixed inset-0 z-50 flex items-center justify-center bg-black/95"
+          onTouchStart={handleTouchStart}
+          onTouchEnd={handleTouchEnd}
+        >
+          <button
+            onClick={close}
+            aria-label="Close lightbox"
+            className="absolute top-4 right-4 z-10 text-white/70 hover:text-white p-2"
+          >
+            <X size={28} />
+          </button>
+
+          {selectedIndex! > 0 && (
+            <button
+              onClick={prev}
+              aria-label="Previous photo"
+              className="absolute left-2 md:left-4 z-10 text-white/50 hover:text-white p-2"
+            >
+              <ChevronLeft size={32} />
+            </button>
+          )}
+
+          {selectedIndex! < photos.length - 1 && (
+            <button
+              onClick={next}
+              aria-label="Next photo"
+              className="absolute right-2 md:right-4 z-10 text-white/50 hover:text-white p-2"
+            >
+              <ChevronRight size={32} />
+            </button>
+          )}
+
+          <button onClick={close} aria-label="Close lightbox" className="contents">
+            <Image
+              src={selected.src}
+              alt={selected.alt}
+              width={selected.width}
+              height={selected.height}
+              className="max-w-[92vw] max-h-[85vh] w-auto h-auto object-contain cursor-zoom-out"
+            />
+          </button>
+
+          <div className="absolute bottom-4 text-white/40 text-sm">
+            {selectedIndex! + 1} / {photos.length}
+          </div>
+        </div>
+      )}
+    </>
+  );
+};
+
+export default PhotoGallery;