From 2490ebe6d998b1a333f9200923a6d2b587b819f0 Mon Sep 17 00:00:00 2001
From: BBaoVanC <bbaovanc@bbaovanc.com>
Date: Wed, 6 Oct 2021 17:34:55 -0500
Subject: [PATCH] Add the ability to feature an image in an article on list
 pages

---
 archetypes/blog/index.md   |  6 ++++++
 assets/css/bobastyle.css   | 15 ++++++++++++---
 layouts/_default/list.html |  6 ++++++
 3 files changed, 24 insertions(+), 3 deletions(-)

diff --git a/archetypes/blog/index.md b/archetypes/blog/index.md
index 4007b7a..4736585 100644
--- a/archetypes/blog/index.md
+++ b/archetypes/blog/index.md
@@ -11,4 +11,10 @@ Lorem ipsum
 tags = [
   "awesome",
 ]
+
+# this image will be shown for the article in list pages
+[[resources]]
+name = "feature"
+src = "gui.webp"
+title = "Checkra1n GUI running on Arch Linux"
 +++
diff --git a/assets/css/bobastyle.css b/assets/css/bobastyle.css
index 21745d8..a1d46a9 100644
--- a/assets/css/bobastyle.css
+++ b/assets/css/bobastyle.css
@@ -7,13 +7,17 @@
   margin-bottom: 10px;
 }
 
+.post-title a {
+  color: inherit;
+  text-decoration: inherit;
+}
+
 .post-description {
   padding-top: 10px;
 }
 
-.post-title a {
-  color: inherit;
-  text-decoration: inherit;
+.post-image {
+  padding-top: 15px;
 }
 
 .readmore {
@@ -82,6 +86,11 @@ body {
   max-width: 720px;
 }
 
+img:not(.noborder) {
+  padding: 5px;
+  border: 5px solid #1b5b9b;
+}
+
 a {
   color: #4da6ff;
   text-decoration: inherit;
diff --git a/layouts/_default/list.html b/layouts/_default/list.html
index ca45c4c..0bfe47d 100644
--- a/layouts/_default/list.html
+++ b/layouts/_default/list.html
@@ -66,6 +66,12 @@
     </div>
     {{ end }}
 
+    {{ with .Resources.GetMatch "feature" }}
+    <div class="post-image">
+        <img src="{{ .Permalink }}" alt="{{ .Title }}" />
+    </div>
+    {{ end }}
+
     <div class="post-description">
         {{ if .Description }}
         {{ .Description | markdownify }}