improve margins of nested lists. See #4560

Author: cscheid

news/changelog-1.3.md

@@ -40,6 +40,7 @@
 - Don't display custom appendix sections in the TOC ([#3113](https://github.com/quarto-dev/quarto-cli/issues/3113)).
 - Use custom `styles.html` template partial to better support checkbox alignment ([#4556](https://github.com/quarto-dev/quarto-cli/issues/4556)).
 - Improve ergonomics of text-highting in HTML output, not emitting difficult overwrite styles and better supporting theme -> CSS conversion. ([#4334](https://github.com/quarto-dev/quarto-cli/issues/4334)).
+- Improve CSS of nested tight and loose lists ([#4560](https://github.com/quarto-dev/quarto-cli/discussions/4650)).
 
 ## Article Layout
 

src/resources/formats/html/bootstrap/_bootstrap-rules.scss

@@ -7,6 +7,18 @@ main {
   }
 }
 
+// the scss mode for vs code doesn't like the fancy :has(> p) selector, but
+// it's valid: https://developer.mozilla.org/en-US/docs/Web/CSS/:has
+ul > li:not(:has(> p)) > ul,
+ol > li:not(:has(> p)) > ul,
+ul > li:not(:has(> p)) > ol,
+ol > li:not(:has(> p)) > ol {
+  margin-bottom: 0;
+}
+ul > li:not(:has(> p)) > ul > li:has(> p) {
+  margin-top: 1rem;
+}
+
 // Grid layout
 body {
   margin: 0;

src/resources/formats/html/pandoc/styles.html

@@ -79,6 +79,15 @@
 li > ol, li > ul {
   margin-top: 0;
 }
+ul > li:not(:has(> p)) > ul,
+ol > li:not(:has(> p)) > ul,
+ul > li:not(:has(> p)) > ol,
+ol > li:not(:has(> p)) > ol {
+  margin-bottom: 0;
+}
+ul > li:not(:has(> p)) > ul > li:has(>p) {
+  margin-top: 1rem;
+}
 blockquote {
   margin: 1em 0 1em 1.7em;
   padding-left: 1em;