Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/apursley2012/windows-98/llms.txt

Use this file to discover all available pages before exploring further.

The Blog page lives at /blog and doubles as both a personal writing archive and a nostalgic webring hub. The window interior uses a deep retro-navy background (#000080) — a direct nod to classic Windows desktop colors — with the heading “Captain’s Log” rendered in yellow pixel font at the top. Below the heading, three blog posts are displayed as win98-out raised cards, each with a retro-navy title bar and a gray body. At the bottom of the window a webring navigation strip provides [ Prev ], [ Random ], and [ Next ] buttons styled as classic win98 push buttons.

​
Win98 Window configuration

PropertyValue
Window titleMy Webrings & Writings
Title bar iconbook-open (Lucide), teal
Width700 px
Height600 px
Interior backgroundRetro-navy #000080

​
Default blog posts

Three entries ship with the portfolio. All three are defined in the _d array inside the Blog component in main.js. Each object has date, title, and content fields — the full content string is displayed in the card body.
DateTitleContent summary
11/05/2023Why I still use tables for layout (jk)About flexbox being better, and remembering when you had to slice images in Photoshop and put them in table cells
09/12/2023My new mechanical keyboardGot the IBM Model M — coworkers hate it, fingers love it, CLACK CLACK CLACK
04/20/2023Site Update v2.0Added the visitor counter and the guestbook

​
Post card structure

Each post is rendered as a small raised card: 
div  (bg-white, text-black, border-4 border-retro-gray)
├── div.title-bar  (bg-retro-navy, text-white, px-2, py-1, font-pixel)
│   ├── span  ("~*~ {title} ~*~")
│   └── span  (date, right-aligned)
├── div.body  (bg-[#f0f0f0], p-4, font-mono text-sm)
│   └── p    (post content string)
└── div.footer  (bg-retro-gray, text-right, text-xs, font-pixel)
    └── a    ("Comment (0)", placeholder href="#")
The title is wrapped in ~*~ ... ~*~ decorators inside the title bar strip. The body renders the full content string from the data array.

​
Webring section

The webring strip is rendered below the post list as a centered flex row: 
div.mt-12.text-center  (font-pixel, text-sm)
├── p   ("Proud member of the Web Developer Webring")
└── div.flex.gap-4.justify-center
    ├── button  ("[ Prev ]",   win98-btn)
    ├── button  ("[ Random ]", win98-btn)
    └── button  ("[ Next ]",   win98-btn)
The buttons are <button> elements in the default code. Replace them with <a> tags pointing to real webring URLs when the portfolio is added to an actual webring network. 
// In main.js — Blog component webring buttons (after customization)
<a href="https://your-webring.net/prev"  className="win98-btn px-2 py-1 bg-retro-gray text-black">[ Prev ]</a>
<a href="https://your-webring.net/rand"  className="win98-btn px-2 py-1 bg-retro-gray text-black">[ Random ]</a>
<a href="https://your-webring.net/next"  className="win98-btn px-2 py-1 bg-retro-gray text-black">[ Next ]</a>

​
Customizing blog posts

Edit the _d array inside the Blog component in main.js to add, remove, or update entries. 
// In main.js — Blog component (_d array)
const _d = [
  {
    date:    "11/05/2023",
    title:   "Why I still use tables for layout (jk)",
    content: "Just kidding, flexbox is life. But remember when we had to slice images in Photoshop and put them in table cells? Wild times.",
  },
  {
    date:    "09/12/2023",
    title:   "My new mechanical keyboard",
    content: "Got the IBM Model M. My coworkers hate me but my fingers are in heaven. CLACK CLACK CLACK.",
  },
  {
    date:    "04/20/2023",
    title:   "Site Update v2.0",
    content: "Added the visitor counter and the guestbook. Let me know if you find any broken links!",
  },
  // Add new posts here — newest date first recommended
];
1

Add a new post

Push a new object to the top of the _d array with date, title, and content fields. Newest-first ordering is conventional for a Captain’s Log.
2

Write a longer entry

If a post needs more than a short paragraph, replace the content string with a multi-paragraph JSX block in the Blog component’s render output. There is no markdown parser — longer entries are plain JSX.
3

Link posts to external content

To link a post to an external article, wrap the title in an <a> tag inside the title bar div:
<a href="https://dev.to/you/post-slug" target="_blank" rel="noopener noreferrer">
  {post.title}
</a>
The blog has no CMS or markdown pipeline. All post content is stored as JavaScript strings inside main.js. For a portfolio with many long posts, consider extracting the _d array into a separate src/data/posts.js file and importing it.

Win98Window

Props reference for the window wrapper on this page.

Contact

The Guestbook page — readers who enjoy the blog can leave a message there.

Theming

How to change the retro-navy color token used as this page’s background.

Adding Pages

Guide for extending the portfolio with additional pages or sections.

Build docs developers (and LLMs) love

Get started for freeTalk to us