{
  "id": "ultra-civic-notice",
  "name": "Public Notice",
  "theme": "ultra-civic",
  "category": "Marketing",
  "description": "A statutory notice designed to be read once and understood, with the deadline as the largest thing on the page and the objection route directly beneath it.",
  "layout": "A single column where a full-bleed ultramarine deadline block sits between the notice text and the objection form, so the date cannot be scrolled past.",
  "modules": [
    {
      "key": "head",
      "name": "Notice header",
      "html": "\n<header class=\"hd\"><span class=\"k\">Public notice · Planning</span><h1>Proposed development at Kirkstall Wharf</h1><span class=\"m\">Reference NF/2026/0884 · posted 4 September 2026</span></header>"
    },
    {
      "key": "body",
      "name": "Notice text",
      "html": "\n<article class=\"bd\">\n  <p>Notice is given that an application has been made for the erection of 142 dwellings, a commercial unit of 410 square metres, and associated access and landscaping on land at Kirkstall Wharf, Northfield.</p>\n  <p>The application and all supporting documents may be inspected online, or in person at the Civic Centre between 09:00 and 16:30, Monday to Thursday.</p>\n  <p>Any person may make representations. Representations are published in full, including your name, but not your address or contact details.</p>\n</article>"
    },
    {
      "key": "deadline",
      "name": "Deadline block",
      "html": "\n<div class=\"dl\"><span>Representations must be received by</span><b>2 October 2026</b><span>Late representations cannot be considered.</span></div>"
    },
    {
      "key": "object",
      "name": "Objection routes",
      "html": "\n<section class=\"ob\"><span class=\"k\">How to make a representation</span>\n<div class=\"rt\">\n  <a href=\"#\"><b>Online</b><span class=\"m\">Takes about ten minutes. You will get a receipt.</span></a>\n  <a href=\"#\"><b>By post</b><span class=\"m\">Planning, Civic Centre, Northfield NF1 1AA.</span></a>\n  <a href=\"#\"><b>In person</b><span class=\"m\">No appointment needed, Monday to Thursday.</span></a>\n</div></section>"
    }
  ],
  "moduleCount": 4,
  "reorderable": true,
  "meta": {
    "id": "ultra-civic-notice",
    "model": "Claude Opus 5",
    "author": "Claude Code",
    "createdAt": "2026-09-01T20:01:13+09:00",
    "updatedAt": "2026-09-01T20:01:13+09:00",
    "version": "1.0.0",
    "isNew": false
  },
  "link": "/api/v1/designs/ultra-civic-notice.json",
  "structure": "A single column where a full-bleed ultramarine deadline block sits between the notice text and the objection form, so the date cannot be scrolled past.",
  "html": "<div class=\"dz dz-ultra-civic-notice\" data-design=\"ultra-civic-notice\" data-theme=\"ultra-civic\">\n<section class=\"dz-mod\" data-mod=\"head\" aria-label=\"Notice header\">\n<header class=\"hd\"><span class=\"k\">Public notice · Planning</span><h1>Proposed development at Kirkstall Wharf</h1><span class=\"m\">Reference NF/2026/0884 · posted 4 September 2026</span></header></section>\n<section class=\"dz-mod\" data-mod=\"body\" aria-label=\"Notice text\">\n<article class=\"bd\">\n  <p>Notice is given that an application has been made for the erection of 142 dwellings, a commercial unit of 410 square metres, and associated access and landscaping on land at Kirkstall Wharf, Northfield.</p>\n  <p>The application and all supporting documents may be inspected online, or in person at the Civic Centre between 09:00 and 16:30, Monday to Thursday.</p>\n  <p>Any person may make representations. Representations are published in full, including your name, but not your address or contact details.</p>\n</article></section>\n<section class=\"dz-mod\" data-mod=\"deadline\" aria-label=\"Deadline block\">\n<div class=\"dl\"><span>Representations must be received by</span><b>2 October 2026</b><span>Late representations cannot be considered.</span></div></section>\n<section class=\"dz-mod\" data-mod=\"object\" aria-label=\"Objection routes\">\n<section class=\"ob\"><span class=\"k\">How to make a representation</span>\n<div class=\"rt\">\n  <a href=\"#\"><b>Online</b><span class=\"m\">Takes about ten minutes. You will get a receipt.</span></a>\n  <a href=\"#\"><b>By post</b><span class=\"m\">Planning, Civic Centre, Northfield NF1 1AA.</span></a>\n  <a href=\"#\"><b>In person</b><span class=\"m\">No appointment needed, Monday to Thursday.</span></a>\n</div></section></section>\n</div>",
  "css": "\n.dz-ultra-civic-notice { background: var(--background); color: var(--foreground); font-family: var(--pv-body); }\n.dz-ultra-civic-notice .hd { padding: 30px 28px 20px; }\n.dz-ultra-civic-notice .k { font-size: 12.5px; display: block; }\n.dz-ultra-civic-notice .hd h1 { font-family: var(--pv-display); text-transform: uppercase; font-weight: 700; letter-spacing: -.02em; font-size: 52px; line-height: 1.02; margin: 8px 0 8px; max-width: 20ch; }\n.dz-ultra-civic-notice .m { font-size: 13.5px; }\n.dz-ultra-civic-notice .bd { padding: 0 28px 28px; max-width: 66ch; }\n.dz-ultra-civic-notice .bd p { font-size: 16.5px; line-height: 1.62; margin: 0 0 14px; }\n.dz-ultra-civic-notice .dl { background: var(--primary); color: var(--primary-foreground); padding: 30px 28px; display: flex; flex-direction: column; gap: 4px; }\n.dz-ultra-civic-notice .dl span { font-size: 15px; }\n.dz-ultra-civic-notice .dl b { font-family: var(--pv-display); text-transform: uppercase; font-weight: 700; letter-spacing: -.02em; font-size: 66px; line-height: 1; margin: 4px 0 6px; }\n.dz-ultra-civic-notice .ob { padding: 28px; }\n.dz-ultra-civic-notice .rt { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 12px; }\n.dz-ultra-civic-notice .rt a { border: 2px solid var(--foreground); border-radius: 0; padding: 16px 18px; text-decoration: none; color: var(--foreground); display: flex; flex-direction: column; gap: 5px; transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); }\n.dz-ultra-civic-notice .rt a:hover { background: var(--foreground); color: var(--background); }\n.dz-ultra-civic-notice .rt b { font-family: var(--pv-display); text-transform: uppercase; font-weight: 700; letter-spacing: -.02em; font-size: 22px; }\n@media (prefers-reduced-motion: reduce) { .dz-ultra-civic-notice *, .dz-ultra-civic-notice *::before, .dz-ultra-civic-notice *::after { transition-duration: 1ms !important; animation-duration: 1ms !important; } }",
  "requiredTheme": "/api/v1/themes/ultra-civic.json",
  "googleFontsHref": "https://fonts.googleapis.com/css2?family=Archivo:wght@400;500;600;700&family=Azeret+Mono:wght@400;500;600;700&display=swap"
}