Add nav-bar to each tutorial page (next, previous)

Signed-off-by: Juraj Oravec <jurajoravec@mailo.com>

assets/scss/dark.scss

@@ -93,7 +93,7 @@ th {
 	color: map-get($theme-colors, "main-sec");
 }
 
-.copyright, {
+.copyright {
 	color: map-get($theme-colors, "copyright");
 }
 
@@ -104,10 +104,23 @@ th {
 	background: #181818;
 }
 
+.post-preview .meta {
+	border-bottom: 1px solid #303030;
+}
+
 .post-preview .title a {
 	color: map-get($theme-colors, "main-sec");
 }
 
+.post-footer-data {
+	background-color: #0a0a0a;
+	border-bottom: 1px solid #303030;
+}
+
+.post-footer hr {
+	color: #303030;
+}
+
 .rmore {
 	color: map-get($theme-colors, "main-text");
 }
@@ -133,10 +146,6 @@ th {
 	 color: map-get($theme-colors, "main-sec");
 }
 
-table.stats td.graph div {
-	background-color: map-get($theme-colors, "main-sec");
-}
-
 .content-list .archive-list a:hover {
 	 filter: brightness(1.2);
 }

layouts/_default/list.html

@@ -7,7 +7,7 @@
 <div class="content-list">
 
 <ul class="archive-list">
-{{ range sort .Data.Pages ".Params.number" }}
+{{ range (.Pages.ByParam "number") }}
   <li>
     <a href="{{ .Permalink }}">{{ .Title }}</a>
   </li>

layouts/_default/single.html

@@ -3,6 +3,23 @@
 <article class="post">
     <h1 class="title"> {{ .Title }} </h1>
     <div class="content"> {{ .Content }} </div>
+
+    <footer class="post-footer">
+    <div class="post-footer-data">
+    <div class="nav-bar">
+
+    {{ $pages := where site.RegularPages "Section" .Section }}
+    {{ with ($pages.ByParam "number").Reverse.Prev . }}
+        <a class="link-previous" title="{{ .Title }}" href="{{ .Permalink }}">&lt;&lt; Previous</a>
+    {{ end }}
+
+    {{ with ($pages.ByParam "number").Reverse.Next . }}
+        <a class="link-next" title="{{ .Title }}" href="{{ .Permalink }}">Next &gt;&gt;</a>
+    {{ end }}
+
+    </div>
+    </div>
+    </footer>
 </article>
 
 {{ partial "footer.html" . }}

static/css/layout.css

@@ -192,6 +192,38 @@ th, td {
 .post .content p{
 }
 
+.post-footer-data {
+	padding: 1em;
+}
+
+.post-footer hr {
+	width: 100%;
+}
+
+.post-footer .nav-bar {
+	display: table;
+	width: 100%;
+}
+
+.post-footer .nav-bar .link-next {
+	text-align: right;
+	display: table-cell;
+    float: none;
+	width: 50%;
+}
+
+.post-footer .nav-bar .link-previous {
+	text-align: left;
+	display: table-cell;
+    float: none;
+	width: 50;
+}
+
+.post-footer-menu {
+	justify-content: space-between;
+	font-size: 0.8em;
+	margin: 0.5em 4em;
+}
 
 .post-prev a {
 	text-decoration: none;