From bb083c503e876225415a58e1be13641909c548de Mon Sep 17 00:00:00 2001
From: Lyn Fugmann <lyn.fugmann@ifsr.de>
Date: Tue, 24 Sep 2024 15:39:40 +0200
Subject: [PATCH] highlight current page in main nav

---
 _includes/header.css | 3 ++-
 _includes/header.njk | 9 ++++++++-
 2 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/_includes/header.css b/_includes/header.css
index 4a4cf13..12c4968 100644
--- a/_includes/header.css
+++ b/_includes/header.css
@@ -53,6 +53,7 @@ header {
   transition: opacity .3s ease-out;
 }
 
-#mainNav a:hover::after {
+#mainNav a:hover::after,
+#mainNav .nav-active a::after {
   opacity: 1;
 }
diff --git a/_includes/header.njk b/_includes/header.njk
index e8c2354..0ac30f6 100644
--- a/_includes/header.njk
+++ b/_includes/header.njk
@@ -4,7 +4,14 @@
       <img alt="ESE {{year}} Logo" src="/static/ESELogo24.svg">
     </a>
     <nav id="mainNav">
-      {{ collections.mainNav | pageLang | eleventyNavigation | eleventyNavigationToHtml | safe }}
+      {% set navPages = collections.mainNav | pageLang | eleventyNavigation %}
+      <ul>
+        {%- for entry in navPages -%}
+        <li{% if entry.url == page.url %} class="nav-active"{% endif %}>
+          <a href="{{ entry.url }}">{{ entry.title }}</a>
+        </li>
+        {%- endfor %}
+      </ul>
     </nav>
   </div>
 </header>