From b48818bb460f1f8644436a69bd602fb428fbf217 Mon Sep 17 00:00:00 2001 From: Jorik Schellekens Date: Mon, 1 Jun 2020 15:23:34 +0100 Subject: [PATCH 1/3] Increase specificity of compact layout selectors --- res/css/views/rooms/_GroupLayout.scss | 108 +++++++++++++------------- 1 file changed, 54 insertions(+), 54 deletions(-) diff --git a/res/css/views/rooms/_GroupLayout.scss b/res/css/views/rooms/_GroupLayout.scss index 928ea75a79..94fd35521f 100644 --- a/res/css/views/rooms/_GroupLayout.scss +++ b/res/css/views/rooms/_GroupLayout.scss @@ -55,77 +55,77 @@ $left-gutter: 65px; .mx_MatrixChat_useCompactLayout { .mx_EventTile { padding-top: 4px; - } - .mx_EventTile.mx_EventTile_info { - // same as the padding for non-compact .mx_EventTile.mx_EventTile_info - padding-top: 0px; - font-size: $font-13px; - .mx_EventTile_line, .mx_EventTile_reply { - line-height: $font-20px; - } - .mx_EventTile_avatar { - top: 4px; - } - } - - .mx_EventTile .mx_SenderProfile { - font-size: $font-13px; - } - - .mx_EventTile.mx_EventTile_emote { - // add a bit more space for emotes so that avatars don't collide - padding-top: 8px; - .mx_EventTile_avatar { - top: 2px; - } - .mx_EventTile_line, .mx_EventTile_reply { + .mx_EventTile.mx_EventTile_info { + // same as the padding for non-compact .mx_EventTile.mx_EventTile_info padding-top: 0px; - padding-bottom: 1px; + font-size: $font-13px; + .mx_EventTile_line, .mx_EventTile_reply { + line-height: $font-20px; + } + .mx_EventTile_avatar { + top: 4px; + } + } + + .mx_EventTile .mx_SenderProfile { + font-size: $font-13px; + } + + .mx_EventTile.mx_EventTile_emote { + // add a bit more space for emotes so that avatars don't collide + padding-top: 8px; + .mx_EventTile_avatar { + top: 2px; + } + .mx_EventTile_line, .mx_EventTile_reply { + padding-top: 0px; + padding-bottom: 1px; + } + } + + .mx_EventTile.mx_EventTile_emote.mx_EventTile_continuation { + padding-top: 0; + .mx_EventTile_line, .mx_EventTile_reply { + padding-top: 0px; + padding-bottom: 0px; + } } - } - .mx_EventTile.mx_EventTile_emote.mx_EventTile_continuation { - padding-top: 0; .mx_EventTile_line, .mx_EventTile_reply { padding-top: 0px; padding-bottom: 0px; } - } - .mx_EventTile_line, .mx_EventTile_reply { - padding-top: 0px; - padding-bottom: 0px; - } + .mx_EventTile_avatar { + top: 2px; + } - .mx_EventTile_avatar { - top: 2px; - } + .mx_EventTile_e2eIcon { + top: 3px; + } - .mx_EventTile_e2eIcon { - top: 3px; - } + .mx_EventTile_readAvatars { + top: 27px; + } - .mx_EventTile_readAvatars { - top: 27px; - } + .mx_EventTile_continuation .mx_EventTile_readAvatars, + .mx_EventTile_emote .mx_EventTile_readAvatars { + top: 5px; + } - .mx_EventTile_continuation .mx_EventTile_readAvatars, - .mx_EventTile_emote .mx_EventTile_readAvatars { - top: 5px; - } + .mx_EventTile_info .mx_EventTile_readAvatars { + top: 4px; + } - .mx_EventTile_info .mx_EventTile_readAvatars { - top: 4px; + .mx_EventTile_content .markdown-body { + p, ul, ol, dl, blockquote, pre, table { + margin-bottom: 4px; // 1/4 of the non-compact margin-bottom + } + } } .mx_RoomView_MessageList h2 { margin-top: 6px; } - - .mx_EventTile_content .markdown-body { - p, ul, ol, dl, blockquote, pre, table { - margin-bottom: 4px; // 1/4 of the non-compact margin-bottom - } - } } From 03c68134255ddbf1d9f0646b0affd3bf45317ec8 Mon Sep 17 00:00:00 2001 From: Jorik Schellekens Date: Mon, 1 Jun 2020 16:00:11 +0100 Subject: [PATCH 2/3] Update res/css/views/rooms/_GroupLayout.scss Co-authored-by: J. Ryan Stinnett --- res/css/views/rooms/_GroupLayout.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/res/css/views/rooms/_GroupLayout.scss b/res/css/views/rooms/_GroupLayout.scss index 94fd35521f..8777ef0920 100644 --- a/res/css/views/rooms/_GroupLayout.scss +++ b/res/css/views/rooms/_GroupLayout.scss @@ -56,7 +56,7 @@ $left-gutter: 65px; .mx_EventTile { padding-top: 4px; - .mx_EventTile.mx_EventTile_info { + &.mx_EventTile_info { // same as the padding for non-compact .mx_EventTile.mx_EventTile_info padding-top: 0px; font-size: $font-13px; From 85978426c9d4c54286c2bdfd40f22eec46001049 Mon Sep 17 00:00:00 2001 From: Jorik Schellekens Date: Mon, 1 Jun 2020 16:45:19 +0100 Subject: [PATCH 3/3] Fix selectors --- res/css/views/rooms/_GroupLayout.scss | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/res/css/views/rooms/_GroupLayout.scss b/res/css/views/rooms/_GroupLayout.scss index 8777ef0920..af12cce5d6 100644 --- a/res/css/views/rooms/_GroupLayout.scss +++ b/res/css/views/rooms/_GroupLayout.scss @@ -53,6 +53,11 @@ $left-gutter: 65px; /* Compact layout overrides */ .mx_MatrixChat_useCompactLayout { + .mx_EventTile_line, .mx_EventTile_reply { + padding-top: 0px; + padding-bottom: 0px; + } + .mx_EventTile { padding-top: 4px; @@ -68,11 +73,11 @@ $left-gutter: 65px; } } - .mx_EventTile .mx_SenderProfile { + .mx_SenderProfile { font-size: $font-13px; } - .mx_EventTile.mx_EventTile_emote { + &.mx_EventTile_emote { // add a bit more space for emotes so that avatars don't collide padding-top: 8px; .mx_EventTile_avatar { @@ -84,7 +89,7 @@ $left-gutter: 65px; } } - .mx_EventTile.mx_EventTile_emote.mx_EventTile_continuation { + &.mx_EventTile_emote.mx_EventTile_continuation { padding-top: 0; .mx_EventTile_line, .mx_EventTile_reply { padding-top: 0px; @@ -92,11 +97,6 @@ $left-gutter: 65px; } } - .mx_EventTile_line, .mx_EventTile_reply { - padding-top: 0px; - padding-bottom: 0px; - } - .mx_EventTile_avatar { top: 2px; }