From 3cf92266ec5954cd3f471bf82124e66bee2f1710 Mon Sep 17 00:00:00 2001
From: Tony M <pgx7aiqs@anonaddy.me>
Date: Fri, 3 Jul 2026 22:05:24 -0700
Subject: [PATCH] header nav styling

---
 components/header.html | 28 +++++++++++++++-------------
 1 file changed, 15 insertions(+), 13 deletions(-)

diff --git a/components/header.html b/components/header.html
index 2282e53..c804f20 100644
--- a/components/header.html
+++ b/components/header.html
@@ -1,6 +1,6 @@
 <script src="./js/navbar.js"></script>
-<div class="nav-bar">
-  <div class="mobile-menu-icon">
+<div class="nav">
+  <div class="nav__toggle">
     <a href="javascript:void(0);" class="icon" onclick="myFunction()">
       <img
         src="https://cdn.lasthourhosting.org/assets/list.png"
@@ -14,36 +14,38 @@
     <a href="/">
       <img
         src="https://cdn.lasthourhosting.org/assets/shiloh-logo-white-1-outline.png"
-        alt="Last Hour Hosting Logo"
+        alt="Shiloh Echo logo"
         width="200"
       />
     </a>
   </div>
-  <ul class="menu">
-    <li class="menu-item">
+  <ul class="nav__menu">
+    <li class="nav__item">
       <a
+        class="btn btn--primary nav__cta"
         href="https://app.hi.events/event/6507/3-day-christian-family-event-concert-in-idaho-shiloh-echo-26"
         >Get Tickets</a
       >
     </li>
-    <li class="menu-item"><a href="#details">Explore</a></li>
-    <li class="menu-item"><a href="#schedule">Schedule</a></li>
-    <li class="menu-item">
+    <li class="nav__item"><a href="#details">Explore</a></li>
+    <li class="nav__item"><a href="#giveaway">Giveaway</a></li>
+    <li class="nav__item"><a href="#schedule">Schedule</a></li>
+    <li class="nav__item">
       <a href="mailto:affiliate@shilohecho.org">Affiliate</a>
     </li>
-    <li class="menu-item">
+    <li class="nav__item">
       <a target="_blank" href="https://shilohecho.org/sponsor">Sponsor</a>
     </li>
-    <li class="menu-item">
+    <li class="nav__item">
       <a
         target="_blank"
         href="https://www.youtube.com/watch?v=F16BYV9Qit0&list=PLXN3WrUCfopRxb4okwJ8e6gOasxR1i6qB"
         >Last Year</a
       >
     </li>
-    <li class="menu-item">
-      <a href="#volunteer">Volunteer</a>
+    <li class="nav__item">
+      <a href="/volunteer">Volunteer</a>
     </li>
-    <li class="menu-item"><a href="#contact">Contact</a></li>
+    <li class="nav__item"><a href="#contact">Contact</a></li>
   </ul>
 </div>