diff --git a/res/css/views/messages/_MImageBody.scss b/res/css/views/messages/_MImageBody.scss index 56690a8f7e9..270451d8085 100644 --- a/res/css/views/messages/_MImageBody.scss +++ b/res/css/views/messages/_MImageBody.scss @@ -62,12 +62,6 @@ $timeline-image-border-radius: 8px; overflow: hidden; contain: paint; - min-height: $font-44px; - min-width: $font-44px; - display: flex; - justify-content: center; - align-items: center; - // Override inline max-width value to avoid overflow max-width: 100% !important; diff --git a/res/css/views/rooms/_EventBubbleTile.scss b/res/css/views/rooms/_EventBubbleTile.scss index b28021c49eb..c8449b1bb8c 100644 --- a/res/css/views/rooms/_EventBubbleTile.scss +++ b/res/css/views/rooms/_EventBubbleTile.scss @@ -156,9 +156,12 @@ limitations under the License. padding-right: 48px; } - .mx_MImageBody_thumbnail_container { - min-height: calc(1.8rem + var(--gutterSize) + var(--gutterSize)); - min-width: calc(1.8rem + var(--gutterSize) + var(--gutterSize)); + .mx_MImageBody { + .mx_MImageBody_thumbnail_container { + justify-content: center; + min-height: calc(1.8rem + var(--gutterSize) + var(--gutterSize)); + min-width: calc(1.8rem + var(--gutterSize) + var(--gutterSize)); + } } .mx_CallEvent { diff --git a/res/css/views/rooms/_EventTile.scss b/res/css/views/rooms/_EventTile.scss index 5db670c0f22..37e100e8dd1 100644 --- a/res/css/views/rooms/_EventTile.scss +++ b/res/css/views/rooms/_EventTile.scss @@ -58,6 +58,13 @@ $threadInfoLineHeight: calc(2 * $font-12px); // See: _commons.scss } } + .mx_MImageBody { + .mx_MImageBody_thumbnail_container { + display: flex; + align-items: center; // on every layout + } + } + &[data-layout=group] { .mx_EventTile_line { line-height: var(--GroupLayout-EventTile-line-height); @@ -265,6 +272,12 @@ $threadInfoLineHeight: calc(2 * $font-12px); // See: _commons.scss .mx_MImageBody { margin-right: 34px; + + .mx_MImageBody_thumbnail_container { + justify-content: flex-start; + min-height: $font-44px; + min-width: $font-44px; + } } .mx_EventTile_e2eIcon {