Align E2E icon and avatar of info tile in compact modern layout #8906
Conversation
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
github-actions
bot
added
Z-Community-PR
| @@ -1074,14 +1074,20 @@ $threadInfoLineHeight: calc(2 * $font-12px); // See: _commons.scss | |||
| .mx_EventTile { | |||
| // Override :not([data-layout="bubble"]) | |||
| &[data-layout=group] { | |||
| --MatrixChat_useCompactLayout-top-avatar: 2px; | |||
| --MatrixChat_useCompactLayout-top-e2eIcon: 3px; | |||
| --MatrixChat_useCompactLayout_line-spacing-block: 0px; | |||
There was a problem hiding this comment.
This might look redundant but I think this should explicitly ensure that the same zero margin/padding is applied to e2eIcon, avatar, line, and reply.
|
This should work, while IMO it is generally not a great idea to align stuff with pixel from the viewpoint of i18n- Let's not forget the fact that the height of characters are very different among languages. |
|
What I mean is that it needs to be checked whether avatar with/without E2E icon properly align with info event text on both the main timeline and right panel (TimelineCard and ThreadView). The compact layout is available only for the modern layout, so there is just one type of message layout to be checked. I'm checking them to create screenshots. |
|
Added screenshots with a comment. |
Fixes element-hq/element-web#22652
The position of E2E icon on TimelineCard (styled with
.mx_TimelineCard .mx_EventTile:not([data-layout="bubble"]) .mx_EventTile_line .mx_EventTile_e2eIcon) should be checked after removing:not()pseudo class which increases specificity.The pseudo class is going to be removed with #8910.
type: defect
Signed-off-by: Suguru Hirahara luixxiul@users.noreply.github.com
Here's what your changelog entry will look like:
🐛 Bug Fixes