From 8566cd613d48ba70bca383642ed8edba9396a44d Mon Sep 17 00:00:00 2001
From: trashtemp <96388163+trashtemp@users.noreply.github.com>
Date: Sat, 15 Jan 2022 14:33:14 +0100
Subject: [PATCH] fix(messagebox): fixed broken padding

---
 .../common/messaging/MessageBox.tsx           | 29 +++++++++++--------
 1 file changed, 17 insertions(+), 12 deletions(-)

diff --git a/src/components/common/messaging/MessageBox.tsx b/src/components/common/messaging/MessageBox.tsx
index 48b2bf02..8450c227 100644
--- a/src/components/common/messaging/MessageBox.tsx
+++ b/src/components/common/messaging/MessageBox.tsx
@@ -1,4 +1,4 @@
-import { Send, ShieldX } from "@styled-icons/boxicons-solid";
+import { Send, ShieldX, HappyBeaming, Box } from "@styled-icons/boxicons-solid";
 import Axios, { CancelTokenSource } from "axios";
 import { observer } from "mobx-react-lite";
 import { ChannelPermission } from "revolt.js/dist/api/permissions";
@@ -78,9 +78,11 @@ const Blocked = styled.div`
     user-select: none;
     font-size: var(--text-size);
     color: var(--tertiary-foreground);
+    flex-grow: 1;
+    cursor: not-allowed;
 
-    .text {
-        padding: 14px;
+    > div > div {
+        cursor: default;
     }
 
     svg {
@@ -91,17 +93,13 @@ const Blocked = styled.div`
 const Action = styled.div`
     > div {
         height: 48px;
-        width: 34px;
+        width: 48px;
         display: flex;
         align-items: center;
-        justify-content: end;
+        justify-content: center;
         /*padding: 14px 0 14px 14px;*/
     }
 
-    .mobile {
-        justify-content: start;
-    }
-
     ${() =>
         !isTouchscreenDevice &&
         css`
@@ -575,10 +573,17 @@ export default observer(({ channel }: Props) => {
                     onFocus={onFocus}
                     onBlur={onBlur}
                 />
+                {/*<Action>
+                    <IconButton>
+                        <Box size={24} />
+                    </IconButton>
+                </Action>
+                <Action>
+                    <IconButton>
+                        <HappyBeaming size={24} />
+                    </IconButton>
+                </Action>*/}
                 <Action>
-                    {/*<IconButton onClick={emojiPicker}>
-                        <HappyAlt size={20} />
-                </IconButton>*/}
                     <IconButton
                         className="mobile"
                         onClick={send}