Improve doc 'previous-next' view

Signed-off-by: trivernis <trivernis@protonmail.com>

_docs/10_installation.md

@@ -1,7 +1,7 @@
 ---
 layout: doc
 title: Installation
-sort_key: 10
+sort_index: 10
 ---
 
 ## Manual installation

_docs/20_repositories.md

@@ -1,7 +1,7 @@
 ---
 layout: doc
 title: Repositories
-sort_key: 20
+sort_index: 20
 ---
 
 When opening mediarepo you will be greeted by an (empty) overview of configured repositories.

_docs/30_adding_files.md

@@ -1,7 +1,7 @@
 ---
 layout: doc
 title: Adding Files
-sort_key: 30
+sort_index: 30
 ---
 
 When opening a repository (by clicking on the *Open* button) you're immediately prompted with

_docs/40_tagging.md

@@ -0,0 +1,7 @@
+---
+layout: doc
+title: Tagging
+sort_index: 40
+draft: true
+---
+

_docs/50_repo_configuration.md

@@ -1,7 +1,7 @@
 ---
 layout: doc
 title: Repository Configuration
-sort_key: 1
+sort_index: 50
 draft: true
 ---
 

_includes/previous-next_docs.html

@@ -0,0 +1,29 @@
+<!-- Use if you want to show previous and next for posts within a category. -->
+{% assign posts = site.docs | sort: "sort_index" %}
+{% for post in posts %}
+  {% if post.sort_index < page.sort_index %}
+    {% assign prev_post = post %}
+  {% endif %}
+  {% if post.sort_index > page.sort_index %}
+    {% assign next_post = post %}
+    {% break %}
+  {% endif %}
+{% endfor %} 
+{% assign user_url = site.url | append: site.baseurl %}
+{% assign full_base_url = user_url | default: site.github.url %}
+{% if prev_post and prev_post.draft == false %}
+<div class="col-4 sm-width-full left mr-lg-4 mt-3">
+  <a class="no-underline border-top-thin py-1 block" href="{{ prev_post.url | prepend: full_base_url }}">
+    <span class="h5 bold text-accent">Previous</span>
+    <p class="bold h3 link-primary mb-1">{{ prev_post.title }}</p>
+  </a>  
+</div>
+{% endif %}
+{% if next_post and next_post.draft == false %}
+<div class="col-4 sm-width-full left mt-3">
+  <a class="no-underline border-top-thin py-1 block" href="{{ next_post.url | prepend: full_base_url }}">
+    <span class="h5 bold text-accent">Next</span>
+    <p class="bold h3 link-primary mb-1">{{ next_post.title }}</p>
+  </a>
+</div>
+{% endif %}

_layouts/doc.html

@@ -15,5 +15,5 @@ layout: default
 </article>
 
 <div class="container mx-auto px-2 py-2 clearfix">
-  {% include previous-next.html %}
+  {% include previous-next_docs.html %}
 </div>