3 files changed, 18 insertions, 3 deletions
diff --git a/web/pw-server/src/lib/components/SubmitPane.svelte b/web/pw-server/src/lib/components/SubmitPane.svelte
index 740f2cf..82f752e 100644
--- a/web/pw-server/src/lib/components/SubmitPane.svelte
+++ b/web/pw-server/src/lib/components/SubmitPane.svelte
@@ -11,6 +11,8 @@
   let availableBots: object[] = [];
   let selectedOpponent = undefined;
   let botName: string | undefined = undefined;
+  // whether to show the "save succesful" message
+  let saveSuccesful = false;
 
   let saveErrors: string[] = [];
 
@@ -56,6 +58,9 @@
   }
 
   async function saveBot() {
+    saveSuccesful = false;
+    saveErrors = [];
+
     let response = await fetch("/api/save_bot", {
       method: "POST",
       headers: {
@@ -77,8 +82,7 @@
       if (!availableBots.find((bot) => bot["id"] == responseData["id"])) {
         availableBots = [...availableBots, responseData];
       }
-      // clear errors
-      saveErrors = [];
+      saveSuccesful = true;
     } else {
       const error = responseData["error"];
       if (error["type"] === "validation_failed") {
@@ -113,7 +117,9 @@
     {#if $currentUser}
       <div>Add your bot to the opponents list</div>
       <input type="text" class="bot-name-input" placeholder="bot name" bind:value={botName} />
-      {#if saveErrors.length > 0}
+      {#if saveSuccesful}
+        <div class="success-text">Bot saved succesfully</div>
+      {:else if saveErrors.length > 0}
         <ul>
           {#each saveErrors as errorText}
             <li class="error-text">{errorText}</li>
@@ -151,6 +157,11 @@
     color: red;
   }
 
+  .success-text {
+    color: green;
+    margin: 0 8px;
+  }
+
   .submit-button {
     padding: 8px 16px;
     border-radius: 8px;
diff --git a/web/pw-server/src/routes/index.svelte b/web/pw-server/src/routes/index.svelte
index 243f4da..08dc60a 100644
--- a/web/pw-server/src/routes/index.svelte
+++ b/web/pw-server/src/routes/index.svelte
@@ -209,6 +209,8 @@
   .sidebar-left {
     width: 240px;
     background-color: $bg-color;
+    display: flex;
+    flex-direction: column;
   }
   .sidebar-right {
     width: 400px;
@@ -246,6 +248,7 @@
     list-style: none;
     color: #eee;
     padding-top: 15px;
+    overflow-y: scroll;
   }
 
   .match-card {
diff --git a/web/pw-server/src/routes/style.css b/web/pw-server/src/routes/style.css
index 293d3b1..f7d5388 100644
--- a/web/pw-server/src/routes/style.css
+++ b/web/pw-server/src/routes/style.css
@@ -1,3 +1,4 @@
 body {
   margin: 0;
+  font-family: Roboto, Helvetica, sans-serif;
 }