feat: plakat redesign phase 2 (desk with throwable objects, mobile card deck)

- New "Tisch" section replaces the old projects block on the home page
- Objects: project cards from Directus (flip on tap, link to detail page),
  thesis ticket with countdown, server card, currently-reading book from
  Hardcover (with skeleton), polaroid photo, sticker
- Desktop: Framer Motion drag with momentum, elastic table edges, tilt that
  follows throw velocity, bring-to-front, "Tidy up" and "Mess it up"
- Mobile: card deck, swipe the top card away (distance or velocity),
  prev/next buttons, live counter, tap to flip
- Both layouts are server rendered and switched by CSS, so content is
  visible without JavaScript and nothing jumps on hydration
- Taps after a drag no longer flip cards
- New named colors polaroid/bookcover instead of raw hex classes
- Texts in de/en, i18n key check extended

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
denshooter
2026-10-15 18:47:42 +02:00
parent 9a82a3b0e7
commit 70f378e720
10 changed files with 833 additions and 7 deletions
+36
View File
@@ -33,6 +33,42 @@
"ctaWork": "Projekte ansehen",
"ctaContact": "Schreib mir"
},
"tisch": {
"title": "Der Tisch.",
"allProjects": "Alle Projekte",
"hintBoard": "Alles hier lässt sich anfassen. Werfen, stapeln, Karten umdrehen.",
"hintDeck": "Wisch die Karten zur Seite, tipp zum Umdrehen.",
"tidy": "Aufräumen",
"mess": "Durcheinander",
"flip": "tippen zum Umdrehen",
"details": "Zum Projekt",
"prev": "Vorherige Karte",
"next": "Nächste Karte",
"ticketTitle": "Masterarbeit · Abgabe 15.02.2027",
"ticketDays": "Tage bis zur Abgabe",
"ticketJob": "ab 02/2027 fest als M365-Administrator",
"ticketStub": "Jetzt",
"serverTitle": "Was bei mir läuft",
"servers": {
"ingress": {
"name": "netcup · Eingang",
"detail": "Traefik, Dokploy, diese Seite"
},
"mail": {
"name": "IONOS · Post und Fotos",
"detail": "mailcow, Immich"
},
"home": {
"name": "Zuhause · Raspberry Pi",
"detail": "Home Assistant, Paperless"
}
},
"serverNote": "Gesichert mit CrowdSec, tägliche Backups mit restic.",
"bookLabel": "Lese gerade",
"bookFallback": "Zur Bibliothek",
"photoCaption": "Das bin ich.",
"sticker": "Läuft auf eigenen Servern."
},
"about": {
"title": "Hinter den Kulissen",
"p1": "Schon seit ich meinen ersten eigenen Server aufgesetzt habe, lässt mich das Thema Infrastruktur nicht mehr los. Als Student in Osnabrück verbringe ich meine Zeit am liebsten damit, moderne Web-Apps mit Next.js zu bauen oder mobile Lösungen mit Flutter zu entwickeln.",
+36
View File
@@ -33,6 +33,42 @@
"ctaWork": "See projects",
"ctaContact": "Write me"
},
"tisch": {
"title": "The desk.",
"allProjects": "All projects",
"hintBoard": "Everything here can be touched. Throw it, stack it, flip the cards.",
"hintDeck": "Swipe the cards aside, tap to flip.",
"tidy": "Tidy up",
"mess": "Mess it up",
"flip": "tap to flip",
"details": "Open project",
"prev": "Previous card",
"next": "Next card",
"ticketTitle": "Master's thesis · due 15 Feb 2027",
"ticketDays": "days until submission",
"ticketJob": "from 02/2027: M365 administrator",
"ticketStub": "Now",
"serverTitle": "What I run",
"servers": {
"ingress": {
"name": "netcup · front door",
"detail": "Traefik, Dokploy, this site"
},
"mail": {
"name": "IONOS · mail and photos",
"detail": "mailcow, Immich"
},
"home": {
"name": "Home · Raspberry Pi",
"detail": "Home Assistant, Paperless"
}
},
"serverNote": "Guarded by CrowdSec, daily backups with restic.",
"bookLabel": "Reading now",
"bookFallback": "To the library",
"photoCaption": "That's me.",
"sticker": "Runs on my own servers."
},
"about": {
"title": "Behind the Code",
"p1": "Ever since I set up my first home server, I've been hooked on infrastructure. Currently studying in Osnabrück, I split my time between developing modern web apps with Next.js and building mobile experiences with Flutter.",