add hero image

Author: bfgeek

_site/404/index.html

@@ -14,7 +14,9 @@
       <meta name="twitter:description" content="">
       <meta name="description" content="">
       <meta property="og:description" content="">
-     
+    
+
+    
 
     <style>
   *,

_site/about/index.html

@@ -14,7 +14,9 @@
       <meta name="twitter:description" content="">
       <meta name="description" content="">
       <meta property="og:description" content="">
-     
+    
+
+    
 
     <style>
   *,

_site/flexbox-image-gallery/index.html

@@ -11,10 +11,16 @@
 
 
 
-      <meta name="twitter:description" content="">
-      <meta name="description" content="">
-      <meta property="og:description" content="">
-     
+      <meta name="twitter:description" content="How to build a full-bleed Image Gallery with flexbox.">
+      <meta name="description" content="How to build a full-bleed Image Gallery with flexbox.">
+      <meta property="og:description" content="How to build a full-bleed Image Gallery with flexbox.">
+    
+
+    
+      <meta name="twitter:image" content="hero.jpg">
+      <meta name="image" content="hero.jpg">
+      <meta property="og:image" content="hero.jpg">
+    
 
     <style>
   *,
@@ -588,7 +594,7 @@
   <h1 class="post-title">Exploiting flex-grow for an Image Gallery</h1>
   <div class="post-time">
     <time datetime="">
-      Fri, Sep 12, 2025
+      Sat, Sep 13, 2025
     </time>
   </div>
 </header>

_site/index.html

@@ -14,7 +14,9 @@
       <meta name="twitter:description" content="">
       <meta name="description" content="">
       <meta property="og:description" content="">
-     
+    
+
+    
 
     <style>
   *,
@@ -590,11 +592,11 @@
     <a href="/flexbox-image-gallery/">
       <h3 class="article-title">Exploiting flex-grow for an Image Gallery</h3>
       <div class="article-time">
-        <time datetime="Fri Sep 12 2025 20:38:20 GMT-0700 (Pacific Daylight Time)">
-          Fri, Sep 12, 2025
+        <time datetime="Sat Sep 13 2025 10:49:35 GMT-0700 (Pacific Daylight Time)">
+          Sat, Sep 13, 2025
         </time>
       </div>
-      <p class="article-description"></p>
+      <p class="article-description">How to build a full-bleed Image Gallery with flexbox.</p>
     </a>
   </li>
 

_site/rss.xml

@@ -5,7 +5,7 @@
   <link href="rss.xml" rel="self" />
   <link href="https://bfgeek.com/" />
   <updated>
-    2025-09-13T03:38:20Z
+    2025-09-13T17:49:35Z
   </updated>
   <id>https://bfgeek.com/</id>
   <author>
@@ -14,7 +14,7 @@
   <entry>
     <title>Exploiting flex-grow for an Image Gallery</title>
     <link href="/flexbox-image-gallery/" />
-    <updated>2025-09-13T03:38:20Z</updated>
+    <updated>2025-09-13T17:49:35Z</updated>
     <id>/flexbox-image-gallery/</id>
     <content xml:lang="" type="html">
       <img src="hero.jpg" width="1706" height="1350">

_site/sitemap.xml

@@ -3,7 +3,7 @@
 
     <url>
       <loc>https://bfgeek.com//flexbox-image-gallery/</loc>
-        <lastmod>2025-09-12</lastmod>
+        <lastmod>2025-09-13</lastmod>
       </url>
 
 </urlset>

_site/tags/software/index.html

@@ -14,7 +14,9 @@
       <meta name="twitter:description" content="">
       <meta name="description" content="">
       <meta property="og:description" content="">
-     
+    
+
+    
 
     <style>
   *,
@@ -593,11 +595,11 @@ <h1>Tagged “software”</h1>
     <a href="/flexbox-image-gallery/">
       <h3 class="article-title">Exploiting flex-grow for an Image Gallery</h3>
       <div class="article-time">
-        <time datetime="Fri Sep 12 2025 20:38:20 GMT-0700 (Pacific Daylight Time)">
-          Fri, Sep 12, 2025
+        <time datetime="Sat Sep 13 2025 10:49:35 GMT-0700 (Pacific Daylight Time)">
+          Sat, Sep 13, 2025
         </time>
       </div>
-      <p class="article-description"></p>
+      <p class="article-description">How to build a full-bleed Image Gallery with flexbox.</p>
     </a>
   </li>
 

index.html

@@ -22,7 +22,13 @@
       <meta name="twitter:description" content="{{ site.description }}" />
       <meta name="description" content="{{ site.description }}" />
       <meta property="og:description" content="{{ site.description }}" />
-    {% endif %} 
+    {% endif %}
+
+    {% if hero %}
+      <meta name="twitter:image" content="{{ hero }}" />
+      <meta name="image" content="{{ hero }}" />
+      <meta property="og:image" content="{{ hero }}" />
+    {% endif %}
 
     {% include "css/reset.liquid" %}
     {% include "css/prism.liquid" %}

src/_includes/layouts/default.liquid

@@ -1,6 +1,7 @@
 ---
 title: Exploiting flex-grow for an Image Gallery
-description: 
+description: How to build a full-bleed Image Gallery with flexbox.
+hero: hero.jpg
 tags:
   - software
 ---