Organize rules of GenericEventListSummary on bubble layout (#8599)

* Organize - data-expanded=false

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Organize - data-expanded=true

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Organize - EventTile

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Dedupe mx_GenericEventListSummary[data-layout=bubble]

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* yarn run lint:style --fix

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
This commit is contained in:
Suguru Hirahara 2022-05-18 13:10:02 +00:00 committed by GitHub
parent bb46846981
commit 9b92eca73d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -606,16 +606,20 @@ limitations under the License.
content: "";
clear: both;
}
}
.mx_GenericEventListSummary[data-expanded=false][data-layout=bubble] {
&[data-expanded=false] {
// Align with left edge of bubble tiles
padding: 0 49px;
// increase margin between ELS and the next Event to not have our user avatar overlap the expand/collapse button
+ .mx_EventTile[data-layout=bubble][data-self=true] {
margin-top: 20px;
}
}
// ideally we'd use display=contents here for the layout to all work regardless of the *ELS but
// that breaks ScrollPanel's reliance upon offsetTop so we have to have a bit more finesse.
.mx_GenericEventListSummary[data-expanded=true][data-layout=bubble] {
&[data-expanded=true] {
display: flex;
flex-direction: column;
margin: 0;
@ -638,10 +642,6 @@ limitations under the License.
}
}
}
// increase margin between ELS and the next Event to not have our user avatar overlap the expand/collapse button
.mx_GenericEventListSummary[data-layout=bubble][data-expanded=false] + .mx_EventTile[data-layout=bubble][data-self=true] {
margin-top: 20px;
}
/* events that do not require bubble layout */