More chat ui

resources/chatbox.scss

@@ -11,15 +11,6 @@
     float: right;
     margin-right: 1em;
 }
-#emoji-button {
-    position: absolute;
-    right: 1em;
-    font-size: 2em;
-    color: lightgray;
-}
-#emoji-button:hover {
-    color: gray;
-}
 #chat-log {
     padding: 0;
     padding-top: 2em;
@@ -58,18 +49,12 @@
     overflow-y: scroll;
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
-    height: 75%;
+    flex-grow: 1;
 }
 
 #chat-input {
-    width: 100%;
-    padding: 0.4em 4em 1em 1.2em;
-    border: 0;
     color: black;
-    border-top-left-radius: 0;
-    border-top-right-radius: 0;
-    height: 100%;
-    font-size: 16px;
+    border: 2px solid #e4a81c;
 }
 #chat-online-content {
     padding: 0;
@@ -87,7 +72,7 @@
     #chat-container {
         display: flex;
         width: 100%;
-        height: calc(100vh - 3em);;
+        height: calc(100vh - 3em);
         border: 1px solid #ccc;
         /*border-radius: 0 4px 0 0;*/
         border-bottom: 0;
@@ -99,9 +84,6 @@
     #chat-area {
         flex-grow: 1;
     }
-    .chat-left-panel, .chat-right-panel {
-        display: block !important;
-    }
 }
 #chat-input, #chat-log .content-message {
     font-family: "Noto Sans", Arial, "Lucida Grande", sans-serif;
@@ -109,14 +91,7 @@
 .info-pic {
     height: 100%;
 }
-.info-circle {
-    position: absolute;
-    cx: 12%;
-    cy: 12%;
-    r: 12%;
-    stroke: white;
-    stroke-width: 1;
-}
+
 .info-name {
     margin-left: 10px;
     font-size: 2em;
@@ -173,6 +148,7 @@
     display: flex;
     padding: 15px;
     gap: 0.5em;
+    border-radius: 6px;
 }
 .status-row:hover {
     background: lightgray;
@@ -191,6 +167,8 @@
     border-radius: 15px;
     max-width: 70%;
     width: fit-content;
+    font-size: 1.05rem;
+    line-height: 1.3;
 }
 .message-text-other {
     background: #eeeeee;
@@ -200,7 +178,12 @@
     background: rgb(0, 132, 255);
     color: white;
 }
-
+.chat-input-icon {
+    color: #045343;
+}
+.chat-input-icon:hover {
+    background: lightgray;
+}
 .chat {
     .active-span {
         color: #636363;
@@ -239,9 +222,6 @@
 
 @media (max-width: 799px) {
     #chat-area {
-        height: calc(100vh - 50px);
-    }
-    #emoji-button {
-        display: none;
+        height: calc(100vh - 120px);
     }
 }

resources/darkmode.css

@@ -3008,19 +3008,13 @@ a.voted {
     background-image: initial;
     background-color: rgb(20, 22, 22);
 }
-#emoji-button {
-    color: rgb(169, 166, 160);
-}
-#emoji-button:hover {
-    color: rgb(126, 119, 107);
-}
 #chat-online {
     border-right-color: rgb(51, 56, 58);
     border-bottom-color: initial;
 }
 #chat-input {
-    border-color: initial;
     color: rgb(193, 191, 188);
+    border-color: rgb(132, 97, 16);
 }
 .selected-status-row {
     background-color: rgb(41, 44, 46);
@@ -3036,9 +3030,6 @@ a.voted {
         border-bottom-color: initial;
     }
 }
-.info-circle {
-    stroke: rgb(193, 191, 188);
-}
 #chat-info {
     box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 3px;
 }
@@ -3068,6 +3059,13 @@ a.voted {
     background-color: rgb(0, 88, 169);
     color: rgb(193, 191, 188);
 }
+.chat-input-icon {
+    color: rgb(170, 166, 161);
+}
+.chat-input-icon:hover {
+    background-image: initial;
+    background-color: rgb(41, 44, 46);
+}
 .chat .active-span {
     color: rgb(140, 134, 125);
 }
@@ -3728,19 +3726,6 @@ code .il {
 .sr-only {
     border-color: initial;
 }
-::-webkit-scrollbar-track {
-    background-color: transparent;
-}
-::-webkit-scrollbar-thumb {
-    background-color: rgb(33, 41, 45);
-    border-color: transparent;
-}
-::-webkit-scrollbar-thumb:hover {
-    background-color: rgb(50, 65, 68);
-}
-.body-message {
-    border-bottom-color: rgb(50, 54, 56);
-}
 .CtxtMenu_InfoContent {
     border-color: initial;
     background-color: rgb(28, 30, 32);
@@ -3838,6 +3823,15 @@ mjx-merror {
 mjx-assistive-mml {
     border-color: initial !important;
 }
+mjx-stretchy-v > mjx-ext {
+    border-color: transparent;
+}
+.recently-attempted ul {
+    list-style-image: initial;
+}
+.organization-row:last-child {
+    border-bottom-color: initial;
+}
 
 /* Override Style */
 .vimvixen-hint {