add stream button

_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);
+}

_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>

_includes/page.css

@@ -66,5 +66,6 @@ p {
   --page-width: 1280px;
   --color-text: #495057;
   --color-primary: {{ eseColor }};
+  --color-livestream-active: #fff;
 }