Merge branch 'develop' of github.com:matrix-org/matrix-react-sdk into t3chguy/fix/18969

 Conflicts:

	src/components/views/dialogs/LeaveSpaceDialog.tsx

	src/i18n/strings/en_EN.json

res/css/views/elements/_ImageView.scss

@@ -18,6 +18,10 @@ $button-size: 32px;
 $icon-size: 22px;
 $button-gap: 24px;
 
+:root {
+    --image-view-panel-height: 68px;
+}
+
 .mx_ImageView {
     display: flex;
     width: 100%;
@@ -36,14 +40,24 @@ $button-gap: 24px;
 
 .mx_ImageView_image {
     flex-shrink: 0;
+
+    &.mx_ImageView_image_animating {
+        transition: transform 200ms ease 0s;
+    }
+
+    &.mx_ImageView_image_animatingLoading {
+        transition: transform 300ms ease 0s;
+    }
 }
 
 .mx_ImageView_panel {
     width: 100%;
-    height: 68px;
+    height: var(--image-view-panel-height);
     display: flex;
     justify-content: space-between;
     align-items: center;
+    animation-name: mx_ImageView_panel_keyframes;
+    animation-duration: 300ms;
 }
 
 .mx_ImageView_info_wrapper {
@@ -124,3 +138,13 @@ $button-gap: 24px;
         mask-size: 40%;
     }
 }
+
+@media (prefers-reduced-motion) {
+    .mx_ImageView_image_animating {
+        transition: none !important;
+    }
+
+    .mx_ImageView_image_animatingLoading {
+        transition: none !important;
+    }
+}

res/css/views/rooms/_EventTile.scss

@@ -732,6 +732,11 @@ $hover-select-border: 4px;
         margin-top: 0;
         padding-bottom: 5px;
         margin-bottom: 5px;
+
+        .mx_MessageTimestamp {
+            left: auto;
+            right: 0;
+        }
     }
 
     .mx_MessageComposer_sendMessage {

res/css/views/rooms/_MessageComposer.scss

@@ -185,16 +185,26 @@ limitations under the License.
     }
 }
 
+.mx_ContextualMenu {
+    .mx_MessageComposer_button {
+        padding-left: calc(var(--size) + 6px);
+    }
+}
+
 .mx_MessageComposer_button {
     --size: 26px;
     position: relative;
-    margin-right: 6px;
     cursor: pointer;
     height: var(--size);
     line-height: var(--size);
     width: auto;
-    padding-left: calc(var(--size) + 5px);
+    padding-left: var(--size);
     border-radius: 100%;
+    margin-right: 6px;
+
+    &:last-child {
+        margin-right: auto;
+    }
 
     &::before {
         content: '';