navigation.html in jmblog-theme-1.0

- old
+ new
@@ -1,7 +1,66 @@
-<nav>
-    {% for item in site.data.navigation.items %}
-    <a href="{{ site.baseurl }}{{ item.link }}" {% if page.url == item.link %}style="color: red;" {% endif %}>
-        {{ item.name }}
-    </a>
-    {% endfor %}
-</nav>
+<!-- Navigation bar -->
+  <nav class="navbar" role="navigation" aria-label="main navigation">
+    <div class="navbar-brand">
+      <a role="button" class="navbar-burger burger is-fixed-top" aria-label="menu" aria-expanded="false" data-target="navbar-menu">
+        <span aria-hidden="true"></span>
+        <span aria-hidden="true"></span>
+        <span aria-hidden="true"></span>
+      </a>
+    </div>
+
+    <div id="navbar-menu" class="navbar-menu">
+      <div class="navbar-start">
+
+        {% for item in site.data.navigation.items %}
+        {% assign ln = item.link %}
+        <a class="navbar-item{% if page.url == item.link %} is-active{% endif %}" 
+          href="{{ item.link }}">
+          {{ item.name }}
+        </a>
+        {% endfor %}
+        
+        {% comment %} 
+        <div class="navbar-item has-dropdown is-hoverable">
+          <a class="navbar-link">
+            Acticles
+          </a>
+
+          <div class="navbar-dropdown">
+            <a class="navbar-item">
+              Fintech
+            </a>
+            <a class="navbar-item">
+              Travel
+            </a>
+            <a class="navbar-item">
+              Contact
+            </a>
+            <hr class="navbar-divider">
+            <a class="navbar-item">
+              Miscealaneous
+            </a>
+          </div>
+        </div>
+        {% endcomment %}
+
+        <div class="navbar-item sharing-utility">
+            {% include themes/jmblog-theme/components/social_buttons_small.html %}
+        </div>
+      </div>
+
+      <div class="navbar-end">
+        {% comment %}
+        <div class="navbar-item">
+          <div class="buttons">
+            <a class="button is-primary">
+              <strong>Sign up</strong>
+            </a>
+            <a class="button is-light">
+              Log in
+            </a>
+          </div>
+        </div>
+        {% endcomment %}
+      </div>
+    </div>
+  </nav>
\ No newline at end of file