From 1a4397c918e0c5835b039b1863e33fb64d659737 Mon Sep 17 00:00:00 2001
From: Chase Wackerfuss <cwackerfuss@gmail.com>
Date: Tue, 15 Feb 2022 23:00:37 -0500
Subject: [PATCH] improve layout of header

---
 src/App.tsx                     | 2 +-
 src/components/alerts/Alert.tsx | 4 ++--
 src/index.css                   | 5 -----
 3 files changed, 3 insertions(+), 8 deletions(-)

diff --git a/src/App.tsx b/src/App.tsx
index f57dee7..6e769a6 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -239,7 +239,7 @@ function App() {
 
   return (
     <div className="pt-2 pb-8 max-w-7xl mx-auto sm:px-6 lg:px-8">
-      <div className="flex w-80 mx-auto items-center mb-8 mt-20">
+      <div className="flex w-80 mx-auto items-center mt-4 mb-6">
         <h1 className="text-xl ml-2.5 grow font-bold dark:text-white">
           {GAME_TITLE}
         </h1>
diff --git a/src/components/alerts/Alert.tsx b/src/components/alerts/Alert.tsx
index 243efbc..303cdb9 100644
--- a/src/components/alerts/Alert.tsx
+++ b/src/components/alerts/Alert.tsx
@@ -16,7 +16,7 @@ export const Alert = ({
   topMost = false,
 }: Props) => {
   const classes = classNames(
-    'fixed z-20 top-5 left-1/2 transform -translate-x-1/2 max-w-sm w-full shadow-lg rounded-lg pointer-events-auto ring-1 ring-black ring-opacity-5 overflow-hidden',
+    'fixed z-20 top-14 left-1/2 transform -translate-x-1/2 max-w-sm shadow-lg rounded-lg pointer-events-auto ring-1 ring-black ring-opacity-5 overflow-hidden',
     {
       'bg-rose-500 text-white': variant === 'error',
       'bg-blue-500 text-white': variant === 'success',
@@ -35,7 +35,7 @@ export const Alert = ({
       leaveTo="opacity-0"
     >
       <div className={classes}>
-        <div className="p-4">
+        <div className="p-2">
           <p className="text-sm text-center font-medium">{message}</p>
         </div>
       </div>
diff --git a/src/index.css b/src/index.css
index 43372bc..c3d6639 100644
--- a/src/index.css
+++ b/src/index.css
@@ -53,11 +53,6 @@
   animation-fill-mode: backwards;
 }
 
-svg:hover {
-  animation: float infinite;
-  animation-duration: var(--animation-speed);
-}
-
 .jiggle {
   animation: jiggle linear;
   animation-duration: var(--animation-speed-fast);