Make invitation dialog scrollable when infos are too long (#11753)

* make invitation dialog scrollable when room name or invitation text/info is too long. Signed-off-by: nurjinn jafar <[email protected]> * truncate room name in invitation dialog to two lines Signed-off-by: nurjinn jafar <[email protected]> * truncate room name in invitation dialog to two lines Signed-off-by: nurjinn jafar <[email protected]> * fix linter issue Signed-off-by: nurjinn jafar <[email protected]> --------- Signed-off-by: nurjinn jafar <[email protected]>
matrix-org · Oct 24, 2023 · b2fb41b · b2fb41b
1 parent 827715c
commit b2fb41b
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 0 deletions.
diff --git a/res/css/views/dialogs/_InviteDialog.pcss b/res/css/views/dialogs/_InviteDialog.pcss
@@ -194,6 +194,14 @@ limitations under the License.
     height: 600px;
     overflow: hidden;
 
+    h2 {
+        display: -webkit-box;
+        -webkit-line-clamp: 2;
+        -webkit-box-orient: vertical;
+        white-space: pre-wrap;
+        overflow: hidden;
+    }
+
     .mx_InviteDialog_addressBar {
         margin-inline-end: 0;
     }

diff --git a/res/css/views/rooms/_RoomPreviewBar.pcss b/res/css/views/rooms/_RoomPreviewBar.pcss
@@ -140,6 +140,19 @@ limitations under the License.
         }
     }
 }
+.mx_RoomPreviewBar_Invite {
+    max-height: 100vh;
+    overflow-y: auto;
+    justify-content: flex-start;
+}
+
+.mx_RoomPreviewBar_Invite h3 {
+    display: -webkit-box;
+    -webkit-line-clamp: 2;
+    -webkit-box-orient: vertical;
+    white-space: pre-wrap;
+    overflow: hidden;
+}
 
 .mx_RoomPreviewBar_inviter {
     font-weight: var(--cpd-font-weight-semibold);