ghost navigation feature

author.hbs

@@ -7,7 +7,7 @@
         <a href="{{@blog.url}}" class="header-back-btn js-bg-check left">
             <i class="fa fa-chevron-left"></i> Home
         </a>
-        <i class="fa fa-bars js-bg-check js-main-menu-open right"></i>
+        {{> "menu-activator-icon"}}
     </nav>
     <header class="main-header js-blog-bg-image {{#if cover}}" style="background-image: url({{cover}}){{else}}no-cover{{/if}}">
         <div class="main-header-content">

default.hbs

@@ -44,18 +44,9 @@
     <div class="bborder"></div>
     <div class="lborder"></div>
 
-    <div class="main-menu-ovrl main-menu-ovrl-hugeinc js-main-menu-ovrl">
+    {{#if @blog.navigation}}
-        <i class="fa fa-times main-menu-ovrl-close js-main-menu-close"></i>
+        {{navigation}}
-        <nav>
+    {{/if}}
-            <ul>
-                <li><a href="{{@blog.url}}">Home</a></li>
-                <li><a href="/about">About</a></li>
-                <li><a href="/work">Work</a></li>
-                <li><a href="/clients">Clients</a></li>
-                <li><a href="/contact">Contact</a></li>
-            </ul>
-        </nav>
-    </div>
 
     {{! Ghost outputs important scripts and data with this tag }}
     {{ghost_foot}}

index.hbs

@@ -3,8 +3,9 @@
 
 {{! The big featured header }}
 <nav class="main-nav">
-    <i class="fa fa-bars js-bg-check js-main-menu-open right"></i>
+    {{> "menu-activator-icon"}}
 </nav>
+
 <header class="main-header js-blog-bg-image {{#if @blog.cover}}" style="background-image: url({{@blog.cover}}){{else}}no-cover{{/if}}">
     <div class="main-header-content">
         {{#if @blog.logo}}
@@ -19,11 +20,9 @@
 
 {{! The main content area on the homepage }}
 <main id="content" class="content home-template" role="main">
-
     {{! The tag below includes the post loop - partials/loop.hbs }}
     {{> "loop"}}
-
 </main>
 
-{{!-- GitHub badge --}}
+{{!-- GitHub badge (remove it) --}}
 <a href="https://github.com/juliancwirko/abc"><img style="position: absolute; top: 0; left: 0; border: 0;" src="https://camo.githubusercontent.com/567c3a48d796e2fc06ea80409cc9dd82bf714434/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f6c6566745f6461726b626c75655f3132313632312e706e67" alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_left_darkblue_121621.png"></a>

page.hbs

@@ -7,7 +7,7 @@
     <a href="{{@blog.url}}" class="header-back-btn js-bg-check left">
         <i class="fa fa-chevron-left"></i> Home
     </a>
-    <i class="fa fa-bars js-bg-check js-main-menu-open right"></i>
+    {{> "menu-activator-icon"}}
 </nav>
 <header class="post-view-header js-blog-bg-image {{#if image}}" style="background-image: url({{image}}){{else}}no-cover{{/if}}">
     <div class="post-header-content">

partials/menu-activator-icon.hbs

@@ -0,0 +1,3 @@
+{{#if @blog.navigation}}
+    <i class="fa fa-bars js-bg-check js-main-menu-open right"></i>
+{{/if}}

partials/navigation.hbs

@@ -0,0 +1,12 @@
+<div class="main-menu-ovrl main-menu-ovrl-hugeinc js-main-menu-ovrl">
+    <i class="fa fa-times main-menu-ovrl-close js-main-menu-close"></i>
+    <nav>
+        <ul>
+            {{#foreach navigation}}
+                <li>
+                    <a href="{{url absolute="true"}}">{{label}}</a>
+                </li>
+            {{/foreach}}
+        </ul>
+    </nav>
+</div>

post.hbs

@@ -10,7 +10,7 @@
     <a href="{{@blog.url}}" class="header-back-btn js-bg-check left">
         <i class="fa fa-chevron-left"></i> Home
     </a>
-    <i class="fa fa-bars js-bg-check js-main-menu-open right"></i>
+    {{> "menu-activator-icon"}}
 </nav>
 <header class="post-view-header js-blog-bg-image {{#if image}}" style="background-image: url({{image}}){{else}}no-cover{{/if}}">
     <div class="post-header-content">

tag.hbs

@@ -6,7 +6,7 @@
     <a href="{{@blog.url}}" class="header-back-btn js-bg-check left">
         <i class="fa fa-chevron-left"></i> Home
     </a>
-    <i class="fa fa-bars js-bg-check js-main-menu-open right"></i>
+    {{> "menu-activator-icon"}}
 </nav>
 <header class="main-header js-blog-bg-image {{#if tag.image}}" style="background-image: url({{tag.image}}){{else}}no-cover{{/if}}">
     <div class="main-header-content">