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

Tidy up IRCLayout.pcss #10189

Merged
merged 24 commits into from
Apr 23, 2023
Merged

Tidy up IRCLayout.pcss #10189

Changes from all commits
Commits
Show all changes
24 commits
Select commit Hold shift + click to select a range
9e14ae9
Specify the data-layout=irc against ':not([data-layout=bubble])'
luixxiul Jun 17, 2022
c5ecf16
Include mx_EventTile_info in mx_EventTile[data-layout=irc]
luixxiul Jun 17, 2022
3861c44
Move declarations up, removing a default declaration
luixxiul Jun 17, 2022
bb79f0e
Tidy up mx_EventTile:hover
luixxiul Jun 17, 2022
4a30bcb
Use a spacing variable
luixxiul Jun 17, 2022
3f91291
Sort by order properties
luixxiul Jun 17, 2022
ef9a28f
Move and add comments
luixxiul Jul 7, 2022
82c839e
Merge style declarations - flex-shrink and height
luixxiul Jul 12, 2022
a5ccb64
Consider cascading order
luixxiul Feb 20, 2023
7db02fe
Move order declaration top
luixxiul Feb 20, 2023
181d111
Merge branch 'develop' into IRCLayout
luixxiul Feb 20, 2023
1dd631d
Merge branch 'develop' into IRCLayout
luixxiul Feb 20, 2023
82d751d
Merge branch 'develop' into IRCLayout
luixxiul Feb 20, 2023
0a8865e
Merge branch 'develop' into IRCLayout
luixxiul Feb 22, 2023
0453cdb
Merge branch 'develop' into IRCLayout
luixxiul Feb 23, 2023
db2b0e0
Merge branch 'develop' into IRCLayout
luixxiul Mar 7, 2023
70ed0a9
Merge branch 'develop' into IRCLayout
luixxiul Mar 11, 2023
786ec4a
Merge branch 'develop' into IRCLayout
luixxiul Mar 18, 2023
ebc87b6
Merge branch 'develop' into IRCLayout
luixxiul Mar 21, 2023
68092ae
Merge branch 'develop' into IRCLayout
luixxiul Mar 24, 2023
0d039fa
Fix an invalid comment
luixxiul Mar 25, 2023
c91e63e
Merge branch 'develop' into IRCLayout
luixxiul Mar 27, 2023
a7bfd51
Merge branch 'develop' of https://github.com/matrix-org/matrix-react-…
luixxiul Apr 4, 2023
e7f95af
Merge branch 'develop' into IRCLayout
luixxiul Apr 17, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
90 changes: 45 additions & 45 deletions res/css/views/rooms/_IRCLayout.pcss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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"] {
Copy link
Contributor Author

Choose a reason for hiding this comment

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

Protection against unintentional override by something in .mx_EventTile:not([data-layout="bubble"]) on _EventTile.pcss

--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;
Copy link
Contributor Author

Choose a reason for hiding this comment

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

Since there is not an inherited value for the property, this declaration can safely be removed.

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;

Expand All @@ -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%;
Expand All @@ -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 {
Expand All @@ -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 {
Expand All @@ -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;
}

Expand All @@ -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 {
Expand All @@ -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;
Expand Down