From 91938efe354ebc6d8b578e2bf82a27669b52b3f4 Mon Sep 17 00:00:00 2001
From: julius <julius@0124816.xyz>
Date: Tue, 28 Jan 2025 17:21:53 +0100
Subject: [PATCH] feat: test floating button

---
 src/App.css      | 19 +++++++++++++++++--
 src/Rankings.tsx |  4 +++-
 2 files changed, 20 insertions(+), 3 deletions(-)

diff --git a/src/App.css b/src/App.css
index 0fcf6ad..04c6f9f 100644
--- a/src/App.css
+++ b/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,
diff --git a/src/Rankings.tsx b/src/Rankings.tsx
index e174f9c..aa47472 100644
--- a/src/Rankings.tsx
+++ b/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) => {