#2337 - Fix the overly tall chatroom height when a message is in edit…

… mode (#2355)

* fix the overly tall textarea element in edit mode

* same max-height constraint for .c-send-mask

* DRY the max-height specification

* remove unecessary fix

* complete fix

* remove unecessary overflow:hidden

* increase the edit mode max-height

* remove unecessary side-paddings

frontend/views/containers/chatroom/MessageBase.vue

@@ -37,7 +37,7 @@
             @click='$emit("reply-message-clicked")'
           )
 
-        send-area(
+        send-area.c-edit-send-area(
           v-if='isEditing'
           :defaultText='swapMentionIDForDisplayname(text)'
           :isEditing='true'
@@ -379,4 +379,8 @@ export default ({
 .c-disappeared {
   animation: disappeared 0.5s linear;
 }
+
+.c-edit-send-area {
+  padding: 0 0 1rem;
+}
 </style>

frontend/views/containers/chatroom/SendArea.vue

@@ -938,6 +938,7 @@ export default ({
     width: 100%;
     font-size: 1rem;
     word-wrap: break-word;
+    max-height: 12.75rem;
   }
 
   &-textarea {
@@ -948,13 +949,8 @@ export default ({
     background-color: transparent;
     border: none;
     padding: 0.5rem;
-    max-height: 9rem;
     overflow-y: auto;
 
-    @include tablet {
-      max-height: 12.25rem;
-    }
-
     &::-webkit-scrollbar {
       display: none;
     }
@@ -973,6 +969,7 @@ export default ({
     height: auto;
     white-space: pre-line;
     min-height: 0;
+    overflow-y: hidden;
   }
 
   &-btn {