From dc6099d656737df0ba0fdfe1fbffd3b5ca6142d8 Mon Sep 17 00:00:00 2001 From: Aman Agrawal Date: Tue, 23 May 2023 02:37:50 +0000 Subject: [PATCH] message_row: Use equal top/bottom padding in message content. We had the `3px 0 1px` padding before migration to use grid, then I switched it to use `4px 0 1px` since we were planning to use blue box border which seemed to have helped that case. Since we switched to using outline for blue box, it makes sense to just use equal padding. --- web/styles/message_row.css | 9 ++++++++- web/styles/zulip.css | 2 +- 2 files changed, 9 insertions(+), 2 deletions(-) diff --git a/web/styles/message_row.css b/web/styles/message_row.css index 863e6a9eb3..58c8b7bbe5 100644 --- a/web/styles/message_row.css +++ b/web/styles/message_row.css @@ -242,12 +242,19 @@ $time_column_max_width: 150px; .message_content { grid-row-start: 1; grid-column-start: 2; - padding: 4px 0 1px; + /* + Space between two single line messages in a paragraph is 10px. + There is 3px margin above and below a message. So, having a 2px + padding above and below the message will make the space between + all single paragraphs the same. + */ + padding: 2px 0; } .message_reactions { grid-row-start: 4; grid-column-start: 2; + margin-top: -1px; } .message_edit { diff --git a/web/styles/zulip.css b/web/styles/zulip.css index 258aaff026..c9070087c5 100644 --- a/web/styles/zulip.css +++ b/web/styles/zulip.css @@ -1243,7 +1243,7 @@ td.pointer { .messagebox { border-radius: 0 0 7px 7px; - padding-bottom: 5px; + padding-bottom: 4px; } }