Apply the same max-width to image tile on the thread timeline as message bubble (#8669)

Author: luixxiul

res/css/views/rooms/_EventBubbleTile.scss

@@ -112,9 +112,8 @@ limitations under the License.
     .mx_DisambiguatedProfile,
     .mx_EventTile_line {
         width: fit-content;
-        max-width: 70%;
-        // fixed line height to prevent emoji from being taller than text
-        line-height: $font-18px;
+        max-width: var(--EventBubbleTile_line-max-width);
+        line-height: $font-18px; // fixed line height to prevent emoji from being taller than text
     }
 
     // other users profile on bubble layout
@@ -265,6 +264,7 @@ limitations under the License.
 
     .mx_EventTile_line {
         --EventBubbleTile_line-margin-inline-end: -12px;
+        --EventBubbleTile_line-max-width: 70%;
 
         position: relative;
         display: flex;

res/css/views/rooms/_EventTile.scss

@@ -901,8 +901,9 @@ $threadInfoLineHeight: calc(2 * $font-12px); // See: _commons.scss
             margin-inline-end: var(--BaseCard_EventTile-spacing-horizontal);
 
             .mx_EventTile_line.mx_EventTile_mediaLine {
-                padding: 0;
-                max-width: 100%;
+                padding-block: 0;
+                padding-inline-start: 0;
+                max-width: var(--EventBubbleTile_line-max-width);
             }
 
             &[data-self=true] {