From 96cdabe6b2990092ed47328153fd45302f9f12c1 Mon Sep 17 00:00:00 2001
From: Thomas Smith <49042513+tsmitty11@users.noreply.github.com>
Date: Mon, 27 Mar 2023 13:01:46 -0400
Subject: [PATCH] Add featured image to template

---
 src/content/blog/my-first-blog-post.md |  1 +
 src/layouts/_default/list.html         | 29 +++++++++++++++++++-------
 2 files changed, 22 insertions(+), 8 deletions(-)

diff --git a/src/content/blog/my-first-blog-post.md b/src/content/blog/my-first-blog-post.md
index c960786..d76bae3 100644
--- a/src/content/blog/my-first-blog-post.md
+++ b/src/content/blog/my-first-blog-post.md
@@ -2,6 +2,7 @@
 title: "Something New is Brewing"
 date: 2022-03-23
 draft: false
+featured_image: "/Images/techcrunch-gen-art.jpg"
 ---
 
 I created Homebrew nearly 13 years ago out of sheer necessity. I found the tooling available to developers at the time haphazard and difficult to tease into shape. After complaining about it at the pub one evening, I was met with an exasperated “Max, quit whining and do something about it”. So I did. (Thanks Jono).
diff --git a/src/layouts/_default/list.html b/src/layouts/_default/list.html
index 220f55b..b28d2f5 100644
--- a/src/layouts/_default/list.html
+++ b/src/layouts/_default/list.html
@@ -7,7 +7,7 @@
 
 {{ partial "navbar.html" . }}
 
-  <main style="height:100vh;">
+  <main>
     <section class="teal-bg">
       <div class="container one-box">
         <div class="row">
@@ -22,14 +22,18 @@
     <div class="container blog-list two-boxes">
       <div class="row">
             {{ range .Pages }}
-            <div class="col-4 mb-5">
-              <div class="blog-listing">
-                <a class="display-6" href="{{ .RelPermalink }}">{{ .Title }}</a><br>
-                <span class="grid-gray">{{ .Date.Format "2006-01-02" }}</span>
-                <span class="preview-content">{{ .Content }}</span>
+            <div class="col-4 mb-4">
+              <a href="{{ .RelPermalink }}">
+                <div class="blog-listing p-3 pb-5">
+                  {{ if .Params.featured_image }}
+                    <img class="featured-image mb-3" src="{{ .Params.featured_image }}" alt="{{ .Title }}" />
+                  {{ end }}
+                  <a class="display-6" href="{{ .RelPermalink }}">{{ .Title }}</a><br>
+                  <span class="grid-gray">{{ .Date.Format "2006-01-02" }}</span>
+                  <span class="preview-content">{{ .Content }}</span>
+                </div>
+                </a>
               </div>
-
-            </div>
             {{ end }}
           <a href="/">Back to home</a>
       </div>
@@ -51,6 +55,15 @@
     -webkit-box-orient: vertical;
   }
 
+  .featured-image {
+    width: 100%; /* Adjust the width as needed */
+    height: 100px; /* Maintain the image's aspect ratio */
+  }
+
+  .blog-listing{
+    border: 1px solid #949494;
+  }
+
 </style>
 
 </html>