Implement Spotlight system templates and edge-case structure (LS-1718)

CHANGELOG.md

@@ -11,6 +11,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Added
 
+- `templates/front-page.html` — the curated homepage: hero, "Explore by topic," "Latest news," dashboard-CTA banner, "Special Projects," provincial coverage + newsletter, and "Perspectives" sections, each a structural placeholder pending pattern-authoring work; no `core/query` block, `header`/`trust-bar`/`footer` parts (see LS-1718).
+- `templates/search.html` — reuses the home/archive card-grid structure with an inherited `core/query` block bound to the search query and a `core/query-title` showing the search term, no topic-filter pills (see LS-1718).
+- `templates/404.html` — a calm "Page not found" message plus a `core/search` form, no post query loop (see LS-1718).
 - `templates/single.html` — post content (category, title, byline/date, featured image, content) plus the shared `sidebar-editorial` template part and a single-post-specific "Explore topics" module — a `core/terms-query` scoped via `termQuery.include` to the 7 real categories matching the design's curated topic list (Latest, HIV/AIDS, TB, NHI, Access to Medicines, Healthcare system, NCDs), per Zared's PR #6 review feedback, rather than a static hand-typed list — a `[Republish pattern placeholder]` (the CC-licence republish box from the design, deferred to the patterns phase per `design.md`'s stated non-goals), previous/next post navigation, and a "Recent stories" query using the Advanced Query Loop plugin's "exclude current post" option, so the post being viewed never appears in its own recent-stories list (see LS-1717). No custom category matching — this is a plain latest-posts query, per Zared's PR #6 review feedback.
 - `templates/page.html` — prose content plus the shared `sidebar-editorial` template part, with no post-meta elements (see LS-1717).
 - `templates/home.html` — the site's Posts Page: page header (title + search), a real `core/categories` topic-filter list, an inherited/paginated `core/query` post grid, `header`/`trust-bar`/`footer` template parts (see LS-1716). Each card is a `[Blog Card pattern placeholder]`, pending the design-system pattern Zared confirmed will be authored in the upcoming patterns phase, per his review feedback on PR #5.

openspec/changes/spotlight-template-hierarchy/tasks.md

@@ -34,14 +34,14 @@
 
 ## 4. LS-1718 — system templates and edge-case structure (branch: `feat/ls-1718-system-templates-and-edge-case-structure`, base: `feat/ls-1715-shared-template-parts-and-wrappers`)
 
