From aebd7e1338e27f1785e03b54de3a5c35258e58ee Mon Sep 17 00:00:00 2001
From: Stefan <svill33@gmail.com>
Date: Wed, 13 Dec 2023 08:14:41 +0100
Subject: [PATCH] feat(client): change intro button style

---
 WebSocketClient/index.html |  2 +-
 WebSocketClient/style.css  | 17 +++++++++++++----
 2 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/WebSocketClient/index.html b/WebSocketClient/index.html
index 4a36a9a..9674b52 100644
--- a/WebSocketClient/index.html
+++ b/WebSocketClient/index.html
@@ -14,7 +14,7 @@
     <h1>UVL Playground</h1>
     <h2 id="connection" style="color: red;"></h2>
 </div>
-<button class="tutorial-button" id="tutorialButton">?</button>
+<div class="tutorial-button" id="tutorialButton"><div class="tutorial-button-text">?</div></div>
 <div>
     <dialog id="dialog">
         <div>
diff --git a/WebSocketClient/style.css b/WebSocketClient/style.css
index c5675ee..cc136a6 100644
--- a/WebSocketClient/style.css
+++ b/WebSocketClient/style.css
@@ -144,17 +144,26 @@ a:active {
 
 .tutorial-button {
     position: fixed;
-    bottom: 20px;
-    right: 20px;
+    top: 10px;
+    right: 10px;
     background-color: #bdc3c7; /* Light gray color for dark mode */
     color: #34495e; /* Dark text color for dark mode */
     border: none;
     border-radius: 50%;
-    padding: 15px;
-    font-size: 24px;
+    padding: 10px;
+   
     cursor: pointer;
     box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
     transition: background-color 0.3s ease;
+    width: 20px; /* Adjust the size as needed */
+    height: 20px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .tutorial-button-text {
+    font-size: 20px;
   }
 
   .tutorial-button:hover {