feat: test floating button

src/App.css

@@ -105,10 +105,9 @@ h3 {
 
 button {
   font-weight: bold;
+  font-size: large;
   color: ghostwhite;
   background-color: black;
-  border: 4px solid black;
-  position: relative;
   z-index: 1;
   &:focus {
     outline: black;
@@ -118,6 +117,22 @@ button {
   }
 }
 
+@media only screen and (max-width: 768px) {
+  .submit_text {
+    display: none;
+  }
+  .submit {
+    position: fixed;
+    right: 16px;
+    bottom: 16px;
+    padding: 0px;
+    background-color: unset;
+    font-size: xx-large;
+    margin-bottom: 20px;
+    margin-right: 20px;
+  }
+}
+
 ::backdrop {
   background-image: linear-gradient(
     45deg,

src/Rankings.tsx

@@ -252,7 +252,9 @@ export function MVP({ user, players }: PlayerInfoProps) {
         </div>
       </div>
 
-      <button onClick={() => handleSubmit()}>submit</button>
+      <button className="submit" onClick={() => handleSubmit()}>
+        💾 <span className="submit_text">submit</span>
+      </button>
       <dialog
         id="MVPDialog"
         onClick={(event) => {