The Projects page presents the developer’s work as a wall of retro game cartridges. Each project is a physical cartridge object with a neon-glowing label, and hovering over a cartridge flips it in 3D to reveal the project description and action buttons. A row of genre filter buttons at the top lets visitors narrow the wall down by project category.Documentation Index
Fetch the complete documentation index at: https://mintlify.com/apursley2012/dev-mode/llms.txt
Use this file to discover all available pages before exploring further.
Route
| Property | Value |
|---|---|
| Hash route | /#/projects |
| Page heading | CARTRIDGE WALL |
Genre Filter
A horizontal row of filter buttons sits above the cartridge wall. Clicking a genre button hides all cartridges that do not match the selected genre. The ALL button restores the full wall.| Button | Filter Behaviour |
|---|---|
| ALL | Shows all projects |
| WEB APP | Shows web application projects only |
| TOOL | Shows utility/tool projects only |
| STATIC SITE | Shows static site projects only |
Project Catalogue
The wall contains four projects. Each has a title, a genre tag, a short description, and a flag indicating whether its demo uses real or mocked data.| Title | Genre | Mocked | Color | Description |
|---|---|---|---|---|
| DOOM.JS | WEB APP | Yes | Magenta | A productivity app that treats your tasks like demons. Rip and tear until it is done. |
| NEON_GRID | TOOL | No | Cyan | CSS Grid generator with a cyberpunk aesthetic. Stop guessing, start generating. |
| STATIC_SHOCK | STATIC SITE | No | Lime | Blazing fast static site generator built with Rust and spite for slow load times. |
| API_INVADER | WEB APP | Yes | Magenta | REST API testing tool disguised as a space shooter. Shoot endpoints to test them. |
Projects marked Mocked: Yes display a warning triangle badge on their cartridge label that reads ⚠ DEMO USES SAMPLE DATA. This signals to visitors that the live demo is populated with placeholder content rather than real data.
Cartridge Card Interaction
Each project cartridge is a 3D card with two faces:- Front face — Displays the cartridge label with the project title, genre badge, and neon border. Mocked projects also show the sample-data warning badge here.
- Back face — Revealed on hover via a 3D CSS flip animation. Shows the project description and two action buttons:
- RUN DEMO — Opens the project’s live demo
- VIEW SOURCE — Opens the project’s source code repository
box-shadow pulse that matches the genre’s assigned accent color.