From 13fe7f5f62f86f1c97d69aaadb8621c22647fd18 Mon Sep 17 00:00:00 2001 From: Stephan Date: Sun, 21 Feb 2021 17:03:49 +0100 Subject: [PATCH] Added a blog to the site. --- assets/css/style.css | 46 ++++++++++++++++++++++++++++++++ content/blog/contents.lr | 3 +++ databags/navigation.json | 4 +-- models/blog-post.ini | 23 ++++++++++++++++ models/blog.ini | 16 +++++++++++ templates/blog-post.html | 10 +++++++ templates/blog.html | 17 ++++++++++++ templates/macros/blog.html | 22 +++++++++++++++ templates/macros/pagination.html | 23 ++++++++++++++++ 9 files changed, 162 insertions(+), 2 deletions(-) create mode 100644 content/blog/contents.lr create mode 100644 models/blog-post.ini create mode 100644 models/blog.ini create mode 100644 templates/blog-post.html create mode 100644 templates/blog.html create mode 100644 templates/macros/blog.html create mode 100644 templates/macros/pagination.html diff --git a/assets/css/style.css b/assets/css/style.css index c615c9b..3845aab 100644 --- a/assets/css/style.css +++ b/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); diff --git a/content/blog/contents.lr b/content/blog/contents.lr new file mode 100644 index 0000000..b49311a --- /dev/null +++ b/content/blog/contents.lr @@ -0,0 +1,3 @@ +_model: blog +--- +title: Aktuelles diff --git a/databags/navigation.json b/databags/navigation.json index 9be06ce..e2a05b2 100644 --- a/databags/navigation.json +++ b/databags/navigation.json @@ -17,8 +17,8 @@ }, "Aktuelles": { "href": "/blog", - "visible": false, - "list_childs": true, + "visible": true, + "list_childs": false, "items": {} }, "Kontakt": { diff --git a/models/blog-post.ini b/models/blog-post.ini new file mode 100644 index 0000000..e097be3 --- /dev/null +++ b/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 diff --git a/models/blog.ini b/models/blog.ini new file mode 100644 index 0000000..0a3a3ca --- /dev/null +++ b/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 diff --git a/templates/blog-post.html b/templates/blog-post.html new file mode 100644 index 0000000..33dc66c --- /dev/null +++ b/templates/blog-post.html @@ -0,0 +1,10 @@ +{% extends "header_slim.html" %} +{% from "macros/blog.html" import render_blog_post %} +
+
+

{{ this.title }}

+
+
+{% block body %} + {{ render_blog_post(this) }} +{% endblock %} diff --git a/templates/blog.html b/templates/blog.html new file mode 100644 index 0000000..154cd32 --- /dev/null +++ b/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 %} +
+
+

{{ this.title }}

+
+
+ {% 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 %} diff --git a/templates/macros/blog.html b/templates/macros/blog.html new file mode 100644 index 0000000..062a57f --- /dev/null +++ b/templates/macros/blog.html @@ -0,0 +1,22 @@ +{% macro render_blog_post(post, from_index=false, section_class='-odd') %} +
+
+
+ {% if from_index %} +

{{ post.title }}

+ {% else %} +

{{ post.title }}

+ {% endif %} +
+ +
+
+
+
+ {{ post.body }} +
+
+
+{% endmacro %} diff --git a/templates/macros/pagination.html b/templates/macros/pagination.html new file mode 100644 index 0000000..f733c2c --- /dev/null +++ b/templates/macros/pagination.html @@ -0,0 +1,23 @@ +{% macro render_pagination(pagination, odd) %} + {% if pagination.has_next or pagination.has_prev %} +
+
+
+
+ {% if pagination.has_prev %} + « Previous + {% else %} + « Previous + {% endif %} + | {{ pagination.page }} | + {% if pagination.has_next %} + Next » + {% else %} + Next » + {% endif %} +
+
+
+
+ {% endif %} +{% endmacro %}