add about page

This commit is contained in:
2025-12-29 09:10:28 -08:00
parent 21bd584e8b
commit 2be98a3284
2 changed files with 53 additions and 3 deletions

46
about/index.html Normal file
View File

@ -0,0 +1,46 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>About | the historic Beall Greenhouses</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="utf-8">
<!-- Meta -->
<link rel="icon" type="image/x-icon" href="/favicon.ico">
<link rel="canonical" href="/about/" />
<meta name="description" content="About | the historic Beall Greenhouses" />
<meta name="robots" content="index,follow" />
<meta property="og:title" content="About | the historic Beall Greenhouses" />
<meta property="og:type" content="article" />
<meta property="og:url" content="/about/" />
<meta property="og:description" content="About | the historic Beall Greenhouses" />
<meta property="og:image" content="/img/logo-light.png" />
<meta property="og:image:alt" content="Linework icon depicting a sunrise or sunset with two clouds, in a blue and orange color scheme" />
<!-- JS -->
<script src="/scripts/nav.js" defer></script>
<!-- CSS -->
<link rel="stylesheet" href="/styles/main.css">
<link rel="stylesheet" href="/styles/nav.css">
</head>
<body>
<div id="content">
<header>
<nav id="top-nav"><!-- auto-populated by nav.js --></nav>
<img id="logo-dark" src="/img/logo-dark.png" alt="Linework icon depicting a sunrise or sunset with two clouds, in a blue and orange color scheme">
<img id="logo-light" src="/img/logo-light.png" alt="Linework icon depicting a sunrise or sunset with two clouds, in a blue and orange color scheme">
</header>
<main>
<h1>About the Beall Greenhouses</h1>
<h2>Past</h2>
<h2>Present</h2>
<h2>Future</h2>
</main>
</div>
<footer id="footer"><!-- auto-populated by nav.js --></footer>
</body>
</html>

View File

@ -2,11 +2,15 @@
const navItems = [ const navItems = [
{ {
href: "/", href: "/",
name: "↩ back home" title: "↩ back home"
},
{
href: "/about/",
title: "ⓘ about"
}, },
{ {
href: "/events/", href: "/events/",
name: "📅 all events" title: "🗓 events"
} }
]; ];
@ -17,7 +21,7 @@ const populateNav = function() {
for (const item of navItems) { for (const item of navItems) {
let a = document.createElement("a"); let a = document.createElement("a");
a.href = item.href; a.href = item.href;
a.innerHTML = item.name; a.innerHTML = item.title;
if (item.href === path) a.id = "current-page"; if (item.href === path) a.id = "current-page";