overlay css changed

3 files changed, 44 insertions, 48 deletions

diff --git a/client-web/public/assets/style/chat.css b/client-web/public/assets/style/chat.css
index 12741e6..26c1ad5 100644
--- a/client-web/public/assets/style/chat.css
+++ b/client-web/public/assets/style/chat.css
@@ -1,10 +1,16 @@
-/* TODO all of these rules are totally stupid */
 .chat {
-    overflow: scroll;
+    position: fixed;
+    z-index: 70;
+
+    right: 1em;
+    bottom: 5em;
+
+    width: min(30em, 50vw);
+    height: min(50em, 70vh);
 
     background-color: var(--bg);
-    padding: 1em;
     border-radius: 1em;
+    padding: 2em;
 }
 
 .chat .message {
@@ -17,7 +23,7 @@
     color: white;
 }
 .chat .messages {
-    height: calc(100% - 5em);
+    height: calc(100% - 3em);
     width: 100%;
     overflow: scroll;
 }
@@ -25,5 +31,6 @@
     padding: 1em;
 }
 .chat input {
+    font-size: x-large;
     width: 100%;
 }
diff --git a/client-web/public/assets/style/master.css b/client-web/public/assets/style/master.css
index 8a437c0..0d2681b 100644
--- a/client-web/public/assets/style/master.css
+++ b/client-web/public/assets/style/master.css
@@ -3,6 +3,7 @@
 @import url("./chat.css");
 @import url("./room.css");
 @import url("./prefs.css");
+@import url("./menu.css");
 
 * {
     font-family: "Ubuntu", sans-serif;
@@ -27,24 +28,6 @@ body {
     justify-content: left;
 }
 
-/* layout magic, dont touch */
-.room {
-    display: table-cell;
-    white-space: nowrap;
-}
-.room:nth-child(2) {
-    width: 64vw;
-}
-.room:nth-child(1) {
-    width: 100vw;
-}
-.chat {
-    display: table-cell;
-    width: 35vw;
-    height: calc(100vh - 3em);
-    white-space: nowrap;
-}
-
 h2 {
     font-weight: 700;
     margin: 1em;
@@ -71,18 +54,6 @@ input[type="text"] {
     border: 1px solid var(--ac-light);
 }
 
-.bottom-menu {
-    background-color: var(--bg);
-    padding: 0.5em;
-    position: fixed;
-    bottom: 0.5em;
-    border: 0px solid transparent;
-    border-radius: 5px;
-    left: 50%;
-    transform: translateX(-50%);
-    z-index: 100;
-}
-
 .start-box {
     position: absolute;
     top: 50vh;
@@ -94,19 +65,10 @@ input[type="text"] {
 }
 .start-box input[type="text"] {
     margin: 0.5em;
-    font-size: 32px;
+    font-size: xx-large;
 }
-
-.menu-br {
-    position: fixed;
-    bottom: 0px;
-    right: 0px;
-    display: block;
-    text-align: right;
-}
-.menu-br .version {
-    font-size: medium;
-    font-weight: bold;
-    color: var(--ac-light);
-    padding: 0.5em;
+.start-box input[type="button"] {
+    margin: 0.5em;
+    font-size: x-large;
+    width: calc(100% - 1em);
 }
diff --git a/client-web/public/assets/style/menu.css b/client-web/public/assets/style/menu.css
new file mode 100644
index 0000000..15df272
--- /dev/null
+++ b/client-web/public/assets/style/menu.css
@@ -0,0 +1,27 @@
+
+
+.bottom-menu {
+    background-color: var(--bg);
+    padding: 0.5em;
+    position: fixed;
+    bottom: 0.5em;
+    border: 0px solid transparent;
+    border-radius: 5px;
+    left: 50%;
+    transform: translateX(-50%);
+    z-index: 100;
+}
+
+.menu-br {
+    position: fixed;
+    bottom: 0px;
+    right: 0px;
+    display: block;
+    text-align: right;
+}
+.menu-br .version {
+    font-size: medium;
+    font-weight: bold;
+    color: var(--ac-light);
+    padding: 0.5em;
+}