ctao/portal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: portal IA per spec (home entry point, /news, /proposals+redirect, /support), live search + suggestions, article TOC, mobile disclosure menu, CMS preview styles, modernization pass 1

Browse Source
This commit is contained in:
ctao
2026-07-24 23:00:07 +02:00
parent 11e7eb484f
commit cf35739a64
17 changed files with 627 additions and 231 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/layouts/Base.astro
+27 -8
View File
@@ -6,9 +6,11 @@ const isActive = (href) => (href === '/' ? path === '/' : path.startsWith(href))
// Navigation = services from the Science Portal spec (REQUIREMENTS.md §2/§5).
// External systems built by other teams are links out, clearly marked.
const links = [
{ href: '/', label: 'News' },
{ href: '/telescopes', label: 'Proposals' },
{ href: '/news', label: 'News' },
{ href: '/proposals', label: 'Proposals' },
{ href: '/dashboard', label: 'Dashboard' },
{ href: 'https://padc-ctao-data-explorer.obspm.fr/', label: 'Data', ext: true },
{ href: '/support', label: 'Support' },
];
---
<!doctype html>
@@ -18,6 +20,7 @@ const links = [
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>{title}</title>
<meta name="description" content={description} />
<link rel="icon" href="/brand/CTAO_Logo_positive.svg" type="image/svg+xml" />
{/* Brand typography (BRAND D.3): Inter (body) + Space Grotesk (headlines).
Google Fonts for the demo; self-host woff2 for production. */}
<link rel="preconnect" href="https://fonts.googleapis.com" />
@@ -32,15 +35,30 @@ const links = [
<img src="/brand/AAFF_CTAO_Logo_RGB_Monochrome-negative.svg" alt="CTAO" />
<span class="brand-sub">Science&nbsp;Portal</span>
</a>
<span class="spacer"></span>
<nav aria-label="Main navigation">
{links.map((l) => (
{links.map((l) => l.ext ? (
<a class="navlink external" href={l.href} target="_blank" rel="noopener">{l.label}</a>
) : (
<a class="navlink" href={l.href} aria-current={isActive(l.href) ? 'page' : undefined}>{l.label}</a>
))}
<a class="navlink external" href="https://padc-ctao-data-explorer.obspm.fr/" target="_blank" rel="noopener">Data</a>
</nav>
<a class="navlink navlink--edit" href="/admin">✎ Editor</a>
<button class="login-mock" type="button" disabled title="Mock — CTAO AAI sign-in will be integrated here">Sign in</button>
<span class="spacer"></span>
<a class="navlink" href="/search">Search</a>
<a class="navlink navlink--edit" href="/admin" title="Content editor (demo CMS)">✎ Editor</a>
<a class="login-mock" href="/login">Sign in</a>
{/* Mobile disclosure menu — native <details>/<summary>, no JS; desktop hides it via CSS */}
<details class="menu">
<summary><span class="menu-icon" aria-hidden="true"></span>Menu</summary>
<nav aria-label="Main navigation">
{links.map((l) => l.ext ? (
<a class="external" href={l.href} target="_blank" rel="noopener">{l.label}</a>
) : (
<a href={l.href} aria-current={isActive(l.href) ? 'page' : undefined}>{l.label}</a>
))}
<a href="/search">Search</a>
<a href="/admin">✎ Editor</a>
</nav>
</details>
</div>
</header>
<main id="main">
@@ -50,11 +68,12 @@ const links = [
{/* Bottom menu required by SPEC §3.3.1: disclaimers, privacy, contact, settings, search.
Placeholder links = <a> without href (valid HTML placeholder-link semantics). */}
<div class="container inner">
<span class="flash" aria-hidden="true"></span>
<a>Disclaimer</a>
<a>Privacy</a>
<a>Contact</a>
<a>Site settings</a>
<a>Search</a>
<a href="/search">Search</a>
<span class="note">Science Portal Core demo (Cyfronet / SUSS-PORT team). Sample content
imported from ctao.org; footer links are placeholders. Statically generated from
Markdown (git-based CMS).</span>