Merge pull request #108 from curiosdevcookie/final_project_branch

Update UI for smaller screens.

Author: curiosdevcookie

week_11__final-project/spelling_bee/fly.toml

@@ -1,4 +1,4 @@
-# fly.toml app configuration file generated for urban-spelling-bee on 2023-06-19T15:59:37+02:00
+# fly.toml app configuration file generated for urban-spelling-bee on 2023-06-19T16:21:29+02:00
 #
 # See https://fly.io/docs/reference/configuration/ for information about how to use this file.
 #

week_11__final-project/spelling_bee/static/css/index.css

@@ -95,7 +95,7 @@ main {
   }
 
   footer {
-    margin-top: -3rem;
+    margin-top: -0.5rem;
   }
 
   main {
@@ -322,7 +322,7 @@ input {
   font-family: var(--font-handwriting);
   font-size: calc(4rem + 1vw);
   color: var(--color-rebeccapurple);
-  animation: fade-in-out 2s linear, drop_into_view 5s linear;
+  animation: fade-in-out 2s linear, fly_into_view 5s linear;
   opacity: 0;
 }
 
@@ -442,6 +442,16 @@ dialog {
 }
 
 @keyframes drop_into_view {
+  0% {
+    transform: translateY(-100%);
+  }
+
+  100% {
+    transform: translateY(0%);
+  }
+}
+
+@keyframes fly_into_view {
   0% {
     transform: translateY(0%);
   }