Hugo layout showcase

Dummy detail page for navigation, TOC, Goldmark, and shortcodes.

Role: Reference

Overview

This page uses the showcase layout: a toolbar under the global header, a sticky table of contents from Hugo’s .TableOfContents, body markdown in the center, and a right-hand tidbits column fed from front matter.

What you are looking at

Front matter drives the document title, summary line, and aside tidbits (see aside_tidbits in this file).
Headings from ## upward populate Page contents in the left aside (see [markup.tableOfContents] in this file and site config).

Markdown building blocks

Lists and tasks

Unordered item one
Unordered item two

Ordered first
Ordered second

Task done
Task todo

Blockquote

A short pull quote or citation. Hugo leaves semantics to the theme’s .prose styles.

Code

Inline code and a fenced block:

hugo server --disableFastRender

const toc = document.querySelector("#TableOfContents");
console.log(toc ? "TOC present" : "No TOC");

Table

Column A	Column B
Alpha	1
Beta	2

Link

Back to home section (relative link from this URL) and this site.

Horizontal rule

Hugo shortcodes

Other work (query)

This list is generated by a shortcode that calls where on site.RegularPages (excludes this showcase page):

Rocket Learning × Google.org Fellowship — Designing Appu — a voice-first, GenAI tutor for 3–6 year-olds. I led a 0→1 design sprint that translated early childhood pedagogy, India field realities, and model capabilities into a product piloted at scale.
Solving for MSMEs with M365 — Research-led UX strategy at Microsoft IDC—mapping how Indian MSMEs actually run on WhatsApp, ledgers, and human glue, then shaping M365 directions that integrate without importing enterprise complexity.
Leading the strategy for NIUs for Google Maps — From notifications to content systems—aligning digital information with real-world context for new-internet users on Maps.
Live Application Migration Planner — How I built a 0→1 product as the first designer on the platform—from early discovery through a design partner cohort, an MVP, and a strategy for productizing complex migration tooling.

Mocks

Anchor target for Skip to mocks in the toolbar. Place wireframe images, embedded HTML demos, or static mocks here.

Mock notes

Use this section for design notes, links to Figma, or embedded iframes when you are ready (mind CSP on your host if you add iframes).

Appendix

Strong, emphasis, ~~strikethrough~~, and footnotes if enabled in hugo.toml under [markup.goldmark].