37 lines
1.9 KiB
Plaintext
37 lines
1.9 KiB
Plaintext
---
|
|
import Base from '../layouts/Base.astro';
|
|
---
|
|
<Base title="CTAO Science Portal - Search" description="Search CTAO news and announcements">
|
|
{/* Utility archetype: ONE surface per page — Moon canvas from the landing
|
|
head down (borderless cards/panels pop against it); editorial pages stay
|
|
all-white. No mid-page surface seams (DESIGN.md). */}
|
|
<section class="band--moon">
|
|
<header class="container page-head">
|
|
<h1>Search</h1>
|
|
<p class="standfirst">Find news and announcements.</p>
|
|
</header>
|
|
<div class="container page">
|
|
<form class="search-form" role="search" action="/search" method="get">
|
|
<label class="sr-only" for="q">Search news</label>
|
|
<svg class="ico search-ico" aria-hidden="true" viewBox="0 0 24 24"><circle cx="11" cy="11" r="7" /><path d="m20 20-4.3-4.3" /></svg>
|
|
<input id="q" name="q" type="search" placeholder="e.g. LST camera, Council, data…" autocomplete="off" />
|
|
<button class="btn" type="submit">Search</button>
|
|
</form>
|
|
<p class="notice" id="search-status" role="status" aria-live="polite">Type to search the news archive.</p>
|
|
<ol class="search-results" id="search-results"></ol>
|
|
<noscript><p class="notice">Search requires JavaScript. Browse all news on the <a href="/news">news page</a>.</p></noscript>
|
|
</div>
|
|
</section>
|
|
</Base>
|
|
|
|
{/* search-client.js is loaded once (deferred) by the Base layout; this inline
|
|
module runs after it in the shared after-parse queue — order guaranteed. */}
|
|
<script is:inline type="module">
|
|
const run = newsSearch({ input: 'q', list: 'search-results', status: 'search-status', limit: 20, hint: 'Type at least 2 characters.' });
|
|
// Support /search?q=… deep links (hero search form, footer, bookmarks)
|
|
const q0 = new URLSearchParams(location.search).get('q');
|
|
const q = document.getElementById('q');
|
|
if (q0) { q.value = q0; run(); }
|
|
q.focus();
|
|
</script>
|