Stop using mx_GroupLayout for styling (#8711)

pull/28788/head^2
Suguru Hirahara 2022-06-15 17:26:24 +00:00 committed by GitHub
parent f9100d5fb6
commit 81c894f2d9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 28 additions and 59 deletions

View File

@ -116,29 +116,11 @@ limitations under the License.
height: 100%;
}
// Override _GroupLayout.scss for the thread panel
.mx_GroupLayout {
.mx_EventTile {
.mx_MessageActionBar {
right: 0;
top: -36px; // 2px above EventTile
z-index: 10; // See _EventTile.scss
}
&[data-shape=ThreadsList] {
> .mx_DisambiguatedProfile {
margin-inline-start: 0;
}
.mx_MessageTimestamp {
position: initial;
width: auto;
}
.mx_EventTile_line {
padding-bottom: 0; // Override mx_EventTile_line on _GroupLayout.scss
}
}
.mx_EventTile[data-layout=group] {
.mx_MessageActionBar {
right: 0;
top: -36px; // 2px above EventTile
z-index: 10; // See _EventTile.scss
}
}

View File

@ -66,8 +66,25 @@ $threadInfoLineHeight: calc(2 * $font-12px); // See: _commons.scss
}
&[data-layout=group] {
.mx_EventTile_line {
line-height: var(--GroupLayout-EventTile-line-height);
> .mx_DisambiguatedProfile {
line-height: $font-20px;
margin-left: $left-gutter;
}
> .mx_EventTile_avatar {
position: absolute;
z-index: 9;
}
.mx_MessageTimestamp {
position: absolute; // for modern layout
}
.mx_EventTile_line,
.mx_EventTile_reply {
padding-top: 1px;
padding-bottom: 3px;
line-height: $font-22px;
}
}
}
@ -128,7 +145,6 @@ $threadInfoLineHeight: calc(2 * $font-12px); // See: _commons.scss
display: inline-block;
padding-bottom: 0px;
padding-top: 0px;
margin: 0px;
max-width: calc(100% - $left-gutter);
}
@ -789,7 +805,7 @@ $threadInfoLineHeight: calc(2 * $font-12px); // See: _commons.scss
}
.mx_DisambiguatedProfile {
margin-right: $spacing-12;
margin-inline: 0 $spacing-12;
display: inline-flex;
flex: 1;
@ -813,6 +829,7 @@ $threadInfoLineHeight: calc(2 * $font-12px); // See: _commons.scss
.mx_EventTile_line {
width: 100%;
box-sizing: border-box;
padding-bottom: 0;
.mx_ThreadPanel_replies {
margin-top: $spacing-8;
@ -835,6 +852,7 @@ $threadInfoLineHeight: calc(2 * $font-12px); // See: _commons.scss
.mx_MessageTimestamp {
max-width: 80px;
width: auto;
position: initial;
}
}

View File

@ -15,38 +15,6 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
$left-gutter: 64px;
.mx_GroupLayout {
--GroupLayout-EventTile-line-height: $font-22px;
.mx_EventTile {
> .mx_DisambiguatedProfile {
line-height: $font-20px;
margin-left: $left-gutter;
}
> .mx_EventTile_avatar {
position: absolute;
z-index: 9;
}
.mx_MessageTimestamp {
position: absolute; // for modern layout
}
.mx_EventTile_line,
.mx_EventTile_reply {
padding-top: 1px;
padding-bottom: 3px;
}
.mx_EventTile_reply {
line-height: var(--GroupLayout-EventTile-line-height);
}
}
}
/* Compact layout overrides */
.mx_MatrixChat_useCompactLayout {

View File

@ -173,6 +173,7 @@ $irc-line-height: $font-18px;
.mx_DisambiguatedProfile {
width: var(--name-width);
margin-inline-end: 0; // override mx_EventTile > *
display: flex;
order: 2;
flex-shrink: 0;