added optional showcase section to home page

README.md

@@ -39,6 +39,7 @@ summaryLength = 70  # number of words for article summaries
     posts = "posts"  # content directory where to find home page posts; default searches in "posts" and "post"
     showPostsLink = true  # show or hide the link to the simple post list
     extraContentDirs = []  # other content directories to render similarly to the home page
+    showcaseDir = "showcase"  # create a content directory that shows a special showcase section in the home page
 
     # It's best to put these icons in the "static" folder of your site
     logo = "/logo.svg"

assets/scss/style.scss

@@ -868,3 +868,28 @@ header.jumbotronContainer {
     }
 }
 {{ end }}
+
+.showcaseCard {
+    @extend article;
+    @extend .card;
+    margin-bottom: 24px;
+    display: flex;
+    flex-direction: row-reverse;
+    flex-wrap: wrap;
+    justify-content: center;
+    padding: 12px !important;
+
+    > img {
+        flex-basis: 30%;
+        width: 300px;
+        height: 250px;
+        object-fit: cover;
+        margin: 12px;
+        {{ if eq .Site.Params.navtype "circles" }}
+            border-radius: $border_radius;
+        {{ end }}
+    }
+    > div {
+        flex-basis: 60%;
+    }
+}

layouts/index.html

@@ -3,6 +3,7 @@
     {{/* get all the pages that are regular posts and not pages */}}
     {{ $postsDir := .Site.Params.Posts | default (slice "posts" "post") }}
     {{ $allPostsList := where site.RegularPages "Section" "in" $postsDir }}
+    {{- partial "showcase.html" . -}}
     {{- partial "home_post_list.html" (dict "Ctx" . "AllPostsList" $allPostsList) -}}
 
 {{ end }}

layouts/partials/showcase.html

@@ -0,0 +1,17 @@
+{{ if .Site.Params.showcaseDir }}
+{{ $showcasePosts := where site.RegularPages "Section" "in" .Site.Params.showcaseDir }}
+    {{ range (sort $showcasePosts "File.LogicalName") }}
+        {{ if in .Dir .Site.Params.showcaseDir }}
+            <div class="showcaseCard {{if .Site.Params.discreteCards }}discrete{{ end }}">
+                <div>
+                    <h1>{{ .Title }}</h1>
+                    <div>{{ .Content }}</div>
+                </div>
+                {{ if .Params.image }}
+                    <img src="{{ .Params.image }}" />
+                {{ end }}
+            </div>
+        {{ end }}
+    {{ end }}
+    <hr />
+{{ end }}