using astro

src/components/SiteFooter.astro

@@ -0,0 +1,18 @@
+<footer id="footer" role="contentinfo">
+  <div id="colophon"></div>
+
+  <div id="footer2">
+    <div id="footer2-inner">
+      <div id="site-copyright">
+        <b>Family Federation for World Peace and Unification (FFWPU) Ireland</b>
+        <br />
+        Charity no. CHY 6071 All Rights Reserved 2013
+        <br />
+        <a href="/speeches/" target="_blank">Speeches</a>
+      </div>
+      <div style="text-align:center;padding:5px 0 2px;text-transform:uppercase;font-size:12px;margin:1em auto 0;">
+        Family Federation for World Peace and Unification Ireland
+      </div>
+    </div>
+  </div>
+</footer>

src/components/SiteNav.astro

@@ -0,0 +1,70 @@
+---
+const { pathname = "/" } = Astro.props;
+
+const navItems = [
+  { href: "/index.html", label: "Home", match: ["/index.html", "/"] },
+  {
+    href: "/about.html",
+    label: "About Us",
+    match: ["/about.html", "/the-founders.html", "/about-us-organizations.html"],
+    children: [
+      { href: "/the-founders.html", label: "The Founders" },
+      { href: "/about-us-organizations.html", label: "Organizations" },
+    ],
+  },
+  { href: "/videos.html", label: "Videos", match: ["/videos.html"] },
+  {
+    href: "/events.html",
+    label: "Events",
+    match: ["/events.html", "/services.html"],
+    children: [{ href: "/services.html", label: "Sunday Services" }],
+  },
+  { href: "/speeches/", label: "Speeches", match: ["/speeches/"] },
+  { href: "/contact.html", label: "Contact", match: ["/contact.html"] },
+];
+
+function isCurrent(item) {
+  return item.match.some((match) => {
+    if (match === "/") {
+      return pathname === "/";
+    }
+    if (match.endsWith("/")) {
+      return pathname.startsWith(match);
+    }
+    return pathname === match;
+  });
+}
+---
+
+<nav id="access" class="jssafe" role="navigation">
+  <div class="skip-link screen-reader-text"><a href="#content" title="Skip to content">Skip to content</a></div>
+  <div class="menu">
+    <ul id="prime_nav" class="menu">
+      {
+        navItems.map((item, index) => {
+          const current = isCurrent(item);
+          return (
+            <li class:list={["menu-item", item.children && "menu-item-has-children", current && "current-menu-item current_page_item", `menu-item-${index + 1}`]}>
+              <a href={item.href} aria-current={current ? "page" : undefined}>
+                <span>{item.label}</span>
+              </a>
+              {
+                item.children && (
+                  <ul class="sub-menu">
+                    {item.children.map((child, childIndex) => (
+                      <li class={`menu-item menu-item-${index + 1}-${childIndex + 1}`}>
+                        <a href={child.href}>
+                          <span>{child.label}</span>
+                        </a>
+                      </li>
+                    ))}
+                  </ul>
+                )
+              }
+            </li>
+          );
+        })
+      }
+    </ul>
+  </div>
+</nav>

src/components/SiteSidebar.astro

@@ -0,0 +1,26 @@
+---
+const sidebarItems = [
+  { href: "/the-founders.html", label: "The Founders" },
+  { href: "/services.html", label: "Sunday Services" },
+  { href: "/contact.html", label: "Contact" },
+  { href: "/speeches/", label: "Speeches" },
+];
+---
+
+<div id="secondary" class="widget-area sidey" role="complementary">
+  <ul class="xoxo">
+    <li id="nav_menu-2" class="widget-container widget_nav_menu">
+      <div class="menu-menu-3-side-bar-menu-container">
+        <ul id="menu-menu-3-side-bar-menu" class="menu">
+          {
+            sidebarItems.map((item, index) => (
+              <li class={`menu-item menu-item-${index + 1}`}>
+                <a href={item.href}>{item.label}</a>
+              </li>
+            ))
+          }
+        </ul>
+      </div>
+    </li>
+  </ul>
+</div>