-- [ ] 4.1 Create `templates/front-page.html`: compose pattern insertion-point placeholders for hero, topic grid, latest-news row, dashboard CTA, special projects, provincial coverage + newsletter, and perspectives, with `header`, `trust-bar`, and `footer` template parts and no `core/query` block (bundled here rather than under 1716/1717, since it predates the dev-ready designs and doesn't map cleanly to either of those sub-issue titles)
-- [ ] 4.2 Create `templates/search.html`: reuse the home/archive card-grid structure with a `core/query` block bound to the search query, no topic-filter pills, with `header`, `trust-bar`, and `footer` template parts
-- [ ] 4.3 Create `templates/404.html`: calm message plus a search form element, no post query loop, with `header`, `trust-bar`, and `footer` template parts
-- [ ] 4.4 Confirm `templates/index.html` is left unmodified as the fallback-of-last-resort
-- [ ] 4.5 Add any needed `theme.json` `customTemplates` entry for `front-page`/`search`/`404` if an editor-facing label/description is warranted
-- [ ] 4.6 Run `npm run schema:validate` and `npm run theme:validate`
-- [ ] 4.7 Verify in the Site Editor: `front-page.html` renders for the site root, `search.html`/`404.html` render without fatal errors
-- [ ] 4.8 Update `CHANGELOG.md` under `## [Unreleased]`
+- [x] 4.1 Create `templates/front-page.html`: compose pattern insertion-point placeholders for hero, topic grid, latest-news row, dashboard CTA, special projects, provincial coverage + newsletter, and perspectives, with `header`, `trust-bar`, and `footer` template parts and no `core/query` block (bundled here rather than under 1716/1717, since it predates the dev-ready designs and doesn't map cleanly to either of those sub-issue titles)
+- [x] 4.2 Create `templates/search.html`: reuse the home/archive card-grid structure with a `core/query` block bound to the search query, no topic-filter pills, with `header`, `trust-bar`, and `footer` template parts
+- [x] 4.3 Create `templates/404.html`: calm message plus a search form element, no post query loop, with `header`, `trust-bar`, and `footer` template parts
+- [x] 4.4 Confirm `templates/index.html` is left unmodified as the fallback-of-last-resort
+- [x] 4.5 Add any needed `theme.json` `customTemplates` entry for `front-page`/`search`/`404` if an editor-facing label/description is warranted (evaluated: not needed — standard hierarchy slugs get sensible default editor labels automatically)
+- [x] 4.6 Run `npm run schema:validate` and `npm run theme:validate`
+- [x] 4.7 Verify in the Site Editor: `front-page.html` renders for the site root, `search.html`/`404.html` render without fatal errors
+- [x] 4.8 Update `CHANGELOG.md` under `## [Unreleased]`
 - [ ] 4.9 Open PR against `feat/ls-1715-shared-template-parts-and-wrappers` (note: depends on that PR, do not merge first) — "Closes LS-1718"
 
 ## 5. After LS-1715 merges to `develop`

templates/404.html

@@ -0,0 +1,31 @@
+<!-- wp:template-part {"slug":"header","tagName":"header"} /-->
+
+<!-- wp:group {"tagName":"main","layout":{"type":"constrained"}} -->
+<main class="wp-block-group">
+	<!-- wp:group {"className":"error-404","layout":{"type":"constrained"}} -->
+	<div class="wp-block-group error-404">
+		<!-- wp:heading {"level":1} -->
+		<h1 class="wp-block-heading">Page not found</h1>
+		<!-- /wp:heading -->
+
+		<!-- wp:paragraph -->
+		<p>We couldn't find the page you were looking for. Try searching for what you need, or head back to our homepage.</p>
+		<!-- /wp:paragraph -->
+
+		<!-- wp:search {"label":"Search","showLabel":false,"placeholder":"Search articles or topics...","buttonText":"Search"} /-->
+
+		<!-- wp:buttons -->
+		<div class="wp-block-buttons">
+			<!-- wp:button -->
+			<div class="wp-block-button"><a class="wp-block-button__link wp-element-button" href="/">Back to homepage</a></div>
+			<!-- /wp:button -->
+		</div>
+		<!-- /wp:buttons -->
+	</div>
+	<!-- /wp:group -->
+</main>
+<!-- /wp:group -->
+
+<!-- wp:template-part {"slug":"trust-bar","tagName":"div"} /-->
+
+<!-- wp:template-part {"slug":"footer","tagName":"footer"} /-->

templates/front-page.html

@@ -0,0 +1,109 @@
+<!-- wp:template-part {"slug":"header","tagName":"header"} /-->
+
+<!-- wp:group {"tagName":"main","layout":{"type":"constrained"}} -->
+<main class="wp-block-group">
+	<!-- wp:group {"className":"front-page__section front-page__hero","layout":{"type":"constrained"}} -->
+	<div class="wp-block-group front-page__section front-page__hero">
+		<!-- wp:paragraph {"fontSize":"100"} -->
+		<p class="has-100-font-size">In the Spotlight</p>
+		<!-- /wp:paragraph -->
+
+		<!-- wp:heading {"level":1} -->
+		<h1 class="wp-block-heading">[Featured-story hero pattern placeholder]</h1>
+		<!-- /wp:heading -->
+	</div>
+	<!-- /wp:group -->
+
+	<!-- wp:group {"className":"front-page__section front-page__topics","layout":{"type":"constrained"}} -->
+	<div class="wp-block-group front-page__section front-page__topics">
+		<!-- wp:heading {"level":2} -->
+		<h2 class="wp-block-heading">Explore by topic</h2>
+		<!-- /wp:heading -->
+
+		<!-- wp:paragraph -->
+		<p>[Topic-grid pattern placeholder]</p>
+		<!-- /wp:paragraph -->
+	</div>
+	<!-- /wp:group -->
+
+	<!-- wp:group {"className":"front-page__section front-page__latest-news","layout":{"type":"constrained"}} -->
+	<div class="wp-block-group front-page__section front-page__latest-news">
+		<!-- wp:heading {"level":2} -->
+		<h2 class="wp-block-heading">Latest news</h2>
+		<!-- /wp:heading -->
+
+		<!-- wp:paragraph -->
+		<p>[Latest-news card-row pattern placeholder]</p>
+		<!-- /wp:paragraph -->
+	</div>
+	<!-- /wp:group -->
+
+	<!-- wp:group {"className":"front-page__section front-page__dashboard-cta","backgroundColor":"accent-500","textColor":"base","layout":{"type":"constrained"}} -->
+	<div class="wp-block-group front-page__section front-page__dashboard-cta has-base-color has-accent-500-background-color has-text-color has-background">
+		<!-- wp:heading {"level":2} -->
+		<h2 class="wp-block-heading">Interactive Data Dashboards</h2>
+		<!-- /wp:heading -->
+
+		<!-- wp:paragraph -->
+		<p>[Dashboard-CTA banner pattern placeholder]</p>
+		<!-- /wp:paragraph -->
+	</div>
+	<!-- /wp:group -->
+
+	<!-- wp:group {"className":"front-page__section front-page__special-projects","layout":{"type":"constrained"}} -->
+	<div class="wp-block-group front-page__section front-page__special-projects">
+		<!-- wp:heading {"level":2} -->
+		<h2 class="wp-block-heading">Special Projects</h2>
+		<!-- /wp:heading -->
+
+		<!-- wp:paragraph -->
+		<p>[Special-projects card-row pattern placeholder]</p>
+		<!-- /wp:paragraph -->
+	</div>
+	<!-- /wp:group -->
+
+	<!-- wp:group {"className":"front-page__section front-page__provincial-newsletter","layout":{"type":"grid","columnCount":2}} -->
+	<div class="wp-block-group front-page__section front-page__provincial-newsletter">
+		<!-- wp:group {"layout":{"type":"constrained"}} -->
+		<div class="wp-block-group">
+			<!-- wp:heading {"level":2} -->
+			<h2 class="wp-block-heading">Provincial coverage</h2>
+			<!-- /wp:heading -->
+
+			<!-- wp:paragraph -->
+			<p>[Provincial-map pattern placeholder]</p>
+			<!-- /wp:paragraph -->
+		</div>
+		<!-- /wp:group -->
+
+		<!-- wp:group {"layout":{"type":"constrained"}} -->
+		<div class="wp-block-group">
+			<!-- wp:heading {"level":3,"fontSize":"300"} -->
+			<h3 class="wp-block-heading has-300-font-size">Read our latest newsletters</h3>
+			<!-- /wp:heading -->
+
+			<!-- wp:paragraph -->
+			<p>[Newsletter-signup pattern placeholder]</p>
+			<!-- /wp:paragraph -->
+		</div>
+		<!-- /wp:group -->
+	</div>
+	<!-- /wp:group -->
+
+	<!-- wp:group {"className":"front-page__section front-page__perspectives","layout":{"type":"constrained"}} -->
+	<div class="wp-block-group front-page__section front-page__perspectives">
+		<!-- wp:heading {"level":2} -->
+		<h2 class="wp-block-heading">Perspectives</h2>
+		<!-- /wp:heading -->
+
+		<!-- wp:paragraph -->
+		<p>[Perspectives card-row pattern placeholder]</p>
+		<!-- /wp:paragraph -->
+	</div>
+	<!-- /wp:group -->
+</main>
+<!-- /wp:group -->
+
+<!-- wp:template-part {"slug":"trust-bar","tagName":"div"} /-->
+
+<!-- wp:template-part {"slug":"footer","tagName":"footer"} /-->

templates/search.html

@@ -0,0 +1,57 @@
+<!-- wp:template-part {"slug":"header","tagName":"header"} /-->
+
+<!-- wp:group {"tagName":"main","layout":{"type":"constrained"}} -->
+<main class="wp-block-group">
+	<!-- wp:group {"className":"post-listing-header","layout":{"type":"flex","flexWrap":"wrap","justifyContent":"space-between"}} -->
+	<div class="wp-block-group post-listing-header">
+		<!-- wp:query-title {"type":"search","level":1} /-->
+
+		<!-- wp:search {"label":"Search","showLabel":false,"placeholder":"Search articles or topics...","buttonText":"Search"} /-->
+	</div>
+	<!-- /wp:group -->
+
+	<!-- wp:query {"query":{"inherit":true}} -->
+	<div class="wp-block-query">
+		<!-- wp:post-template {"layout":{"type":"grid","columnCount":3}} -->
+			<!-- wp:group {"tagName":"article"} -->
+			<article class="wp-block-group">
+				<!-- wp:post-featured-image {"isLink":true} /-->
+
+				<!-- wp:post-terms {"term":"category","fontSize":"100"} /-->
+
+				<!-- wp:post-title {"isLink":true} /-->
+
+				<!-- wp:post-excerpt /-->
+
+				<!-- wp:group {"layout":{"type":"flex","flexWrap":"wrap"}} -->
+				<div class="wp-block-group">
+					<!-- wp:post-author {"showAvatar":false,"fontSize":"100"} /-->
+
+					<!-- wp:post-date {"fontSize":"100"} /-->
+				</div>
+				<!-- /wp:group -->
+			</article>
+			<!-- /wp:group -->
+		<!-- /wp:post-template -->
+
+		<!-- wp:query-no-results -->
+			<!-- wp:paragraph -->
+			<p>No results found.</p>
+			<!-- /wp:paragraph -->
+		<!-- /wp:query-no-results -->
+
+		<!-- wp:query-pagination {"layout":{"type":"flex","justifyContent":"center"}} -->
+			<!-- wp:query-pagination-previous /-->
+
+			<!-- wp:query-pagination-numbers /-->
+
+			<!-- wp:query-pagination-next /-->
+		<!-- /wp:query-pagination -->
+	</div>
+	<!-- /wp:query -->
+</main>
+<!-- /wp:group -->
+
+<!-- wp:template-part {"slug":"trust-bar","tagName":"div"} /-->
+
+<!-- wp:template-part {"slug":"footer","tagName":"footer"} /-->