{
  "id": "ticket-stub-history",
  "name": "Travel History",
  "theme": "ticket-stub",
  "category": "Profile & Social",
  "description": "A year of travel presented as the stubs you kept, with the totals derived from them rather than stated separately as a marketing figure.",
  "layout": "A summary strip over a month-grouped wall of small torn stubs, three across, each showing only route, date and reference.",
  "modules": [
    {
      "key": "sum",
      "name": "Year summary",
      "html": "\n<header class=\"ys\"><h1>2026 so far</h1><dl><div><dt>Journeys</dt><dd class=\"n\">41</dd></div><div><dt>Distance</dt><dd class=\"n\">4,112 km</dd></div><div><dt>Spent</dt><dd class=\"n\">£1,204.60</dd></div><div><dt>Delay Repay</dt><dd class=\"n\">£64.80</dd></div></dl></header>"
    },
    {
      "key": "june",
      "name": "June stubs",
      "html": "\n<section class=\"mo\"><h2>June</h2><div class=\"g3\">\n  <article class=\"stub torn\" style=\"--px:62%\"><div class=\"lg\"><span class=\"rt\">Aberdeen → Inverness</span><span class=\"dt\">11 June · 14:32</span></div><div class=\"sm\"><span class=\"cd\">QJ4 2210</span></div></article>\n  <article class=\"stub torn late\" style=\"--px:62%\"><div class=\"lg\"><span class=\"rt\">Aberdeen → Inverness</span><span class=\"dt\">04 June · 14:32</span></div><div class=\"sm\"><span class=\"cd\">QJ4 1908</span><span class=\"lt\">+36</span></div></article>\n  <article class=\"stub torn\" style=\"--px:62%\"><div class=\"lg\"><span class=\"rt\">Aberdeen → Dundee</span><span class=\"dt\">02 June · 08:14</span></div><div class=\"sm\"><span class=\"cd\">QJ4 1841</span></div></article>\n</div></section>"
    },
    {
      "key": "may",
      "name": "May stubs",
      "html": "\n<section class=\"mo\"><h2>May</h2><div class=\"g3\">\n  <article class=\"stub torn\" style=\"--px:62%\"><div class=\"lg\"><span class=\"rt\">Aberdeen → Edinburgh</span><span class=\"dt\">28 May · 07:02</span></div><div class=\"sm\"><span class=\"cd\">QJ4 1702</span></div></article>\n  <article class=\"stub torn\" style=\"--px:62%\"><div class=\"lg\"><span class=\"rt\">Edinburgh → Aberdeen</span><span class=\"dt\">28 May · 18:40</span></div><div class=\"sm\"><span class=\"cd\">QJ4 1711</span></div></article>\n  <article class=\"stub torn late\" style=\"--px:62%\"><div class=\"lg\"><span class=\"rt\">Aberdeen → Inverurie</span><span class=\"dt\">14 May · 09:20</span></div><div class=\"sm\"><span class=\"cd\">QJ4 1544</span><span class=\"lt\">+31</span></div></article>\n  <article class=\"stub torn\" style=\"--px:62%\"><div class=\"lg\"><span class=\"rt\">Inverurie → Aberdeen</span><span class=\"dt\">14 May · 17:11</span></div><div class=\"sm\"><span class=\"cd\">QJ4 1560</span></div></article>\n  <article class=\"stub torn\" style=\"--px:62%\"><div class=\"lg\"><span class=\"rt\">Aberdeen → Stonehaven</span><span class=\"dt\">06 May · 11:04</span></div><div class=\"sm\"><span class=\"cd\">QJ4 1490</span></div></article>\n  <article class=\"stub torn\" style=\"--px:62%\"><div class=\"lg\"><span class=\"rt\">Stonehaven → Aberdeen</span><span class=\"dt\">06 May · 16:22</span></div><div class=\"sm\"><span class=\"cd\">QJ4 1498</span></div></article>\n</div></section>"
    }
  ],
  "moduleCount": 3,
  "reorderable": true,
  "meta": {
    "id": "ticket-stub-history",
    "model": "Claude Opus 5",
    "author": "Claude Code",
    "createdAt": "2026-09-01T23:46:02+09:00",
    "updatedAt": "2026-09-01T23:46:02+09:00",
    "version": "1.0.0",
    "isNew": false
  },
  "link": "/api/v1/designs/ticket-stub-history.json",
  "structure": "A summary strip over a month-grouped wall of small torn stubs, three across, each showing only route, date and reference.",
  "html": "<div class=\"dz dz-ticket-stub-history\" data-design=\"ticket-stub-history\" data-theme=\"ticket-stub\">\n<section class=\"dz-mod\" data-mod=\"sum\" aria-label=\"Year summary\">\n<header class=\"ys\"><h1>2026 so far</h1><dl><div><dt>Journeys</dt><dd class=\"n\">41</dd></div><div><dt>Distance</dt><dd class=\"n\">4,112 km</dd></div><div><dt>Spent</dt><dd class=\"n\">£1,204.60</dd></div><div><dt>Delay Repay</dt><dd class=\"n\">£64.80</dd></div></dl></header></section>\n<section class=\"dz-mod\" data-mod=\"june\" aria-label=\"June stubs\">\n<section class=\"mo\"><h2>June</h2><div class=\"g3\">\n  <article class=\"stub torn\" style=\"--px:62%\"><div class=\"lg\"><span class=\"rt\">Aberdeen → Inverness</span><span class=\"dt\">11 June · 14:32</span></div><div class=\"sm\"><span class=\"cd\">QJ4 2210</span></div></article>\n  <article class=\"stub torn late\" style=\"--px:62%\"><div class=\"lg\"><span class=\"rt\">Aberdeen → Inverness</span><span class=\"dt\">04 June · 14:32</span></div><div class=\"sm\"><span class=\"cd\">QJ4 1908</span><span class=\"lt\">+36</span></div></article>\n  <article class=\"stub torn\" style=\"--px:62%\"><div class=\"lg\"><span class=\"rt\">Aberdeen → Dundee</span><span class=\"dt\">02 June · 08:14</span></div><div class=\"sm\"><span class=\"cd\">QJ4 1841</span></div></article>\n</div></section></section>\n<section class=\"dz-mod\" data-mod=\"may\" aria-label=\"May stubs\">\n<section class=\"mo\"><h2>May</h2><div class=\"g3\">\n  <article class=\"stub torn\" style=\"--px:62%\"><div class=\"lg\"><span class=\"rt\">Aberdeen → Edinburgh</span><span class=\"dt\">28 May · 07:02</span></div><div class=\"sm\"><span class=\"cd\">QJ4 1702</span></div></article>\n  <article class=\"stub torn\" style=\"--px:62%\"><div class=\"lg\"><span class=\"rt\">Edinburgh → Aberdeen</span><span class=\"dt\">28 May · 18:40</span></div><div class=\"sm\"><span class=\"cd\">QJ4 1711</span></div></article>\n  <article class=\"stub torn late\" style=\"--px:62%\"><div class=\"lg\"><span class=\"rt\">Aberdeen → Inverurie</span><span class=\"dt\">14 May · 09:20</span></div><div class=\"sm\"><span class=\"cd\">QJ4 1544</span><span class=\"lt\">+31</span></div></article>\n  <article class=\"stub torn\" style=\"--px:62%\"><div class=\"lg\"><span class=\"rt\">Inverurie → Aberdeen</span><span class=\"dt\">14 May · 17:11</span></div><div class=\"sm\"><span class=\"cd\">QJ4 1560</span></div></article>\n  <article class=\"stub torn\" style=\"--px:62%\"><div class=\"lg\"><span class=\"rt\">Aberdeen → Stonehaven</span><span class=\"dt\">06 May · 11:04</span></div><div class=\"sm\"><span class=\"cd\">QJ4 1490</span></div></article>\n  <article class=\"stub torn\" style=\"--px:62%\"><div class=\"lg\"><span class=\"rt\">Stonehaven → Aberdeen</span><span class=\"dt\">06 May · 16:22</span></div><div class=\"sm\"><span class=\"cd\">QJ4 1498</span></div></article>\n</div></section></section>\n</div>",
  "css": "\n.dz-ticket-stub-history { background: var(--background); color: var(--foreground); font-family: var(--pv-body); padding: 26px 28px; }\n.dz-ticket-stub-history .ys { display: flex; justify-content: space-between; align-items: flex-end; padding-bottom: 18px; border-bottom: 1px solid var(--border); margin-bottom: 22px; }\n.dz-ticket-stub-history h1 { font-family: var(--pv-display); font-weight: 600; font-size: 34px; margin: 0; }\n.dz-ticket-stub-history dl { display: flex; gap: 34px; margin: 0; }\n.dz-ticket-stub-history dl div { display: grid; gap: 3px; }\n.dz-ticket-stub-history dt { text-transform: uppercase; letter-spacing: .2em; font-size: 10px; font-weight: 700; color: var(--muted-foreground); margin: 0; }\n.dz-ticket-stub-history dd { margin: 0; }\n.dz-ticket-stub-history .n { font-family: var(--pv-mono); font-size: 20px; letter-spacing: .02em; }\n.dz-ticket-stub-history h2 { text-transform: uppercase; letter-spacing: .2em; font-size: 10px; font-weight: 700; color: var(--muted-foreground); margin: 0 0 12px; }\n.dz-ticket-stub-history .mo { margin-bottom: 26px; }\n.dz-ticket-stub-history .g3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }\n.dz-ticket-stub-history .stub { display: grid; grid-template-columns: 62% 38%; border: 1px solid var(--border); border-radius: var(--pv-radius); background:\n  radial-gradient(circle 7px at var(--px) 0, transparent 98%, var(--card) 100%),\n  radial-gradient(circle 7px at var(--px) 100%, transparent 98%, var(--card) 100%),\n  var(--card); overflow: hidden; }\n.dz-ticket-stub-history .torn { opacity: .8; }\n.dz-ticket-stub-history .late { border-left: 3px solid var(--destructive); }\n.dz-ticket-stub-history .lg { padding: 14px 16px; display: grid; gap: 4px; }\n.dz-ticket-stub-history .rt { font-size: 14px; font-weight: 600; }\n.dz-ticket-stub-history .dt { text-transform: uppercase; letter-spacing: .2em; font-size: 10px; font-weight: 700; color: var(--muted-foreground); }\n.dz-ticket-stub-history .sm { padding: 14px 16px; border-left: 1px dashed var(--border); display: grid; align-content: center; gap: 4px; }\n.dz-ticket-stub-history .cd { font-family: var(--pv-mono); font-size: 13px; letter-spacing: .04em; font-size: 12px; }\n.dz-ticket-stub-history .lt { text-transform: uppercase; letter-spacing: .2em; font-size: 10px; font-weight: 700; color: var(--muted-foreground); color: var(--destructive); }\n",
  "requiredTheme": "/api/v1/themes/ticket-stub.json",
  "googleFontsHref": "https://fonts.googleapis.com/css2?family=Khand:wght@400;500;600;700&family=Asap:wght@400;500;600;700&family=Overpass+Mono:wght@400;500;600;700&display=swap"
}