Set common horizontal spacing rules for EventTile on the right panel (#8528)

* Remove an obsolete override against .mx_EventTile_line

- Move &[data-layout=bubble] under mx_ThreadView
- Use variables for .mx_NewRoomIntro
- Move the variable to BaseCard

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

* Use --ThreadView_group_spacing-end variable

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

* Apply GenericEventListSummary rules to ThreadView only

This commit stops those declarations from being applied to TimelineCard, which is also applied with mx_ThreadPanel class name.

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

* Nesting - mx_GenericEventListSummary:not([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 14:08:39 +01:00
committed by GitHub
parent 8d59612c74
commit bb46846981
4 changed files with 48 additions and 48 deletions
+16 -16
View File
@@ -139,13 +139,23 @@ limitations under the License.
}
}
&.mx_ThreadView .mx_ThreadView_timelinePanelWrapper {
position: relative;
min-height: 0; // don't displace the composer
flex-grow: 1;
&.mx_ThreadView {
// Inside a thread timeline only
.mx_GenericEventListSummary {
&:not([data-layout=bubble]) > .mx_EventTile_line {
padding-inline-start: var(--ThreadView_group_spacing-start); // align summary text with message text
padding-inline-end: var(--ThreadView_group_spacing-end); // align summary text with message text
}
}
.mx_FileDropTarget {
border-radius: 8px;
.mx_ThreadView_timelinePanelWrapper {
position: relative;
min-height: 0; // don't displace the composer
flex-grow: 1;
.mx_FileDropTarget {
border-radius: 8px;
}
}
}
@@ -191,16 +201,6 @@ limitations under the License.
}
}
.mx_GenericEventListSummary {
&[data-layout=bubble] > .mx_EventTile_line {
padding-left: 30px !important; // Override main timeline styling - align summary text with message text
}
&:not([data-layout=bubble]) > .mx_EventTile_line {
padding-inline-start: var(--ThreadView_group_spacing-start); // align summary text with message text
}
}
.mx_MessageComposer {
background-color: $background;
border-radius: 8px;