dvorakmortonxd/dvorakmortonxd.dev
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

rebuild the web theme as a physical desk (walnut surface, monitor + keyboard, real rack, drive drawer, paper tags, dot-matrix report, brass plaques)

Browse source
This commit is contained in:
Martin Dvořák 2026-09-30 09:09:47 +00:00
commit cfc256c7bd
9 changed files with 1604 additions and 869 deletions
Download patch file Download diff file Expand all files Collapse all files

36
README.md
View file

@ -2,15 +2,16 @@
> The source code for my personal website, **[dvorakmortonxd.dev](https://dvorakmortonxd.dev)**.
It's a **skeuomorphic personal site**: a dark homelab desk built from anodised aluminium, OLED
glass, carbon fibre and paper, with the whole KDE desktop simulation kept behind a physical
power switch. Two modes, one content set:
It's a **skeuomorphic personal site**: a walnut desk with graphite hardware, cream paper and
brass details resting on it, with the whole KDE desktop simulation kept behind a physical power
switch. Two modes, one content set:
- **Web** (default) — the homelab desk. A 4U rack carries the headline on an engraved nameplate
and a live console readout; services are rack units with status LEDs, the 18 coding projects
are labelled SSD caddies in a drive drawer, hardware hangs on a pegboard, the contribution
heatmap is an LED matrix and the socials are a patch panel. Textures are CC0 — see
[`/credits`](http://localhost:3000/credits).
- **Web** (default) — the desk. A monitor carries the headline with a keyboard in front of it
and a small rack beside it; services are 1U rack units with health LEDs, the 18 coding
projects are labelled drives in a drawer, the machines hang as paper tags on a pegboard, the
contribution heatmap is printed on continuous dot-matrix paper, friends are business cards,
the gym log is a clipboard and the socials are a patch panel. Textures are CC0 — see
[`/credits`](https://dvorakmortonxd.dev/credits).
- **Desktop mode** — the KDE Plasma / Windows-style **desktop simulation**: draggable
snap-to-grid icons, resizable/floating windows, a Start menu, taskbar, live clock and a
working in-browser terminal (Alacritty). Reached from the power switch and hidden on phones.
@ -23,8 +24,9 @@ heatmap**, gym SBD and links to friends' sites.
- **Web theme is the landing view** — the site always opens on the desk; the theme is
deliberately not persisted, so a reload never drops you into the desktop.
- **Skeuomorphic hardware** — rack, LEDs, rocker switch, screws, vents and panels are CSS
materials over five CC0 textures; every section is a real-world object rather than a card.
- **Skeuomorphic materials** — walnut desk, graphite faceplates, cream paper, brass plaques and
amber LEDs, all CSS over five CC0 textures. Every section is a physical object with a contact
shadow; nothing is pure white on black or grey on black.
- **Desktop mode (desktop-only)** — a physical power switch in the top rail (and in the footer)
flips to the KDE-style desktop for the session. Phones never get it: the switch is hidden, so
the old iOS-style phone home screen is gone.
@ -64,15 +66,15 @@ heatmap**, gym SBD and links to friends' sites.
- **Framework:** Next.js 16 (App Router, Turbopack)
- **Language:** TypeScript, React 19 (client components everywhere interactivity lives)
- **Styling:** `src/app/globals.css` holds the palette tokens, base styles, the Tailwind v4
`@theme`/`@utility` classes and the scroll reveals. `src/app/web.css` is the skeuomorphic
material system (metal, OLED glass, paper, carbon, rubber, plastic, LEDs, screws, vents,
switches) and the object layouts. `page.css` keeps the shared component styles the desktop
apps still use, and `skeuo.css` is the KDE desktop.
`@theme`/`@utility` classes and the scroll reveals. `src/app/web.css` is the material system
(walnut desk, graphite metal, cream paper, brass, OLED glass, LEDs, screws, rack rails, rocker
switch) and the object layouts. `page.css` keeps the shared component styles the desktop apps
still use, and `skeuo.css` is the KDE desktop.
- **Fonts:** Newsreader (headlines, paper) + IBM Plex Sans/Mono (body, machine labels) via
`next/font/google`; the desktop keeps its system sans stack.
- **Textures:** five CC0 materials from ambientCG, downscaled to 512 px in `public/textures`.
Attribution is on `/credits`.
- **Version:** `3.1.0` (see `package.json`)
- **Textures:** five CC0 materials from ambientCG — `desk` (walnut), `metal`, `paper`, `carbon`,
`plastic` — downscaled to 512 px in `public/textures`. Attribution is on `/credits`.
- **Version:** `3.2.0` (see `package.json`)
## 🚀 Running Locally