made navigation to macro

- close #39 Signed-off-by: zischler <[email protected]>
zischler · Feb 8, 2021 · 12efc7b · 12efc7b
1 parent 62c4401
commit 12efc7b
Show file tree

Hide file tree

Showing 4 changed files with 37 additions and 23 deletions.
diff --git a/craft/templates/_includes/footer.twig b/craft/templates/_includes/footer.twig
@@ -4,7 +4,8 @@
 			<div>
 				<span class="h2">Navigation</span>
 				<div class="mt-2 flex is-left">
-					{% include "_includes/navigation.twig" %}
+					{% import "_macros/navigation.twig" as navigationMacros %}
+					{{ navigationMacros.navigation(entry) }}
 				</div>
 			</div>
 			<div>

diff --git a/craft/templates/_includes/header.twig b/craft/templates/_includes/header.twig
@@ -1,4 +1,5 @@
 {% set isHomeClass = entry.type == "homepage" ? "is-home" : "" %}
+{% import "_macros/navigation.twig" as navigationMacros %}
 
 <header id="page-header" class="fixed sm:relative visible left-0 top-0 w-full h-20 md:h-auto z-50 transition-all text-white {{ isHomeClass }}" :class="{'js-open': isMenuOpen, 'opacity-0 invisible': isHomeNavigationHover}">
     <div class="fixed sm:relative w-full px-4 z-40" :class="{'bg-white': isMenuOpen, 'bg-gray-900': !isMenuOpen}">
@@ -13,7 +14,7 @@
                         </a>
                     </div>
                     <nav class="header-navigation hidden md:inline-block ml-8">
-                        {% include "_includes/navigation.twig" %}
+                        {{ navigationMacros.navigation(entry) }}
                     </nav>
                 </div>
                 <div class="flex-1of2 block md:hidden is-right transition-colors" v-bind:class="{'text-black': isMenuOpen}">
@@ -36,7 +37,7 @@
                     <div class="o-group">
                         <div class="relative">
                             <nav class="flyout-navigation" v-bind:class="{'js-open': isMenuOpen}">
-                                {% include "_includes/navigation.twig" %}
+                                {{ navigationMacros.navigation(entry) }}
                             </nav>
                         </div>
                     </div>

diff --git a/craft/templates/_includes/navigation.twig b/craft/templates/_includes/navigation.twig
diff --git a/craft/templates/_macros/navigation.twig b/craft/templates/_macros/navigation.twig
@@ -0,0 +1,32 @@
+{% macro navigation(entry) %}
+    {% set homepage = craft.entries.section('homepage').one() %}
+    <ul>
+    {# Homepage link #}
+    <li>
+        <a class="leading-normal {% if entry.id == homepage.id %}text-red-400{% endif %}" href="{{ homepage.url }}">
+            {{ homepage.title }}
+        </a>
+    </li>
+
+    {# Navigation Pages #}
+    {% set navPages = craft.entries.section('page').level(1).all() %}
+    {% set slugs = craft.app.request.segments %}
+    {% nav navPage in navPages %}
+        {% if not navPage.hideInNavigation.contains('hide') %}
+            <li class="relative">
+            <a class="leading-normal inline {% if navPage.slug in slugs %}text-red-400{% endif %}" href="{{ navPage.url }}">
+                {{ navPage.title }}
+            </a>
+            </li>
+        {% endif %}
+    {% endnav %}
+
+    {# Contact link #}
+    {% set contact = craft.entries.section('contact').one() %}
+    <li>
+        <a class="leading-normal {% if entry.id == contact.id %}text-red-400{% endif %}" href="{{ contact.url }}">
+            {{ contact.title }}
+        </a>
+    </li>
+</ul>
+{% endmacro %}