Markdown CSS tweaks (#15572)

Update Markdown CSS to more closely match GH rendering. Changes include
better nested list margins and tweaked font sizes.

Co-authored-by: Lauris BH <lauris@nix.lv>
This commit is contained in:
silverwind 2021-05-01 23:32:43 +02:00 committed by GitHub
parent ae6d7860be
commit a64cdfd4fd
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 36 additions and 26 deletions

View File

@ -1,7 +1,7 @@
.markdown:not(code) {
overflow: hidden;
font-size: 16px;
line-height: 1.6 !important;
line-height: 1.5 !important;
word-wrap: break-word;
&.ui.segment {
@ -75,14 +75,10 @@
h4,
h5,
h6 {
margin-top: 1em;
margin-top: 24px;
margin-bottom: 16px;
font-weight: 600;
line-height: 1.4;
&:first-of-type {
margin-top: 0 !important;
}
line-height: 1.25;
}
h1 tt,
@ -102,38 +98,36 @@
h1 {
padding-bottom: .3em;
font-size: 2.25em;
line-height: 1.2;
font-size: 2em;
border-bottom: 1px solid var(--color-secondary);
}
h2 {
padding-bottom: .3em;
font-size: 1.75em;
line-height: 1.225;
font-size: 1.5em;
border-bottom: 1px solid var(--color-secondary);
}
h3 {
font-size: 1.5em;
line-height: 1.43;
}
h4 {
font-size: 1.25em;
}
h5 {
h4 {
font-size: 1em;
}
h5 {
font-size: .875em;
}
h6 {
font-size: 1em;
font-size: .85em;
color: var(--color-text-light-2);
}
p,
blockquote,
details,
ul,
ol,
dl,
@ -232,7 +226,11 @@
}
li > p {
margin-top: 0;
margin-top: 16px;
}
li + li {
margin-top: .25em;
}
dl {
@ -268,10 +266,13 @@
}
table {
width: auto;
overflow: auto;
word-break: keep-all;
display: block;
width: 100%;
width: -webkit-max-content;
width: -moz-max-content;
width: max-content;
max-width: 100%;
overflow: auto;
}
table th {
@ -294,11 +295,20 @@
img {
max-width: 100%;
box-sizing: border-box;
box-sizing: initial;
}
img[align="right"] {
padding-left: 20px;
}
img[align="left"] {
padding-right: 20px;
}
.emoji {
max-width: none;
vertical-align: text-top;
}
span.frame {
@ -391,11 +401,11 @@
code,
tt {
padding: .2em .3em;
padding: .2em .4em;
margin: 0;
font-size: 85%;
background-color: var(--color-markdown-code-block);
border-radius: 3px;
border-radius: 4px;
}
code br,
@ -428,7 +438,7 @@
font-size: 85%;
line-height: 1.45;
background-color: var(--color-markdown-code-block);
border-radius: 3px;
border-radius: 4px;
}
.highlight pre {