diff --git a/webapp/src/components/cardDetail/commentsList.scss b/webapp/src/components/cardDetail/commentsList.scss
index c4257f839..f37951e11 100644
--- a/webapp/src/components/cardDetail/commentsList.scss
+++ b/webapp/src/components/cardDetail/commentsList.scss
@@ -24,7 +24,6 @@
     }
 
     .newcomment {
-        color: rgba(var(--center-channel-color-rgb), 0.8);
         flex-grow: 1;
         margin: 4px 0 0 8px;
 
diff --git a/webapp/src/components/markdownEditorInput/markdownEditorInput.scss b/webapp/src/components/markdownEditorInput/markdownEditorInput.scss
index f90b970bc..097f0db06 100644
--- a/webapp/src/components/markdownEditorInput/markdownEditorInput.scss
+++ b/webapp/src/components/markdownEditorInput/markdownEditorInput.scss
@@ -7,4 +7,40 @@
     &--IsNotEditing {
         display: none;
     }
+
+    span[data-testid='mentionText'] {
+        background: rgba(var(--button-bg-rgb), 0.16);
+        border-radius: 4px;
+        color: inherit;
+    }
+}
+
+.DraftEditor-root + div {
+    background: rgba(var(--center-channel-bg-rgb), 1);
+    box-shadow: var(--elevation-1);
+    border: 1px solid rgba(var(--center-channel-color-rgb), 0.16);
+    border-radius: 4px;
+
+    > div {
+        > div {
+            height: 40px;
+            padding: 0 40px 0 20px;
+
+            &[aria-selected='true'] {
+                background: rgba(var(--center-channel-color-rgb), 0.08);
+            }
+
+            &:hover {
+                background: rgba(var(--center-channel-color-rgb), 0.08);
+            }
+
+            &:active {
+                background: rgba(var(--button-bg-rgb), 0.08);
+            }
+
+            span {
+                margin-left: 12px;
+            }
+        }
+    }
 }