fix: message input hidden text when multiline (#789)

zer0-os · Jul 13, 2023 · b94dee7 · b94dee7
1 parent 09a36d7
commit b94dee7
Showing 1 changed file with 12 additions and 12 deletions.
diff --git a/src/components/message-input/styles.scss b/src/components/message-input/styles.scss
@@ -39,7 +39,7 @@
     display: flex;
     align-items: flex-end;
     gap: 16px;
-    align-self: stretch;
+    width: 100%;
   }
 
   &__icon-outer {
@@ -81,12 +81,12 @@
 
   &__chat-container {
     display: flex;
-    padding: 8px 1px 8px 16px;
+    padding: 7px 0px 7px 16px;
     flex-direction: column;
     justify-content: center;
     align-items: flex-end;
     gap: 8px;
-    flex: 1 0 0;
+    width: 100%;
 
     background-color: theme.$color-primary-1;
     border: 1px solid theme.$color-greyscale-6;
@@ -110,16 +110,12 @@
     justify-content: flex-end;
     align-items: center;
     gap: 8px;
-    flex-shrink: 0;
-    align-self: stretch;
   }
 
   &__mentions-text-area {
     display: flex;
     flex-direction: column;
     flex: 1 0 0;
-    font-size: 14px;
-    line-height: 17px;
 
     &__wrap {
       &__suggestions {
@@ -133,6 +129,11 @@
     position: relative;
     overflow-y: visible;
 
+    &__control {
+      font-size: 14px;
+      line-height: 17px;
+    }
+
     &__highlighter {
       position: relative;
       box-sizing: border-box;
@@ -142,7 +143,7 @@
       white-space: pre-wrap;
       background: transparent;
       overflow-wrap: break-word;
-      border: 1px solid transparent;
+      border: none !important;
       text-align: start;
 
       &__substring {
@@ -157,11 +158,8 @@
     textarea {
       color: theme.$color-greyscale-12;
       word-break: break-word;
-      font-size: 14px !important;
-      line-height: 17px;
-      font-weight: 400;
       outline: none;
-      border: 1px solid transparent;
+      border: none;
     }
 
     &__input {
@@ -180,6 +178,8 @@
       bottom: 0px;
       overflow: hidden;
       resize: none;
+      border: none;
+      padding: 0px;
     }
 
     &__suggestions {