From fb8adf23dcfe7197e4527c37202139d6b0ca1c1f Mon Sep 17 00:00:00 2001
From: Ben Larson <10101828+ben-larson@users.noreply.github.com>
Date: Tue, 12 Nov 2019 20:43:38 -0600
Subject: [PATCH] Style tweaks (#2)

---
 src/main.css | 14 ++++++++++----
 src/main.js  |  3 ++-
 2 files changed, 12 insertions(+), 5 deletions(-)

diff --git a/src/main.css b/src/main.css
index 79658d6..469a4c7 100644
--- a/src/main.css
+++ b/src/main.css
@@ -34,15 +34,21 @@ a {
   text-decoration: none;
 }
 
-.card {
+.card-container {
   width: 50%;
-  padding-top: 40%;
-  position: relative;
-  height: 0;
+  max-width: 30em;
   margin: 2em 2em 3em 2em;
   display: inline-block;
 }
 
+.card {
+  width: 100%;
+  padding-top: 70%;
+  position: relative;
+  height: 0;
+  display: block;
+}
+
 .card iframe {
   box-sizing: border-box;
   pointer-events: none;
diff --git a/src/main.js b/src/main.js
index f7ebd4b..7496520 100644
--- a/src/main.js
+++ b/src/main.js
@@ -22,5 +22,6 @@ repos.forEach(title => {
     'View on GitHub &#8599;'
   );
   const card = element('a', { href: url, class: 'card' }, iframe, githubLink);
-  shelves[0].appendChild(card);
+  const cardContainer = element('div', { class: 'card-container' }, card);
+  shelves[0].appendChild(cardContainer);
 });
-- 
2.45.2