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 Holler At Me page is the final stop in the Color Melt portfolio flow. It gives visitors a direct, low-friction way to reach you — through a themed contact form built with the LiquidForm component and through plainly listed links to your email, GitHub profile, LinkedIn, and downloadable résumé. The page is deliberately simple: one job, done clearly.

​
Purpose

A contact page exists to remove every possible reason for a visitor to give up before reaching out. Someone who has made it through your projects, case studies, and about page is already interested. If the contact page is confusing, buried, or missing key information, that interest converts into nothing. The Holler At Me page keeps the path short. The LiquidForm component provides a styled, accessible form for visitors who prefer to write a message without leaving the site. The direct links — email, GitHub, LinkedIn, résumé — serve visitors who would rather reach you on a platform they already use or download your credentials before sending a message. This page is the appropriate target for the resume download link, the primary professional email address, and any public profile that represents how you prefer to be contacted. Keep it current.

​
Components Used

The following Color Melt components are loaded by pages/Contact.html:
ComponentFileRole on this page
Navigationcomponents/Navigation.jsSite-wide nav bar with the “Holler At Me” label highlighted in bg-teal
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 contact form with dye-color label and border focus states
LiquidForm is the contact-specific component on this page. It renders an accessible, styled form with floating labels and focus rings that match the Color Melt dye-color palette — labels shift to dye-yellow, dye-blue, and dye-pink tones when their corresponding inputs are active. The remaining components — Navigation, CursorDrops, PageTransition, TieDyeSpiral, LavaBlob, StickerSheet, ShirtRack, RainbowArch, SpiralTimeline, MagazineSpread, PatchworkQuilt, and SmileyFlower — are loaded on every Color Melt page.

​
Content to Customize

Update the contact details before publishing. Every piece of contact information on this page should be yours and should be accurate.
1

Email address

Replace the placeholder email with your professional address. If you are linking a mailto: href, confirm that the address in the link text and the href attribute both match.
2

GitHub profile link

Replace the placeholder GitHub URL with your own profile link. The standard format is https://github.com/your-username. Remove this link entirely if you do not want to surface your GitHub from the contact page.
3

LinkedIn profile link

Replace the placeholder LinkedIn URL with your own profile link. The standard format is https://linkedin.com/in/your-username. LinkedIn is often the preferred channel for professional outreach, so this link carries weight.
4

Résumé download link

Replace the placeholder résumé link with the URL or relative path to your current PDF résumé. If you store the file in the repository, place it at a predictable path — for example, assets/resume.pdf — and use a relative link. If you host it externally (Google Drive, Dropbox, a personal domain), use the direct download URL rather than a preview link.
Avoid publishing your personal email directly in the HTML if you’re concerned about spam scrapers. Consider linking to a contact form service or your LinkedIn profile instead.

​
File Location

The contact page is defined at: 
pages/Contact.html
The static route is set by this script block inside the file: 
<script>
  window.__STATIC_PAGE_ROUTE__ = "/contact";
  if (!window.location.hash || window.location.hash === "#/" || window.location.hash === "#") {
    window.location.hash = "/contact";
  }
</script>
The hash-based routing (#/contact) 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 “Holler At Me” is defined in components/Navigation.js and applies the bg-teal background class (#008080) to the active link when this route is current.

Build docs developers (and LLMs) love

Get started for freeTalk to us