From bd9205cae9f2529c026ea87a694a9e0c134da70a Mon Sep 17 00:00:00 2001
From: Jonas Heinrich <onny@project-insanity.org>
Date: Mon, 15 Jan 2024 16:37:15 +0100
Subject: [PATCH] Animations

---
 index.html | 18 ++++++++++++++++--
 1 file changed, 16 insertions(+), 2 deletions(-)

diff --git a/index.html b/index.html
index 55fa635..6f5e55b 100644
--- a/index.html
+++ b/index.html
@@ -98,6 +98,10 @@
         font-size: 1.2rem;
     }
 
+    #questionContainer h2 {
+        margin-top: 0.5rem;
+    }
+
     a {
         text-decoration: none;
         color: #0F1111;
@@ -106,7 +110,7 @@
         display: flex;
         align-items: top;
         max-width: 500px;
-        width: 100%;
+        /* width: 100%; */
         margin: auto;
         padding: 40px;
         background-color: #fff;
@@ -115,7 +119,11 @@
         box-shadow: 0 0 10px rgba(0,0,0,.1);
         font-size: 0.95rem;
         gap: 2rem;
-        transition: all 0.3s ease;
+    }
+    @media (max-width: 600px) {
+        main {
+            padding: 20px;
+        }
     }
     button {
         border: 1px solid #d5d9d9;
@@ -301,6 +309,12 @@
 
                 buttonContainer.appendChild(button);
             }
+
+            var mainContainer = document.querySelector('main');
+            mainContainer.classList.remove('show');
+            void mainContainer.offsetWidth;
+            mainContainer.classList.add('show');
+
             questionContainer.appendChild(buttonContainer);
             feather.replace();