Skip to main content

Documentation Index

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

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

The Long Reads page is Color Melt’s archive for written work. A visitor arriving here expects a collection of articles, essays, tutorials, or posts — things worth sitting with rather than skimming. The page surfaces your writing alongside just enough metadata (title, date, summary, link) to help a reader decide what to open first.

​
Purpose

Writing is one of the clearest signals of how someone thinks. An articles page lets you collect that work in one place regardless of where it was originally published — a personal blog, a company engineering blog, Medium, DEV Community, Substack, or a documentation site you contributed to. Recruiters and clients who reach this page are often already interested. They are looking for evidence that you can explain ideas clearly, engage with a topic at depth, and communicate to different audiences. Even a small, consistent body of writing strengthens a portfolio that would otherwise be mostly code and job titles. This page suits technical writers, developers who blog, designers who share process posts, and anyone who has produced long-form content they want a hiring manager or collaborator to find quickly.

​
Components Used

The following Color Melt components are loaded by pages/Articles.html:
ComponentFileRole on this page
Navigationcomponents/Navigation.jsSite-wide nav bar with the “Long Reads” label highlighted in bg-dye-pink
CursorDropscomponents/CursorDrops.jsAdds the liquid-color cursor-drop trail effect across the page
PageTransitioncomponents/PageTransition.jsAnimates the entry and exit transitions when navigating between pages
TieDyeSpiralcomponents/TieDyeSpiral.jsProvides the theme-specific Tie Dye Spiral decorative element
LavaBlobcomponents/LavaBlob.jsProvides the theme-specific Lava Blob interface element
StickerSheetcomponents/StickerSheet.jsProvides the theme-specific Sticker Sheet interface element
ShirtRackcomponents/ShirtRack.jsProvides the theme-specific Shirt Rack interface element
RainbowArchcomponents/RainbowArch.jsProvides the theme-specific Rainbow Arch interface element
SpiralTimelinecomponents/SpiralTimeline.jsCreates timeline-style content presentation
MagazineSpreadcomponents/MagazineSpread.jsProvides the theme-specific Magazine Spread interface element
PatchworkQuiltcomponents/PatchworkQuilt.jsProvides the theme-specific Patchwork Quilt interface element
SmileyFlowercomponents/SmileyFlower.jsProvides the theme-specific Smiley Flower interface element
LiquidFormcomponents/LiquidForm.jsProvides the themed form or contact interaction
All thirteen components are loaded on every Color Melt page. The article entries themselves are presented through the base page structure, which means customization is focused entirely on the article data — titles, dates, summaries, and outbound links.

​
Content to Customize

Work through the article entries in the page markup and replace each starter item with a real published piece. For each article, update:
1

Article title

Replace the placeholder title with the exact published title of the piece. If the article lives on an external platform, the title should match what appears there so readers can verify they are in the right place after clicking through.
2

Publication date

Add the date the article was published or last updated. A consistent date format across all entries makes the archive easier to scan — for example, June 2025 or 2025-06-14.
3

Summary

Write one to three sentences describing what the article covers and who it is for. This does not need to be the article’s own introduction — a short description written specifically for this archive page is more useful because it helps a reader decide whether to click.
4

External link

Replace the placeholder href value with the canonical URL of the published article. If the article exists on multiple platforms, link to the version you consider authoritative. If you self-host your writing, link to the post on your own site.
If you don’t have published articles yet, this page works well as a reading list, project post-mortems, or links to talks and presentations.

​
File Location

The articles page is defined at: 
pages/Articles.html
The static route is set by this script block inside the file: 
<script>
  window.__STATIC_PAGE_ROUTE__ = "/articles";
  if (!window.location.hash || window.location.hash === "#/" || window.location.hash === "#") {
    window.location.hash = "/articles";
  }
</script>
The hash-based routing (#/articles) allows Color Melt to function as a static site on GitHub Pages without any server-side routing configuration. The window.__STATIC_PAGE_ROUTE__ value tells the React app which page component to mount when this HTML file is loaded directly. The nav label “Long Reads” is defined in components/Navigation.js and applies the bg-dye-pink background class (#FF99C8) to the active link when this route is current.

Build docs developers (and LLMs) love

Get started for freeTalk to us