86 lines
4.1 KiB
Plaintext
86 lines
4.1 KiB
Plaintext
---
|
|
import { getCollection } from 'astro:content';
|
|
import Base from '../layouts/Base.astro';
|
|
|
|
const posts = (await getCollection('news', ({ data }) => !data.draft))
|
|
.sort((a, b) => b.data.date.valueOf() - a.data.date.valueOf())
|
|
.slice(0, 3);
|
|
const fmt = (d) => new Intl.DateTimeFormat('en-GB', { dateStyle: 'long' }).format(d);
|
|
const iso = (d) => d.toISOString().slice(0, 10);
|
|
// Services per the Science Portal spec; unbuilt ones are labelled, never faked.
|
|
const services = [
|
|
{ title: 'Proposals', href: '/proposals', desc: 'Submit observation proposals, including ToO / MWL requests.', badge: 'mock' },
|
|
{ title: 'Data Explorer', href: 'https://padc-ctao-data-explorer.obspm.fr/', ext: true, desc: 'Search and download CTAO science data products.', badge: 'ext' },
|
|
{ title: 'Dashboard', href: '/dashboard', desc: 'Your proposals, data products and support tickets in one place.', badge: 'mock' },
|
|
{ title: 'User Support', href: '/support', desc: 'Help desk, FAQ, user forum and mailing lists.', badge: 'mock' },
|
|
{ title: 'Software', desc: 'Science analysis tools and pipelines.', badge: 'tbd' },
|
|
{ title: 'Documentation', desc: 'User guides and technical documentation.', badge: 'tbd' },
|
|
];
|
|
---
|
|
<Base title="CTAO Science Portal" description="News, observation proposals, data and user services of the Cherenkov Telescope Array Observatory" ambient>
|
|
<section class="hero-band">
|
|
<div class="band-bg" aria-hidden="true"></div>
|
|
<div class="container hero">
|
|
<div class="eyebrow">Cherenkov Telescope Array Observatory</div>
|
|
<h1>CTAO Science Portal</h1>
|
|
<p>Exploring the Universe at the Highest Energies</p>
|
|
<form class="hero-search" role="search" action="/search" method="get">
|
|
<label class="sr-only" for="home-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="home-q" name="q" type="search" placeholder="Search news and announcements…" autocomplete="off" />
|
|
<button class="btn" type="submit">Search</button>
|
|
{/* Live suggestions (plain links, Tab-accessible); Enter still submits to /search */}
|
|
<ul class="suggest" id="home-suggest"></ul>
|
|
<p class="sr-only" id="home-suggest-status" role="status" aria-live="polite"></p>
|
|
</form>
|
|
</div>
|
|
</section>
|
|
|
|
<script is:inline src="/search-client.js"></script>
|
|
<script is:inline>
|
|
newsSearch({ input: 'home-q', list: 'home-suggest', status: 'home-suggest-status', limit: 6, unit: 'suggestion(s)' });
|
|
</script>
|
|
|
|
{/* Surface rhythm (DESIGN.md): services on Moon Gray, editorial news on white */}
|
|
<section class="band--moon">
|
|
<div class="container page">
|
|
<div class="section-head"><h2>Services</h2></div>
|
|
<div class="grid">
|
|
{services.map((s) => (
|
|
<article class="card tile">
|
|
<h3>{s.href
|
|
? (s.ext
|
|
? <a class="external" href={s.href} target="_blank" rel="noopener">{s.title}</a>
|
|
: <a href={s.href}>{s.title}</a>)
|
|
: s.title}</h3>
|
|
<p class="desc">{s.desc}</p>
|
|
{s.badge === 'mock' && <span class="badge-mock">Mock</span>}
|
|
{s.badge === 'ext' && <span class="badge-ext">External — LUX team</span>}
|
|
{s.badge === 'tbd' && <span class="badge-ext">Planned (TBD)</span>}
|
|
</article>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="container page">
|
|
<div class="section-head">
|
|
<h2>Latest news</h2>
|
|
<a class="more" href="/news">All news →</a>
|
|
</div>
|
|
<div class="grid">
|
|
{posts.map((post) => (
|
|
<article class="card">
|
|
{post.data.cover && <img class="cover" src={encodeURI(post.data.cover)} alt="" loading="lazy" />}
|
|
<div class="body">
|
|
<span class="cat">{post.data.category}</span>
|
|
<h3><a href={`/news/${post.id}`}>{post.data.title}</a></h3>
|
|
<p class="desc">{post.data.description}</p>
|
|
<div class="meta">{post.data.author} · <time datetime={iso(post.data.date)}>{fmt(post.data.date)}</time></div>
|
|
</div>
|
|
</article>
|
|
))}
|
|
</div>
|
|
</section>
|
|
</Base>
|