turn verticalposts shortcode into partial

assets/scss/blog.scss

@@ -11,6 +11,7 @@
 // partials
 @import "partials/sidebar";
 @import "partials/footer";
+@import "partials/moreposts";
 @import "partials/helpers/icons.scss";
 
 #blog-header {

assets/scss/home.scss

@@ -5,9 +5,6 @@
 // fonts
 @import "fonts/playfair";
 
-// shortcodes
-@import "shortcodes/verticalposts";
-
 // partials
 @import "partials/sidebar";
 @import "partials/footer";
@@ -73,26 +70,4 @@ main > p {
     &:last-of-type {
         margin-bottom: 8rem;
     }
-}
-
-section {
-    position: relative;
-    h2 {
-        .more{
-            font-size: .75em;
-            font-weight: normal;
-            hyphens: none;
-            &::after {
-                content: "\27F6";
-                margin-left: .25em;
-                transition: margin .5s;
-            }
-            &:hover::after {
-                margin-left: .5em !important;
-            }
-        }
-        &:hover .more::after {
-            margin-left: .35em;
-        }
-    }
 }

assets/scss/partials/moreposts.scss

@@ -1,7 +1,23 @@
-.verticalposts {
+.moreposts {
     hyphens: auto;
     margin-top: 4em;
-    .verticalposts-wrapper {
+    .more{
+        font-size: .75em;
+        font-weight: normal;
+        hyphens: none;
+        &::after {
+            content: "\27F6";
+            margin-left: .25em;
+            transition: margin .5s;
+        }
+        &:hover::after {
+            margin-left: .5em !important;
+        }
+    }
+    &:hover .more::after {
+        margin-left: .35em;
+    }
+    .moreposts-wrapper {
         border-radius: .5em;
         display: flex;
         flex-direction: row;

content/_index.de.md

@@ -3,6 +3,4 @@ title: "Hola 🖖"
 ---
 Ich erstelle Websites und Grafiken
 
-Zudem betreibe und betreue ich [Cozy Town](https://cozy.town)
+Zudem betreibe und betreue ich [Cozy Town](https://cozy.town)
-
-{{< verticalposts header="latest-posts-heading" >}}

content/_index.en.md

@@ -3,6 +3,4 @@ title: "Hola 🖖"
 ---
 I create Websites and Graphics
 
-Additinaly I host and maintain [Cozy Town](https://cozy.town)
+Additinaly I host and maintain [Cozy Town](https://cozy.town)
-
-{{< verticalposts header="latest-posts-heading" >}}

i18n/de.yaml

@@ -17,8 +17,10 @@ sourcecode:
 made-with: 
     other: "Erstellt mit "
 
-# Shortcodes
+# MorePosts
-verticalposts-more:
+moreposts-heading:
+    other: Aus meinem Blog
+moreposts-more:
     other: mehr
 
 # Home
@@ -27,9 +29,6 @@ introduction-heading:
 introduction-sub:
     other: und Informatik ist meine Leidenschaft.
 
-latest-posts-heading:
-    other: Aus meinem Blog
-
 # Blog
 blog-heading:
     other: Artikel

i18n/en.yaml

@@ -17,8 +17,10 @@ sourcecode:
 made-with: 
     other: "Made with "
 
-# Shortcodes
+# MorePosts
-verticalposts-more:
+moreposts-heading:
+    other: From my Blog
+moreposts-more:
     other: more
 
 # Content
@@ -27,9 +29,6 @@ introduction-heading:
 introduction-sub:
     other: and Computer Science is my passion.
 
-latest-posts-heading:
-    other: From my Blog
-
 # Blog
 blog-heading:
     other: Articles

layouts/blog/single.html

@@ -4,17 +4,28 @@
 {{- end -}}
 
 {{- define "header" }}
-<header id="blog-header">
+    <header id="blog-header">
-    <h1 class="title">{{ .Title }}</h1>
+        <h1 class="title">{{ .Title }}</h1>
-    <p>
+        <p>
-        <span id="blog-post-published" title="{{ i18n "blog-post-published" }} {{ .Date | time.Format "2. January 2006, 15:04 MST" }}">{{ .Date | time.Format "2. January 2006" }}</span>
+            <span
-        <span id="blog-post-updated" title="{{ i18n "blog-post-updated" }} {{ .Lastmod | time.Format "2. January 2006, 15:04 MST" }}">{{ i18n "blog-post-updated" }} {{ .Lastmod | time.Format "2. January 2006" }}</span>
+                id="blog-post-published"
-    </p>
+                title="{{ i18n "blog-post-published" }} {{ .Date | time.Format "2. January 2006, 15:04 MST" }}"
-</header>
+            >
+                {{ .Date | time.Format "2. January 2006" }}
+            </span>
+            <span
+                id="blog-post-updated"
+                title="{{ i18n "blog-post-updated" }} {{ .Lastmod | time.Format "2. January 2006, 15:04 MST" }}"
+            >
+                {{ i18n "blog-post-updated" }} {{ .Lastmod | time.Format "2. January 2006" }}
+            </span>
+        </p>
+    </header>
 {{ end }}
 
 {{- define "main" }}
     <main>
         {{ .Content -}}
+        {{ partial "moreposts.html" . }}
     </main>
 {{- end }} 

layouts/partials/moreposts.html

@@ -0,0 +1,21 @@
+<section class="moreposts">
+    <h2>{{ i18n "moreposts-heading" }}
+        <a href="blog/"class="more">{{ i18n "moreposts-more" }}</a>
+    </h2>
+    <div class="moreposts-wrapper">
+        {{ range first 10 (where .Site.RegularPages "Section" "blog") }}
+            <a href="{{ .Permalink }}" class="post-group">
+                <p class="title">{{ .Title }}</p>
+                <aside class="meta" title="{{ .Date | time.Format "2 Jan 2006, 15:04 MST" }}">
+                    <span class="date">{{ .Date | time.Format "2. January 2006" }}</span>
+                    <span class="author">
+                        {{ with .Params.author }}
+                            by 
+                        {{ end }}
+                        {{ .Params.author }}
+                    </span>
+                </aside>
+            </a>
+        {{ end }}
+    </div>
+</section>

layouts/shortcodes/verticalposts.html

@@ -1,14 +0,0 @@
-<section class="verticalposts">
-    {{ with .Get "header" }}<h2>{{ i18n . }} <a href="blog/"class="more">{{ i18n "verticalposts-more" }}</a></h2>{{ end }}
-    <div class="verticalposts-wrapper">
-{{ range first 3 (where .Site.RegularPages "Section" "blog") }}
-        <a href="{{ .Permalink }}" class="post-group">
-            <p class="title">{{ .Title }}</p>
-            <aside class="meta" title="{{ .Date | time.Format "2 Jan 2006, 15:04 MST" }}">
-                <span class="date">{{ .Date | time.Format "2. January 2006" }}</span>
-                <span class="author">{{ with .Params.author }}by {{ end }}{{ .Params.author }}</span>
-            </aside>
-        </a>
-{{ end }}
-    </div>
-</section>