mirror of https://github.com/vector-im/riot-web
Tidy up IRCLayout.pcss (#10189)
* Specify the data-layout=irc against ':not([data-layout=bubble])' Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com> * Include mx_EventTile_info in mx_EventTile[data-layout=irc] Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com> * Move declarations up, removing a default declaration Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com> * Tidy up mx_EventTile:hover Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com> * Use a spacing variable Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com> * Sort by order properties Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com> * Move and add comments Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com> * Merge style declarations - flex-shrink and height Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com> * Consider cascading order Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com> * Move order declaration top Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com> * Fix an invalid comment Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com> --------- Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>pull/28217/head
Suguru Hirahara
GitHub
parent
92906c2130
commit
ba796504f5
|
|
@ -17,57 +17,54 @@ limitations under the License.
|
|||
$irc-line-height: $font-18px;
|
||||
|
||||
.mx_IRCLayout {
|
||||
--name-width: 80px; // cf. ircDisplayNameWidth on Settings.tsx
|
||||
--name-width: 80px; /* cf. ircDisplayNameWidth on Settings.tsx */
|
||||
--icon-width: 14px;
|
||||
--right-padding: 5px;
|
||||
--line-height: $irc-line-height;
|
||||
--right-padding: 5px; /* TODO: Use a spacing variable */
|
||||
|
||||
line-height: var(--line-height) !important;
|
||||
|
||||
blockquote {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.mx_NewRoomIntro {
|
||||
> h2 {
|
||||
line-height: initial; /* Cancel $irc-line-height */
|
||||
}
|
||||
}
|
||||
|
||||
.mx_EventTile {
|
||||
.mx_EventTile[data-layout="irc"] {
|
||||
--EventTile_irc_line-padding-block: 1px;
|
||||
|
||||
/* timestamps are links which shouldn't be underlined */
|
||||
> a {
|
||||
text-decoration: none;
|
||||
min-width: $MessageTimestamp_width;
|
||||
}
|
||||
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: flex-start;
|
||||
padding-top: 0;
|
||||
|
||||
> a {
|
||||
text-decoration: none; /* timestamps are links which shouldn't be underlined */
|
||||
min-width: $MessageTimestamp_width; /* ensure space for EventTile without timestamp */
|
||||
}
|
||||
|
||||
> * {
|
||||
margin-right: var(--right-padding);
|
||||
}
|
||||
|
||||
.mx_EventTile_msgOption {
|
||||
order: 5;
|
||||
flex-shrink: 0;
|
||||
.mx_EventTile_avatar,
|
||||
.mx_EventTile_e2eIcon {
|
||||
height: $irc-line-height;
|
||||
}
|
||||
|
||||
.mx_EventTile_line,
|
||||
.mx_EventTile_reply {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
order: 3;
|
||||
flex-grow: 1;
|
||||
flex-shrink: 1;
|
||||
min-width: 0;
|
||||
.mx_EventTile_avatar,
|
||||
.mx_DisambiguatedProfile,
|
||||
.mx_EventTile_e2eIcon,
|
||||
.mx_EventTile_msgOption {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.mx_EventTile_avatar {
|
||||
order: 1;
|
||||
position: relative;
|
||||
flex-shrink: 0;
|
||||
height: $irc-line-height;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
|
|
@ -82,10 +79,9 @@ $irc-line-height: $font-18px;
|
|||
}
|
||||
|
||||
.mx_DisambiguatedProfile {
|
||||
order: 2;
|
||||
width: var(--name-width);
|
||||
margin-inline-end: 0; /* override mx_EventTile > * */
|
||||
order: 2;
|
||||
flex-shrink: 0;
|
||||
|
||||
> .mx_DisambiguatedProfile_displayName {
|
||||
width: 100%;
|
||||
|
|
@ -96,9 +92,8 @@ $irc-line-height: $font-18px;
|
|||
|
||||
> .mx_DisambiguatedProfile_mxid {
|
||||
visibility: collapse;
|
||||
/* Override the inherited margin. */
|
||||
margin-left: 0;
|
||||
padding: 0 5px;
|
||||
margin-left: 0; /* Override the inherited margin. */
|
||||
padding: 0 5px; /* TODO: Use a spacing variable */
|
||||
}
|
||||
|
||||
&:hover {
|
||||
|
|
@ -110,7 +105,7 @@ $irc-line-height: $font-18px;
|
|||
display: inline;
|
||||
background-color: $event-selected-color;
|
||||
border-radius: 8px 0 0 8px;
|
||||
padding-right: 8px;
|
||||
padding-right: $spacing-8;
|
||||
}
|
||||
|
||||
> .mx_DisambiguatedProfile_mxid {
|
||||
|
|
@ -123,12 +118,7 @@ $irc-line-height: $font-18px;
|
|||
|
||||
.mx_EventTile_e2eIcon {
|
||||
padding: 0;
|
||||
|
||||
flex-shrink: 0;
|
||||
flex-grow: 0;
|
||||
|
||||
height: $font-18px;
|
||||
|
||||
background-position: center;
|
||||
}
|
||||
|
||||
|
|
@ -155,13 +145,34 @@ $irc-line-height: $font-18px;
|
|||
}
|
||||
}
|
||||
|
||||
.mx_EventTile_line,
|
||||
.mx_EventTile_reply {
|
||||
order: 3;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-grow: 1;
|
||||
flex-shrink: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.mx_EventTile_reply {
|
||||
order: 4;
|
||||
}
|
||||
|
||||
.mx_EventTile_msgOption {
|
||||
order: 5;
|
||||
}
|
||||
|
||||
.mx_EditMessageComposer_buttons {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
&.mx_EventTile_info {
|
||||
.mx_ViewSourceEvent, /* For hidden events */
|
||||
.mx_TextualEvent {
|
||||
line-height: $irc-line-height;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mx_EventTile_emote {
|
||||
|
|
@ -171,17 +182,6 @@ $irc-line-height: $font-18px;
|
|||
}
|
||||
}
|
||||
|
||||
blockquote {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.mx_EventTile.mx_EventTile_info {
|
||||
.mx_ViewSourceEvent, /* For hidden events */
|
||||
.mx_TextualEvent {
|
||||
line-height: $irc-line-height;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_ReplyChain {
|
||||
.mx_DisambiguatedProfile {
|
||||
width: unset;
|
||||
|
|
|
|||
Loading…
Reference in New Issue