Mirror
/
zulip
mirror of https://github.com/zulip/zulip.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

markdown: Move all inter-element spacing to bottom.

This commit is contained in:
Karl Stolley 2024-04-18 15:35:30 -04:00 committed by Tim Abbott
parent fc8e16f5e4
commit a3476af97c
2 changed files with 15 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
web/styles/message_row.css
View File

@ -201,12 +201,10 @@ $message_box_margin: 3px;
.message_content { .message_content {
grid-area: message; grid-area: message;
/* /*
Space between two single line messages in a paragraph is 10px. Space between two single line messages is 10px, which is maintained
There is 3px margin above and below a message. So, having a 2px by setting 5px of padding above messages without a sender.
padding above and below the message will make the space between
all single paragraphs the same.
*/ */
padding: 2px 0; padding: 5px 0 0;
color: var(--color-text-message-default); color: var(--color-text-message-default);
line-height: var(--message-box-line-height); line-height: var(--message-box-line-height);
min-height: 17px; min-height: 17px;
@ -378,7 +376,8 @@ $message_box_margin: 3px;
} }
.message_content { .message_content {
padding-top: 0; /* Top padding is reduced when there is a sender line. */
padding-top: 3px;
grid-area: message; grid-area: message;
} }

19
web/styles/rendered_markdown.css
View File

@ -1,6 +1,6 @@
.rendered_markdown { .rendered_markdown {
& p { & p {
margin: 3px 0 5px; margin: 0 0 5px;
} }
/* The spacing between two paragraphs is significantly larger. We /* The spacing between two paragraphs is significantly larger. We
@ -10,9 +10,8 @@
margin-top: 10px; margin-top: 10px;
} }
/* Ensure bulleted lists are nicely centered in 1-line messages */
& ul { & ul {
margin: 2px 0 5px 20px; margin: 0 0 5px 20px;
} }
/* Swap the left and right margins of bullets for Right-To-Left languages */ /* Swap the left and right margins of bullets for Right-To-Left languages */
@ -21,9 +20,8 @@
margin-left: 0; margin-left: 0;
} }
/* Ensure ordered lists are nicely centered in 1-line messages */
& ol { & ol {
margin: 2px 0 5px 20px; margin: 0 0 5px 20px;
} }
/* Swap the left and right margins of ordered list for Right-To-Left languages */ /* Swap the left and right margins of ordered list for Right-To-Left languages */
@ -46,6 +44,9 @@
h6 { h6 {
font-weight: 600; font-weight: 600;
line-height: 1.4; line-height: 1.4;
/* Headings take a margin-top because of the pronounced extra
space they require, but are zeroed out below when they open
a message. */
margin-top: 15px; margin-top: 15px;
margin-bottom: 5px; margin-bottom: 5px;
} }
@ -90,7 +91,7 @@
/* Formatting for blockquotes */ /* Formatting for blockquotes */
& blockquote { & blockquote {
padding-left: 5px; padding-left: 5px;
margin: 5px 0 5px 10px; margin: 0 0 5px 10px;
border-left: 5px solid hsl(0deg 0% 87%); border-left: 5px solid hsl(0deg 0% 87%);
} }
@ -106,7 +107,7 @@
/* Formatting for Markdown tables */ /* Formatting for Markdown tables */
& table { & table {
padding-right: 10px; padding-right: 10px;
margin: 5px; margin: 0 5px 5px;
width: 99%; width: 99%;
display: block; display: block;
max-width: fit-content; max-width: fit-content;
@ -577,7 +578,7 @@
.message_embed { .message_embed {
display: block; display: block;
position: relative; position: relative;
margin: 5px 0; margin: 0 0 5px;
border: none; border: none;
border-left: 3px solid hsl(0deg 0% 93%); border-left: 3px solid hsl(0deg 0% 93%);
height: 80px; height: 80px;
@ -680,7 +681,7 @@
overflow-x: auto; overflow-x: auto;
word-break: break-all; word-break: break-all;
word-wrap: normal; word-wrap: normal;
margin: 5px 0; margin: 0 0 5px;
padding: 5px 7px 3px; padding: 5px 7px 3px;
display: block; display: block;
border-radius: 4px; border-radius: 4px;