Merge branch 'develop' of https://github.com/matrix-org/matrix-react-sdk into export-conversations

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;
@@ -95,17 +95,23 @@ limitations under the License.
             flex-direction: row;
             align-items: center;
             margin-left: 12px;
+            min-width: 0;
 
             .mx_CallEvent_info_basic {
                 display: flex;
                 flex-direction: column;
                 margin-left: 10px; // To match mx_CallEvent
+                min-width: 0;
 
                 .mx_CallEvent_sender {
                     font-weight: 600;
                     font-size: 1.5rem;
                     line-height: 1.8rem;
                     margin-bottom: 3px;
+
+                    overflow: hidden;
+                    white-space: nowrap;
+                    text-overflow: ellipsis;
                 }
 
                 .mx_CallEvent_type {
@@ -126,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;
                         }
@@ -142,13 +148,13 @@ limitations under the License.
             color: $secondary-fg-color;
             margin-right: 16px;
             gap: 8px;
+            min-width: max-content;
 
             .mx_CallEvent_content_button {
-                height: 24px;
                 padding: 0px 12px;
 
                 span {
-                    padding: 8px 0;
+                    padding: 1px 0;
                     display: flex;
                     align-items: center;
 
@@ -162,6 +168,8 @@ limitations under the License.
                         width: 16px;
                         height: 16px;
                         margin-right: 8px;
+
+                        flex-shrink: 0;
                     }
                 }
             }

res/css/views/messages/_MImageBody.scss

@@ -36,6 +36,10 @@ $timelineImageBorderRadius: 4px;
         animation: mx--anim-pulse 1.75s infinite cubic-bezier(.4, 0, .6, 1);
         border-radius: $timelineImageBorderRadius;
     }
+
+    .mx_no-image-placeholder {
+        background-color: $primary-bg-color;
+    }
 }
 
 .mx_MImageBody_thumbnail_container {

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/settings/tabs/user/_HelpUserSettingsTab.scss

@@ -36,6 +36,7 @@ limitations under the License.
     margin-top: 10px;
     padding: 10px;
     width: max-content;
+    max-width: 100%;
 
     .mx_HelpUserSettingsTab_copyButton {
         flex-shrink: 0;

res/css/views/toasts/_IncomingCallToast.scss

@@ -30,7 +30,14 @@ limitations under the License.
             font-size: $font-15px;
             line-height: $font-18px;
 
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+
             margin-top: 2px;
+            margin-right: 6px;
+
+            max-width: 200px;
         }
 
         .mx_CallEvent_type {