From b2e465abc47baa1ead1c612f0ba30ab99658adeb Mon Sep 17 00:00:00 2001
From: Lyn Fugmann <lyn.fugmann@ifsr.de>
Date: Tue, 24 Sep 2024 16:28:54 +0200
Subject: [PATCH 1/2] refactor main nav

---
 _includes/header.css | 8 ++++----
 _includes/header.njk | 5 +++--
 2 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/_includes/header.css b/_includes/header.css
index 12c4968..66d6183 100644
--- a/_includes/header.css
+++ b/_includes/header.css
@@ -30,7 +30,7 @@ header {
   margin-left: 1.9rem;
 }
 
-#mainNav a {
+.nav-item {
   position: relative;
   font-size: 16px;
   font-family: Aileron;
@@ -41,7 +41,7 @@ header {
   text-decoration: none;
 }
 
-#mainNav a::after {
+.nav-item::after {
   content: "";
   position: absolute;
   background: var(--color-primary);
@@ -53,7 +53,7 @@ header {
   transition: opacity .3s ease-out;
 }
 
-#mainNav a:hover::after,
-#mainNav .nav-active a::after {
+.nav-item:hover::after,
+.nav-item.active::after {
   opacity: 1;
 }
diff --git a/_includes/header.njk b/_includes/header.njk
index 0ac30f6..6c8f114 100644
--- a/_includes/header.njk
+++ b/_includes/header.njk
@@ -7,8 +7,9 @@
       {% 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>
+          <a class="nav-item {%- if entry.url == page.url %} active{% endif %}"
+            href="{{ entry.url }}">{{ entry.title }}</a>
         </li>
         {%- endfor %}
       </ul>

From 8153caea035469cd7fe2786b3baed6be7cc680f9 Mon Sep 17 00:00:00 2001
From: Lyn Fugmann <lyn.fugmann@ifsr.de>
Date: Tue, 24 Sep 2024 16:33:50 +0200
Subject: [PATCH 2/2] add stream button

---
 _includes/header.css | 19 +++++++++++++++++++
 _includes/header.njk |  3 +++
 _includes/page.css   |  1 +
 3 files changed, 23 insertions(+)

diff --git a/_includes/header.css b/_includes/header.css
index 66d6183..dc90719 100644
--- a/_includes/header.css
+++ b/_includes/header.css
@@ -57,3 +57,22 @@ header {
 .nav-item.active::after {
   opacity: 1;
 }
+
+.nav-item-stream {
+  padding: .75rem 1.4rem;
+  border: 2px solid var(--color-primary);
+  border-radius: 3rem;
+  color: var(--color-primary);
+  font-family: Aileron;
+  font-weight: 500;
+  letter-spacing: 2px;
+  text-decoration: none;
+  text-transform: uppercase;
+  transition: .2s ease-out;
+  transition-property: color, background-color;
+}
+
+.nav-item-stream:hover {
+  color: var(--color-livestream-active);
+  background-color: var(--color-primary);
+}
diff --git a/_includes/header.njk b/_includes/header.njk
index 6c8f114..9dbfffa 100644
--- a/_includes/header.njk
+++ b/_includes/header.njk
@@ -12,6 +12,9 @@
             href="{{ entry.url }}">{{ entry.title }}</a>
         </li>
         {%- endfor %}
+        <li>
+          <a class="nav-item-stream" href="https://stream.ifsr.de/" target="_blank" rel="noopener">Stream</a>
+        </li>
       </ul>
     </nav>
   </div>
diff --git a/_includes/page.css b/_includes/page.css
index 223334f..796efd3 100644
--- a/_includes/page.css
+++ b/_includes/page.css
@@ -66,5 +66,6 @@ p {
   --page-width: 1280px;
   --color-text: #495057;
   --color-primary: {{ eseColor }};
+  --color-livestream-active: #fff;
 }