Improvements to Markdown CSS (#326)

* Move ul/ol to list-outside so we can render paragraphs inside them
* Add left margin to ul/ol
* Add margin-top to headers
* Change the style of nested lists

Closes #317
This commit is contained in:
José Valim 2021-06-07 11:35:25 +02:00 committed by GitHub
parent a8073ceac1
commit 2f38e3454e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -5,27 +5,27 @@
}
.markdown h1 {
@apply text-gray-800 font-semibold text-3xl my-4;
@apply text-gray-800 font-semibold text-3xl mt-8 mb-4;
}
.markdown h2 {
@apply text-gray-800 font-semibold text-2xl my-4;
@apply text-gray-800 font-semibold text-2xl mt-8 mb-4;
}
.markdown h3 {
@apply text-gray-800 font-semibold text-xl my-4;
@apply text-gray-800 font-semibold text-xl mt-8 mb-4;
}
.markdown h4 {
@apply text-gray-800 font-semibold text-lg my-4;
@apply text-gray-800 font-semibold text-lg mt-8 mb-4;
}
.markdown h5 {
@apply text-gray-800 font-semibold text-base my-4;
@apply text-gray-800 font-semibold text-base mt-8 mb-4;
}
.markdown h6 {
@apply text-gray-800 font-semibold text-base my-4;
@apply text-gray-800 font-semibold text-base mt-8 mb-4;
}
.markdown p {
@ -33,11 +33,19 @@
}
.markdown ul {
@apply list-disc list-inside my-4;
@apply list-disc list-outside my-5 ml-8;
}
.markdown ol {
@apply list-decimal list-inside my-4;
@apply list-decimal list-outside my-5 ml-8;
}
.markdown ul ul {
list-style-type: circle;
}
.markdown ul ul ul {
list-style-type: square;
}
.markdown ul > li,
@ -45,11 +53,6 @@
@apply my-1;
}
.markdown ul > li ul,
.markdown ol > li ol {
@apply ml-6;
}
.markdown blockquote {
@apply border-l-4 border-gray-200 pl-4 py-2 my-4 text-gray-500;
}