Skip to main content

Documentation Index

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

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

The Internet Explorer window is the most visually bombastic component in Log Portfolio. It channels peak-1999 GeoCities energy: a black background dusted with a stardust texture, a pulsing yellow headline, lime-green marquee text, a magenta border glow, and a visitor counter rendered in a pixel font. The blog post inside is written in the voice of a developer who just discovered React and isn’t sure how to feel about it.

Retro Design Elements

ElementImplementation
Backgroundbg-black with inline backgroundImage pointing to transparenttextures.com/patterns/stardust.png
Page titletext-yellow-400 drop-shadow-[2px_2px_0_red] animate-pulse — creates a red drop-shadow and a slow pulsing animation
MarqueeNative <marquee> element with bg-blue-900 text-lime-400 border-y-2 border-lime-400 and font-pixel
Blog card borderborder-4 border-double with shadow-[0_0_15px_#ff00ff] for the magenta glow effect
Visitor counterFixed string 00042 rendered inside a bg-black border-2 border-gray-600 box with font-pixel text-red-500 tracking-[0.2em]
Under construction GIFsTwo <img> tags fetching the classic animated GIF from web.archive.org
Browser badgesTwo bg-gray-800 bordered labels: Best viewed in Netscape and 800x600 Resolution

Marquee Text

The marquee scrolls the following string across a dark blue bar:
LATEST UPDATE: Learned how to use CSS Grid! No more tables! ... Wait, tables are still cool right?

Blog Post Content

The blog card (max-w-2xl mx-auto bg-gray-900/80) contains two sections separated by a dashed cyan <hr>: My Web Development Journey
Today I discovered something amazing called “React”. It’s like DHTML but way more complicated! I still prefer using Dreamweaver, but everyone says this is the future.
Top 5 HTML Tags — rendered as a list-disc list-inside unordered list:
  1. <blink> (RIP)
  2. <marquee>
  3. <center>
  4. <font color="red">
  5. <table border="1">

Visitor Counter

The counter is a hardcoded string 00042 displayed in a black bordered box below the blog content:
<div className="inline-block bg-black border-2 border-gray-600 p-1 font-pixel text-red-500 text-xl tracking-[0.2em]">
  00042
</div>
To change the displayed number, edit the string "00042" inside the Q component in components/Desktop.js.

Customizing

1

Edit the marquee text

Find the <marquee> element inside the Q component in components/Desktop.js and replace the children string with your own scrolling announcement.
2

Edit the blog post

The blog body is a JSX <p> element inside the Q component. Replace the text content with your own story. The <hr> divider, Top 5 list, and visitor counter are all separate JSX nodes immediately below it.
3

Change the visitor counter

Edit the hardcoded "00042" string inside the counter <div>. All characters are rendered in the pixel font, so any digit string (or fun ASCII art) will display correctly.
4

Swap the Top 5 list

The list is a hard-coded <ul> with five <li> children. Edit, remove, or add <li> nodes to reflect your own favourite tags, libraries, or whatever you’d like to celebrate.
The <marquee> element is deprecated in modern HTML but still renders in all current browsers. It is used intentionally here as a period-accurate retro element — resist the urge to replace it with a CSS animation unless you’re prepared to lose the authentic GeoCities vibe.
The under-construction GIFs are loaded from web.archive.org and may be slow or unavailable if the Wayback Machine is under load. For a more reliable experience, download the GIF locally and reference it from the public/ folder instead.

Build docs developers (and LLMs) love