From 1b1c25da80d32732ea623ae1f9dec02649060b51 Mon Sep 17 00:00:00 2001
From: Ben Visness <ben@bvisness.me>
Date: Sat, 22 Apr 2023 11:31:14 -0500
Subject: [PATCH] Fix CSS issue on jams page

---
 public/style.css                  | 3 +++
 src/rawdata/scss/_core.scss       | 4 ++++
 src/templates/src/jams_index.html | 4 ++--
 3 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/public/style.css b/public/style.css
index 6f628c40..e2f0530a 100644
--- a/public/style.css
+++ b/public/style.css
@@ -7553,6 +7553,9 @@ article code {
 .g5 {
   gap: 4rem; }
 
+.aspect-ratio--2x1 {
+  padding-bottom: 50%; }
+
 .hide-if-empty:empty {
   display: none !important; }
 
diff --git a/src/rawdata/scss/_core.scss b/src/rawdata/scss/_core.scss
index 69c88580..da90023a 100644
--- a/src/rawdata/scss/_core.scss
+++ b/src/rawdata/scss/_core.scss
@@ -372,6 +372,10 @@ article code {
 .g4 { gap: $spacing-large; }
 .g5 { gap: $spacing-extra-large; }
 
+.aspect-ratio--2x1 {
+  padding-bottom: 50%;
+}
+
 .hide-if-empty:empty {
   display: none !important;
 }
diff --git a/src/templates/src/jams_index.html b/src/templates/src/jams_index.html
index 5f7eddc4..e1559c05 100644
--- a/src/templates/src/jams_index.html
+++ b/src/templates/src/jams_index.html
@@ -31,8 +31,8 @@
                 <img src="{{ static "wheeljam2021/TwitterCard.png" }}">
             </div>
         </a>
-        <a href="{{ .LispJamUrl }}" class="relative">
-            <div class="br2 overflow-hidden absolute absolute--fill flex flex-column flex justify-center items-center f3 c--dim">
+        <a href="{{ .LispJamUrl }}" class="br2 overflow-hidden relative aspect-ratio--2x1 bg--card">
+            <div class="aspect-ratio--object flex flex-column flex justify-center items-center f3 c--dim">
                 <h3>LISP Jam</h3>
             </div>
         </a>