Files
egfh-website/src/layouts/BaseLayout.astro
T
2026-05-20 11:28:23 -04:00

101 lines
3.1 KiB
Plaintext

---
import { homepageHighlights, site } from '../lib/site';
import '../styles/global.css';
type Props = {
title?: string;
description?: string;
};
const { title, description = 'A fast, static, operational website for Swansea Airport.' } = Astro.props as Props;
const pageTitle = title ? `${title} · ${site.name}` : site.name;
---
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="description" content={description} />
<title>{pageTitle}</title>
</head>
<body>
<header class="topbar">
<div class="container topbar-inner">
<a class="brand brand-mobile" href="/"><img src="/images/logo-text.webp" alt="Swansea Airport" /></a>
<details class="mobile-nav">
<summary></summary>
<div class="mobile-nav-panel">
{site.navigation.map((item) => (
item.children ? (
<details class="mobile-subnav">
<summary>{item.label}</summary>
<div class="mobile-subnav-panel">
<a href={item.href}>Overview</a>
{item.children.map((child) => (
<a href={child.href}>{child.label}</a>
))}
</div>
</details>
) : (
<a href={item.href}>{item.label}</a>
)
))}
</div>
</details>
</div>
</header>
<nav class="navshell" aria-label="Primary">
<div class="container nav-inner">
<a class="brand" href="/"><img src="/images/logo-text.webp" alt="Swansea Airport" /></a>
<div class="nav-links">
{site.navigation.map((item) => (
item.children ? (
<div class="nav-item nav-dropdown">
<a href={item.href}>{item.label}</a>
<div class="nav-dropdown-menu">
{item.children.map((child) => (
<a href={child.href}>{child.label}</a>
))}
</div>
</div>
) : (
<a href={item.href}>{item.label}</a>
)
))}
</div>
</div>
</nav>
<main>
<slot />
</main>
<footer class="site-footer">
<div class="container footer-grid">
<section>
<img class="footer-logo" src="/images/swansea.webp" alt="Swansea Airport logo" loading="lazy" />
<p class="eyebrow">Airport essentials</p>
<p>{site.address}</p>
<p>{site.licensedHours}</p>
</section>
<section>
<p class="eyebrow">Operational highlights</p>
<ul class="compact-list">
{homepageHighlights.map((item) => (
<li>{item.title}</li>
))}
</ul>
</section>
<section>
<p class="eyebrow">Quick contact</p>
<p><a href={`tel:${site.phone.replace(/\s+/g, '')}`}>{site.phone}</a></p>
<p><a href={`mailto:info@swansea-airport.wales`}>info@swansea-airport.wales</a></p>
</section>
</div>
</footer>
</body>
</html>