From 5328ba1727a46783cbb763483322e5677d859926 Mon Sep 17 00:00:00 2001
From: magmaus3 <magmaus3@disroot.org>
Date: Mon, 24 Jul 2023 19:55:08 +0200
Subject: [PATCH] make the tabs take all the space

---
 index.html | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/index.html b/index.html
index e150a5a..9440a56 100644
--- a/index.html
+++ b/index.html
@@ -40,7 +40,7 @@
             // Everything for the UI itself
 
             // Holds the state of tabs.
-            // Intended values are "encode" and "decode"
+            // Intended values are "encode", "decode" and "about"
             let tabOpen = "encode"
 
             function switchTab(name) {
@@ -117,7 +117,7 @@
             .tab {
                 border: 1px solid white;
                 padding: 1em;
-                border-radius: 0em 1em 1em 1em;
+                border-radius: 0em 0em 1em 1em;
                 box-shadow: 0px 5px 15px black, 0px 1px 15px black inset;
             }
             .result:empty { display: none;}
@@ -132,6 +132,8 @@
                 display: none; /* Default value to keep tabs hidden when JS is not available */
             }
             .button {
+                flex: 1;
+                text-align: center;
                 padding: 0.5em;
                 border: 1px solid white;
                 border-bottom: none;
@@ -140,6 +142,9 @@
             .leftButton {
                 border-radius: 1em 0em 0em 0em;
             }
+            .rightButton {
+                border-radius: 0em 1em 0em 0em;
+            }
             .button:hover {
                 box-shadow: 0px 5px 25px black;
             }
@@ -162,7 +167,7 @@
             <div class="tabBar">
                 <div onclick="switchTab('encode')" class="button leftButton">Encode</div>
                 <div onclick="switchTab('decode')" class="button">Decode</div>
-                <div onclick="switchTab('about')" class="button right">About</div>
+                <div onclick="switchTab('about')" class="button rightButton">About</div>
             </div>
             <div class="tab" id="encode">
                 <form>