Shell Preview

One example page per type. URLs use clean paths — no .html, slug only (e.g. /people/petter-hanson-stadum/).

Story pages include a thin audio bar between breadcrumbs and hero. Explore bar is right-aligned.

era shell

Baker Electric & Rural Electrification

/shell-preview/eras/electrification/
  1. 1. #stories (Stories)
  2. 2. Journey (map + timeline combined)
  3. 3. #people (People)
  4. 4. #media (Media)
  5. 5. #sources (Sources)
Open preview →
event shell

Palmer & Signe's Wedding

/shell-preview/events/palmer-signe-wedding/
  1. 1. #stories (Stories)
  2. 2. Journey (map + timeline combined)
  3. 3. #people (People)
  4. 4. #media (Media)
  5. 5. #sources (Sources)
Open preview →
person shell

Petter Hanson Stadum

/shell-preview/people/petter-hanson-stadum/
  1. 1. #overview (Overview)
  2. 2. #stories (Stories)
  3. 3. Journey (map + timeline combined)
  4. 4. #audio (Audio)
  5. 5. #graph (Graph)
  6. 6. Where the story continues
  7. 7. #media (Media)
  8. 8. #sources (Sources)
Open preview →
place shell

English Harbour, Antigua

/shell-preview/places/english-harbour-antigua/
  1. 1. #stories (Stories)
  2. 2. Journey (map + timeline combined)
  3. 3. #people (People)
  4. 4. #media (Media)
  5. 5. #sources (Sources)
Open preview →
story shell

Stadum Ancestors

/shell-preview/stories/stadum-ancestors/
  1. 1. #stories (Stories)
  2. 2. Journey (map + timeline combined)
  3. 3. #people (People)
  4. 4. #media (Media)
  5. 5. #sources (Sources)
Open preview →

Section order: templates/orders.json. URL helpers: scripts/url-paths.mjs.