2024-11-27

layouts/index.hbs

@@ -1,13 +1,13 @@
 ---js
 {
   layout: "base",
-  latest_episodes: function(episodes) {
-    return episodes.sort().reverse().slice(0,4)
+  latest_episodes: function(episodes, limit) {
+    return episodes.sort().reverse().slice(0,limit)
   }
 }
 ---
 <div class="hero">
-  <h1>{{title}}</h1>
+  <h1>{{heroText}}</h1>
   <section class="text-muted">
     {{{content}}}
   </section>
@@ -17,22 +17,10 @@
     {{/if}}
   </section>
 </div>
-<section class="py-5">
+<hr>
+<section class="">
   <h1 class="text-center fs-2">Latest Episodes</h1>
   <div class="container" style="max-width:500px">
-    <div class="row row-cols-2 g-1">
-      {{#each (latest_episodes collections.episode)}}
-          <div class="col">
-            <div class="card m-2">
-              <a href={{{this.url}}}><img src="{{this.data.image}}" class="card-img-top"></a>
-              <div class="card-body">
-                <h5 class="card-title"><a href={{{this.url}}}>{{#if data.title}}{{{data.title}}}{{else}}Episode {{data.episode}}{{/if}}</a></h5>
-                <h6 class="card-subtitle mb-2 text-body-secondary">Season {{data.season}}, Episode {{data.episode}}</h6>
-                <span class="card-subtitle mb-2 text-body-secondary">{{{date this.date "MMM D, YYYY"}}}</h6>
-              </div>
-            </div>
-          </div>
-      {{/each}}
-    </div>
+  {{>episode_card_grid toList=collections.episode limit=4}} 
   </div>
   </section>