Nested lists remove bottom margin

[adammichaelwood]

Lists have a margin on the bottom. But a list inside a list does not. This almost always looks bad.

Before working on this, I recommend looking through the docs and finding many examples of nested lists --- simple nested lists, lists inside paragraphs inside lists, etc. It may be worthwhile to create an ad-hoc list examples page for testing. We want nested lists to have sensible and consistent spacing. We do not want some of them to suddenly have double (or more) spacing.

[adammichaelwood]

Here's another example of nested lists looking terrible because of spacing.

[ankita240796]

I found the same issue while adding show/hide feature for style-guide code-blocks. So, I added a line break along with the label to fix that. I am trying to find the reason for this.

[adammichaelwood]

Yeah, I've added line breaks here and there but we need a better solution in the CSS.

The reason for this problem, ultimately, is that the creators of the template didn't really envision list items containing paragraphs. (This oversight is pretty common.)

[ankita240796]

So, we need to play with the CSS to fix that. I will try doing that!

[adammichaelwood]

Essentially yes.

The CSS first defines lists as having some margin, and then later defines nested lists as not having it. I think the solution is to make nested lists match top-level lists. (I don't know if that will cause a range of other problems, so it might require fine tuning --- like only adding it if the containing list has paragraphs or something.)

(Side note.... this makes me start to wonder: At what point should we think about making these changes in the SASS and compiling CSS as part of the build? And at what point should we start maintaining our own fork of rtd_theme? I'm not sure we're at that point yet, but we might get there before we know it. There are a lot of typography issues I'd like to deal with that are too hard to handle in an after-the-fact CSS monkey-patch approach)

[ankita240796]

I will look into all of this and share any queries here!

[adammichaelwood]

Another example, notable because an admonition block looks even worse after a nested a list: