Webmaster is a retro-inspired personal portfolio built with React, Vite, and Tailwind CSS. It brings the spirit of early-2000s web design — teal backgrounds, Comic Sans typography, pixel fonts, blinking banners, and 88x31 badges — into a modern, responsive single-page application. Whether you want to fork the whole site or cherry-pick individual components, this documentation covers everything from project setup to each component’s props.Documentation Index
Fetch the complete documentation index at: https://mintlify.com/apursley2012/webmaster/llms.txt
Use this file to discover all available pages before exploring further.
Introduction
Learn what Webmaster is, its tech stack, and how it fits together as a retro React SPA.
Quickstart
Clone the repo, install dependencies, and have the dev server running in minutes.
Project Structure
Understand the file layout, routing setup, and how components map to pages.
Retro Design System
Explore the color palette, typography choices, and the Windows 98 bevel aesthetic.
Components at a Glance
The site is composed of eight purpose-built React components and a rich set of CSS utilities. Each component captures a distinct piece of retro web culture.RetroNav
Sticky pixel-font navigation with marching-ants active state.
MarqueeStrip
Scrolling ticker strip — configurable text and class name.
SparkleCursor
Mouse-following sparkle trail with random colors and sizes.
VisitorCounter
LED-style 6-digit visitor counter that increments on mount.
Button88x31
Classic 88×31 pixel badge button with configurable color and icon.
PageTransition
Framer Motion-powered enter/exit animations wrapping page content.
Site Pages
The portfolio ships with nine fully-implemented routed pages, each with its own retro visual theme.Home
Welcome page with layout sidebar, hero intro, and dual marquee strips.
About Me
Character sheet layout with mood tracker, currently-playing widget, and RPG stats.
Mad Skillz
Arcade high-score board displaying tech skills with animated rankings.
Projects
88×31 hover-card project showcase with tech stack labels.
Work History
Guestbook-entry-style work history rendered as an HTML table.
Blog
Forum-thread layout listing articles with reply and view counts.
Case Studies
Long-form technical write-ups styled as indigo-tinted blog articles.
Testimonials
Hover-reveal testimonials displayed on 88×31 badges.
Contact
Classic guestbook form with name, email, URL, and message fields.
Clone and install
Fork or clone the repository, then run
npm install to pull in React, Vite, React Router, and Framer Motion.Start the dev server
Run
npm run dev — Vite spins up a local server at http://localhost:5173 with hot module replacement.Explore the components
Browse the
components/ directory for the eight retro components, or navigate to the Components tab in these docs.