image in blog summery and recent post #62, Scrollbar styling

layouts/partials/head.html

@@ -67,4 +67,31 @@
         line-height: {{ .Site.Params.font.lineHeight | default "1.5" }};
         text-align: {{ .Site.Params.font.textAlign | default "left" }};
     }
+
+    html {
+        background-color: var(--background-color) !important;
+    }
+
+    body::-webkit-scrollbar {
+        width: .5em;
+        height: .5em;
+        background-color: var(--background-color);
+    }
+    
+    ::-webkit-scrollbar-track {
+        box-shadow: inset 0 0 6px var(--background-color);
+        border-radius: 1rem;
+    }
+    
+    ::-webkit-scrollbar-thumb {
+        border-radius: 1rem;
+        background-color: var(--secondary-color);
+        outline: 1px solid var(--background-color);
+    }
+
+    #search-content::-webkit-scrollbar {
+        width: .5em;
+        height: .1em;
+        background-color: var(--background-color);
+    }
 </style>

layouts/partials/sections/footer/recentBlogPosts.html

@@ -1,10 +1,19 @@
 <div class="container py-3" id="recent-posts">
-    {{ if .Site.Params.footer.recentPosts | default true }}
-    <div class="h3 text-center text-secondary py-3">Recent posts</div>
+    {{ if .Site.Params.footer.recentPosts.enable | default false }}
+    <div class="h3 text-center text-secondary py-3">
+        {{ .Site.Params.footer.recentPosts.title | default "Recent Posts" }}
+    </div>
     <div class="row justify-content-center">
         {{ range ( where .Site.RegularPages "Type" "blogs" | first 3 ) }}
         <div class="col-lg-4 col-md-6 pt-2">
             <div class="card h-100">
+                {{ if and (not (.Site.Params.footer.recentPosts.disableFeaturedImage | default false)) (.Params.image) }}
+                <div class="card-header">
+                    <a href="{{ .RelPermalink }}">
+                        <img src="{{ .Params.image }}" class="card-img-top" alt="{{ .Title }}">
+                    </a>
+                </div>
+                {{ end }}
                 <div class="card-body bg-transparent p-3 shadow-sm">
                     <a href="{{ .RelPermalink }}" class="primary-font card-title">
                         <h5 class="card-title bg-transparent" title="{{ .Title }}">{{ .Title | truncate 25 }}</h5>

layouts/partials/sections/header.html

@@ -39,7 +39,7 @@
 
             {{ if not (.Site.Params.navbar.disableSearch | default false) }}
                 <div>
-                    <input id="search" autocomplete="off" class="form-control mr-sm-2 d-none d-md-block" type="search" placeholder="Search ..."
+                    <input id="search" autocomplete="off" class="form-control mr-sm-2 d-none d-md-block" placeholder="Search ..."
                         aria-label="Search" oninput="searchOnChange(event)">
                 </div>
             {{ end }}
@@ -58,7 +58,7 @@
                     {{ if not (.Site.Params.navbar.disableSearch | default false) }}
                         <li class="nav-item navbar-text d-block d-md-none">
                             <div class="nav-link">
-                                <input id="search" autocomplete="off" class="form-control mr-sm-2" type="search" placeholder="Search ..." aria-label="Search" oninput="searchOnChange(event)">
+                                <input id="search" autocomplete="off" class="form-control mr-sm-2" placeholder="Search ..." aria-label="Search" oninput="searchOnChange(event)">
                             </div>
                         </li>
                     {{ end }}