Added a blog to the site.

assets/css/style.css

@@ -500,6 +500,19 @@ li {
     margin-left: 1rem;
 }
 
+i {
+    font-family: 'Lato Italic', sans-serif;
+}
+
+hr {
+    color: var(--nearly-black);
+    margin: 0.25rem 0;
+}
+
+hr.-even {
+    color: var(--wtf-light-grey);
+}
+
 .content {
     padding: 1.5rem 0;
     width: 100%;
@@ -508,6 +521,18 @@ li {
     justify-content: center;
 }
 
+.content__blog_link.-odd {
+    color: var(--nearly-black) !important;
+}
+
+.content__blog_link.-even {
+    color: var(--wtf-very-light-blue) !important;
+}
+
+.content__blog_link:hover {
+    color: var(--wtf-mid-grey) !important;
+}
+
 .content__box {
     margin: 0 auto;
     padding: 0;
@@ -529,6 +554,10 @@ li {
     color: var(--wtf-dark-blue);
 }
 
+.pagination__anchor.-even:visited {
+    color: var(--wtf-light-blue);
+}
+
 .content__inner_box.-logo_header {
     margin: 3.5rem 1.5rem 0 1.5rem;
 }
@@ -537,6 +566,19 @@ li {
     margin: -0.5rem 1.5rem 0 1.5rem;
 }
 
+.content__pagination {
+    text-align: center;
+}
+
+
+.content__pagination.-even {
+    color: var(--wtf-light-grey);
+}
+
+.pagination__anchor.-even {
+
+}
+
 .nav__wrapper, .header__wrapper, .content__box, .footer__wrapper {
     width: 100%;
     max-width: 1200px;
@@ -544,6 +586,10 @@ li {
     widows: 2;
 }
 
+.content__box.-heading {
+    margin-bottom: 1.5rem;
+}
+
 .content__box.-columns {
     -webkit-column-count: var(--column-count);
     -moz-column-count: var(--column-count);

content/blog/contents.lr

@@ -0,0 +1,3 @@
+_model: blog
+---
+title: Aktuelles

databags/navigation.json

@@ -17,8 +17,8 @@
   },
   "Aktuelles": {
     "href": "/blog",
-    "visible": false,
+    "visible": true,
-    "list_childs": true,
+    "list_childs": false,
     "items": {}
   },
   "Kontakt": {

models/blog-post.ini

@@ -0,0 +1,23 @@
+[model]
+name = Blog Post
+label = {{ this.title }}
+hidden = yes
+
+[fields.title]
+label = Title
+type = string
+size = large
+
+[fields.author]
+label = Author
+type = string
+width = 1/2
+
+[fields.pub_date]
+label = Publication date
+type = date
+width = 1/2
+
+[fields.body]
+label = Body
+type = markdown

models/blog.ini

@@ -0,0 +1,16 @@
+[model]
+name = Blog
+label = Blog
+hidden = yes
+
+[fields.title]
+label = Title
+type = string
+
+[children]
+model = blog-post
+order_by = -pub_date, title
+
+[pagination]
+enabled = yes
+per_page = 10

templates/blog-post.html

@@ -0,0 +1,10 @@
+{% extends "header_slim.html" %}
+{% from "macros/blog.html" import render_blog_post %}
+<div class="content__box">
+    <div class="content__inner_box">
+        <h1>{{ this.title }}</h1>
+    </div>
+</div>
+{% block body %}
+    {{ render_blog_post(this) }}
+{% endblock %}

templates/blog.html

@@ -0,0 +1,17 @@
+{% extends "header_slim.html" %}
+{% from "macros/blog.html" import render_blog_post %}
+{% from "macros/pagination.html" import render_pagination %}
+
+{% block body %}
+    <div class="content__box">
+        <div class="content__inner_box">
+            <h1>{{ this.title }}</h1>
+        </div>
+    </div>
+    {% for blog_post in this.pagination.items %}
+        {{ render_blog_post(blog_post, from_index=true, section_class=loop.cycle('-odd', '-even')) }}
+        {% if loop.index == loop.length %}
+            {{ render_pagination(this.pagination, loop.length is odd) }}
+        {% endif %}
+    {% endfor %}
+{% endblock %}

templates/macros/blog.html

@@ -0,0 +1,22 @@
+{% macro render_blog_post(post, from_index=false, section_class='-odd') %}
+    <section class="content {{ section_class }}">
+        <div class="content__box -heading">
+            <div class="content__inner_box">
+                {% if from_index %}
+                    <h2><a class="content__blog_link {{ section_class }}" href="{{ post|url }}">{{ post.title }}</a></h2>
+                {% else %}
+                    <h2>{{ post.title }}</h2>
+                {% endif %}
+                <hr class="{{ section_class }}">
+                <p class="content__meta">
+                    <i>geschrieben von {{ post.author }} am {{ post.pub_date }}</i>
+                </p>
+            </div>
+        </div>
+        <div class="content__box -columns">
+            <div class="content__inner_box">
+                {{ post.body }}
+            </div>
+        </div>
+    </section>
+{% endmacro %}

templates/macros/pagination.html

@@ -0,0 +1,23 @@
+{% macro render_pagination(pagination, odd) %}
+    {% if pagination.has_next or pagination.has_prev %}
+        <section class="content {% if odd %}-odd{% else %}-even{% endif %}">
+            <div class="content__box">
+                <div class="content__inner_box">
+                    <div class="content__pagination {% if odd %}-odd{% else %}-even{% endif %}">
+                        {% if pagination.has_prev %}
+                            <a class="pagination__anchor {% if odd %}-odd{% else %}-even{% endif %}" href="{{ pagination.prev|url }}">&laquo; Previous</a>
+                        {% else %}
+                            <span class="pagination__disabled">&laquo; Previous</span>
+                        {% endif %}
+                        | {{ pagination.page }} |
+                        {% if pagination.has_next %}
+                            <a class="pagination__anchor {% if odd %}-odd{% else %}-even{% endif %}" href="{{ pagination.next|url }}">Next &raquo;</a>
+                        {% else %}
+                            <span class="pagination__disabled">Next &raquo;</span>
+                        {% endif %}
+                    </div>
+                </div>
+            </div>
+        </section>
+    {% endif %}
+{% endmacro %}