hero: equal height cards

sustainers · Jul 19, 2024 · 3ec8aa0 · 3ec8aa0
1 parent 4b79059
commit 3ec8aa0
Showing 1 changed file with 9 additions and 9 deletions.
diff --git a/_includes/home/hero.html b/_includes/home/hero.html
@@ -4,34 +4,34 @@ <h1>Sustain</h1>
     <h4 class="subtitle">Holding a space for conversations about sustaining Open Source</h4>
 
     <div class="row justify-content-center">
-      <div class="col-md-4">
+      <div class="col-md-4 d-flex align-items-stretch">
         <div class="card">
-          <div class="card-body">
+          <div class="card-body d-flex flex-column">
             <h3 class="card-title text-center">Listen</h3>
             <p class="card-text">Sustain has an official podcast, where Richard Littauer, Justin
               Dorfman, and other hosts talk with guests regularly about sustaining open source.
             </p>
-            <a href="https://podcast.sustainoss.org/" class="btn btn-primary">Tune in</a>
+            <a href="https://podcast.sustainoss.org/" class="btn btn-primary mt-auto align-self-center">Tune in</a>
           </div>
         </div>
       </div>
-      <div class="col-md-4">
+      <div class="col-md-4 d-flex align-items-stretch">
         <div class="card">
-          <div class="card-body">
+          <div class="card-body d-flex flex-column">
             <h3 class="card-title text-center">Events</h3>
             <p class="card-text">Sustain started as a regular event. Now, we've branched out: we not only host
               the main Sustain Summit, but also encourage satellite events under the sustain brand.</p>
-            <a href="/events/" class="btn btn-primary">Learn more</a>
+            <a href="/events/" class="btn btn-primary mt-auto align-self-center">Learn more</a>
           </div>
         </div>
       </div>
-      <div class="col-md-4">
+      <div class="col-md-4 d-flex align-items-stretch">
         <div class="card">
-          <div class="card-body">
+          <div class="card-body d-flex flex-column">
             <h3 class="card-title text-center">Working Groups</h3>
             <p class="card-text">Sustainers who've attended Sustain Summits are working hard to produce
               content to help other members of the ecosystem sustain their software in the long haul.</p>
-            <a href="/working-groups/" class="btn btn-primary">Take a look</a>
+            <a href="/working-groups/" class="btn btn-primary mt-auto align-self-center">Take a look</a>
           </div>
         </div>
       </div>