Skip to content
This repository has been archived by the owner on Sep 11, 2024. It is now read-only.

Move mx_EventTile_info out of mx_EventTile:not([data-layout=bubble]) #8994

Merged
merged 23 commits into from
Jul 12, 2022
Merged

Move mx_EventTile_info out of mx_EventTile:not([data-layout=bubble]) #8994

merged 23 commits into from
Jul 12, 2022

Conversation

luixxiul
Copy link
Contributor

@luixxiul luixxiul commented Jul 6, 2022

This PR moves mx_EventTile_info out of mx_EventTile:not([data-layout=bubble]) to prevent an unexpected regression due to :not() pseudo class which has a number of quirks, tricks, and unexpected results that you should be aware of before using it.

This PR also aligns avatars and event texts on IRC layout.
Fixes element-hq/element-web#22783

Before After
E2E icon (modern layout) (unchanged) after
Line (modern layout) (unchanged) after
E2E icon (IRC layout) before1↑ Mind the block margin after1
Line (IRC layout) before1 after1
before1 after1

Signed-off-by: Suguru Hirahara [email protected]

type: defect
Notes: Align avatars and event texts on IRC layout


This change is marked as an internal change (Task), so will not be included in the changelog.

@github-actions github-actions bot added Z-Community-PR Issue is solved by a community member's PR T-Task Refactoring, enabling or disabling functionality, other engineering tasks labels Jul 6, 2022
…-layout=bubble]) to mx_EventTile[data-layout=group]

Signed-off-by: Suguru Hirahara <[email protected]>
…ntTile_line from mx_EventTile:not([data-layout=bubble]) to mx_EventTile[data-layout=group]

Signed-off-by: Suguru Hirahara <[email protected]>
Signed-off-by: Suguru Hirahara <[email protected]>
…for both IRC and modern layout

Signed-off-by: Suguru Hirahara <[email protected]>
…ro padding by default)

Signed-off-by: Suguru Hirahara <[email protected]>
Signed-off-by: Suguru Hirahara <[email protected]>
@luixxiul luixxiul marked this pull request as ready for review July 6, 2022 17:09
@luixxiul luixxiul requested a review from a team as a code owner July 6, 2022 17:09
@@ -318,8 +336,30 @@ $left-gutter: 64px;
padding-top: 0px !important;
}

&.mx_EventTile_info .mx_EventTile_line {
padding-left: calc($left-gutter + 20px); // override padding-left $left-gutter
&.mx_EventTile_info {
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

For modern layout

@@ -350,33 +390,6 @@ $left-gutter: 64px;
font-size: $font-14px;
position: relative;

&.mx_EventTile_info {
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

For both IRC and modern layouts

@@ -424,10 +437,6 @@ $left-gutter: 64px;
}

&[data-layout=irc] {
.mx_EventTile_info .mx_EventTile_line {
padding-left: 0; // Override .mx_EventTile:not([data-layout="bubble"]).mx_EventTile_info .mx_EventTile_line
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Because overriding :not() pseudo class is no longer necessary.

Copy link
Member

@robintown robintown left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@robintown
Copy link
Member

except it looks like you have merge conflicts

@luixxiul
Copy link
Contributor Author

@robintown Thanks for reviewing.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
T-Task Refactoring, enabling or disabling functionality, other engineering tasks Z-Community-PR Issue is solved by a community member's PR
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Avatars and event text on IRC layout are not aligned
4 participants