Merge branch 'develop' into gsouquet/threaded-messaging-2349

res/css/structures/_LeftPanel.scss

@@ -24,6 +24,11 @@ $roomListCollapsedWidth: 68px;
     }
 }
 
+.mx_LeftPanel_wrapper {
+    display: flex;
+    max-width: 50%;
+}
+
 .mx_LeftPanel {
     background-color: $roomlist-bg-color;
     // TODO decrease this once Spaces launches as it'll no longer need to include the 56px Community Panel

res/css/structures/_MatrixChat.scss

@@ -47,9 +47,7 @@ limitations under the License.
     display: flex;
 
     flex: 1;
-    flex-grow: 0;
     min-height: 0;
-    max-width: 50%;
 }
 
 .mx_MatrixChat_syncError {
@@ -65,7 +63,7 @@ limitations under the License.
 }
 
 /* not the left panel, and not the resize handle, so the roomview/groupview/... */
-.mx_MatrixChat > :not(.mx_LeftPanel):not(.mx_SpacePanel):not(.mx_ResizeHandle) {
+.mx_MatrixChat > :not(.mx_LeftPanel):not(.mx_SpacePanel):not(.mx_ResizeHandle):not(.mx_LeftPanel_wrapper) {
     background-color: $primary-bg-color;
 
     flex: 1 1 0;

res/css/structures/_RoomView.scss

@@ -14,6 +14,14 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
+.mx_RoomView_wrapper {
+    display: flex;
+    flex-direction: column;
+    flex: 1;
+    position: relative;
+    justify-content: center;
+}
+
 .mx_RoomView {
     word-wrap: break-word;
     display: flex;

res/css/views/messages/_CallEvent.scss

@@ -41,7 +41,7 @@ limitations under the License.
 
                 height: 16px;
                 width: 16px;
-                background-color: $tertiary-fg-color;
+                background-color: $secondary-fg-color;
                 mask-repeat: no-repeat;
                 mask-size: contain;
                 mask-position: center;
@@ -132,7 +132,7 @@ limitations under the License.
                             position: absolute;
                             height: 13px;
                             width: 13px;
-                            background-color: $tertiary-fg-color;
+                            background-color: $secondary-fg-color;
                             mask-repeat: no-repeat;
                             mask-size: contain;
                         }

res/css/views/rooms/_Autocomplete.scss

@@ -60,7 +60,7 @@
 .mx_Autocomplete_Completion_container_pill {
     margin: 12px;
     display: flex;
-    flex-flow: wrap;
+    flex-direction: column;
 }
 
 .mx_Autocomplete_Completion_container_truncate {
@@ -68,7 +68,6 @@
     .mx_Autocomplete_Completion_subtitle,
     .mx_Autocomplete_Completion_description {
         /* Ellipsis for long names/subtitles/descriptions */
-        max-width: 150px;
         white-space: nowrap;
         overflow: hidden;
         text-overflow: ellipsis;

res/css/views/rooms/_EventBubbleTile.scss

@@ -264,6 +264,7 @@ limitations under the License.
 }
 
 .mx_EventTile.mx_EventTile_bubbleContainer[data-layout=bubble],
+.mx_EventTile.mx_EventTile_leftAlignedBubble[data-layout=bubble],
 .mx_EventTile.mx_EventTile_info[data-layout=bubble],
 .mx_EventListSummary[data-layout=bubble][data-expanded=false] {
     --backgroundColor: transparent;

res/css/views/voip/_CallContainer.scss

@@ -26,19 +26,6 @@ limitations under the License.
     // different level.
     pointer-events: none;
 
-    .mx_CallPreview {
-        pointer-events: initial; // restore pointer events so the user can leave/interact
-
-        .mx_VideoFeed_remote.mx_VideoFeed_voice {
-            min-height: 150px;
-        }
-
-        .mx_VideoFeed_local {
-            border-radius: 8px;
-            overflow: hidden;
-        }
-    }
-
     .mx_AppTile_persistedWrapper div {
         min-width: 350px;
     }

res/css/views/voip/_CallPreview.scss

@@ -18,4 +18,15 @@ limitations under the License.
     position: fixed;
     left: 0;
     top: 0;
+
+    pointer-events: initial; // restore pointer events so the user can leave/interact
+
+    .mx_VideoFeed_remote.mx_VideoFeed_voice {
+        min-height: 150px;
+    }
+
+    .mx_VideoFeed_local {
+        border-radius: 8px;
+        overflow: hidden;
+    }
 }