diff --git a/res/css/views/rooms/_EventBubbleTile.pcss b/res/css/views/rooms/_EventBubbleTile.pcss index 8dd6838411..0b16d626c0 100644 --- a/res/css/views/rooms/_EventBubbleTile.pcss +++ b/res/css/views/rooms/_EventBubbleTile.pcss @@ -332,6 +332,9 @@ limitations under the License. .mx_EventTile_e2eIcon { flex-shrink: 0; /* keep it at full size */ + + // Keep height equal to text for shield alignment, additional 2px because of 1px padding on text + height: calc($font-18px + 2px); } } diff --git a/res/css/views/rooms/_EventTile.pcss b/res/css/views/rooms/_EventTile.pcss index 032daa4839..05e8d5abd6 100644 --- a/res/css/views/rooms/_EventTile.pcss +++ b/res/css/views/rooms/_EventTile.pcss @@ -485,7 +485,11 @@ $left-gutter: 64px; } .mx_EventTile_e2eIcon { - inset: 6px 0 0 44px; + inset: 0 0 0 44px; + + // Keep height equal to text for alignment + height: var(--EventTile_group_line-line-height); + margin: 1px; } .mx_EventTile_msgOption { @@ -1350,7 +1354,6 @@ $left-gutter: 64px; .mx_EventTile[data-layout="group"] { --MatrixChat_useCompactLayout_group-padding-top: $spacing-4; --MatrixChat_useCompactLayout-top-avatar: 2px; - --MatrixChat_useCompactLayout-top-e2eIcon: 3px; --MatrixChat_useCompactLayout_line-spacing-block: 0px; padding-top: var(--MatrixChat_useCompactLayout_group-padding-top); @@ -1410,7 +1413,7 @@ $left-gutter: 64px; } .mx_EventTile_e2eIcon { - top: var(--MatrixChat_useCompactLayout-top-e2eIcon); + margin: 0px; } .mx_DisambiguatedProfile {