Fix: Padding on message box.

Allow 20 max rows on message area.

src/components/common/messaging/MessageBox.tsx

@@ -61,13 +61,18 @@ export type UploadState =
 
 const Base = styled.div`
     display: flex;
-    /*padding: 0 12px;*/
+    align-items: flex-start;
     background: var(--message-box);
 
     textarea {
         font-size: 0.875rem;
         background: transparent;
     }
+
+    .textarea {
+        flex-grow: 1;
+        padding: 12px 0;
+    }
 `;
 
 const Blocked = styled.div`
@@ -419,11 +424,12 @@ function MessageBox({ channel, draft }: Props) {
                         />
                     </Action>
                 ) : undefined}
+                <div class="textarea">
                     <TextAreaAutoSize
                         autoFocus
                         hideBorder
-                    maxRows={5}
-                    padding={14}
+                        maxRows={20}
+                        padding={0}
                         id="message"
                         value={draft ?? ""}
                         onKeyUp={onKeyUp}
@@ -475,6 +481,7 @@ function MessageBox({ channel, draft }: Props) {
                         onFocus={onFocus}
                         onBlur={onBlur}
                     />
+                </div>
                 {isTouchscreenDevice && (
                     <Action>
                         <IconButton onClick={send}>