Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/apursley2012/telemetry/llms.txt

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

The Writing page — labeled “WRITING” in the top navigation — is your communications log. Titled “Received Transmissions” in the UI, it presents your articles, essays, and blog posts as filterable accordion cards, with an expand-to-read-excerpt interaction and a “DECODE FULL MESSAGE” call-to-action linking to the full content.

​
Route

#/writing
Rendered by the Writing page component in main.js, registered as the writing child route under /.

​
Static Shell

The file pages/Writing.html is the standalone entry point: 
<script>window.__STATIC_PAGE_ROUTE__ = "/writing";</script>

​
Page Layout

Page Heading

“Received Transmissions” with serif-italic text-aurora-cyan on “Transmissions”. Sub-label: "COMMUNICATIONS LOG: ARTICLES & THOUGHTS".

Category Filter Bar

Pill buttons for each category. Active category gets bg-aurora-teal/20 border-aurora-teal text-aurora-cyan; inactive pills are border-white/10 text-slate-400.

​
Default Categories

The categories array defines the filter tabs: 
["All Frequencies", "Field Reports", "Reflections", "Anomaly Logs"]
  • All Frequencies — shows all posts
  • Field Reports — technical tutorials and how-tos
  • Reflections — personal observations on process, career, and design
  • Anomaly Logs — debugging stories, incident write-ups, and deep dives

​
Article Cards

Each article renders as an accordion card. Clicking the card header toggles the excerpt body open/closed using AnimatePresence with height: 0 → "auto" animation. Card header contains:
  • Date (font-mono text-xs text-slate-500, format YYYY.MM.DD)
  • Category badge (bg-white/5 text-slate-300)
  • Priority flag (CircleAlert icon in text-sunset-orange) — only on priority items
  • Article title (large, bold)
  • Chevron icon (ChevronDown) that rotates 180° when expanded
Card body (expanded) contains:
  • Excerpt paragraph
  • "DECODE FULL MESSAGE" button using the RadioReceiver icon — wire this to your external link or internal route
Writing items can link externally (Medium, Substack, dev.to, your personal blog) or internally to a dedicated route like #/writing/article-slug. For external links, change the "DECODE FULL MESSAGE" button to an <a> tag with href, target="_blank", and rel="noopener noreferrer". For internal navigation, use a NavLink to the article’s hash route.

​
Writing Entry Data Structure

Articles are defined in a data array in the Writing page component: 
{
  id: 1,
  title: "The React Re-render Paradox",
  date: "2023.10.15",           // YYYY.MM.DD format
  category: "Anomaly Logs",     // must match one of the filter categories
  excerpt: "Investigating a strange phenomenon…",
  priority: true                // true = orange border + PRIORITY badge
}
The article entries above are example defaults included with the template. Replace them with your real articles by editing the writing data array in the Writing page component.
FieldTypeDescription
idnumberUnique key for React rendering
titlestringArticle title displayed prominently
datestringPublish date in YYYY.MM.DD format
categorystringMust exactly match a value in the categories array
excerptstringSummary shown when card is expanded
prioritybooleantrue gives the card an orange border and a PRIORITY badge

​
Adding a New Article

1

Add an entry to the articles data array

Open the Writing page component and find the articles data array. Append a new object:
{
  id: 4,
  title: "Why I Ditched Redux for Zustand",
  date: "2024.03.20",
  category: "Field Reports",
  excerpt: "After years of Redux boilerplate, switching to Zustand felt like jettisoning dead weight before a hyperjump. Here's what I learned.",
  priority: false
}
2

Add a category if needed

If you introduce a new category (e.g. "Deep Space Dives"), add it to the categories array and update any entries that should belong to it. The filter button renders automatically from the array.
3

Wire the CTA button

Find the "DECODE FULL MESSAGE" button inside the card body in the Writing page component. Wrap it in an <a> tag or a NavLink pointing to your full article:
<a
  href="https://medium.com/@you/article-slug"
  target="_blank"
  rel="noopener noreferrer"
  className="font-mono text-sm text-aurora-cyan hover:text-white
             transition-colors flex items-center gap-2 interactive"
>
  <RadioReceiver className="w-4 h-4" /> DECODE FULL MESSAGE
</a>
Set priority: true on any article to highlight it. Priority cards receive:
  • An border-sunset-orange/50 border (versus the default border-white/10)
  • A PRIORITY badge next to the date and category using the CircleAlert icon in text-sunset-orange
Use priority sparingly — one or two featured posts stand out; marking everything as priority defeats the purpose.

Build docs developers (and LLMs) love

Get started for freeTalk to us