thepolicylab-projectportals / project-portal-theme

Gatsby Theme for the Project Portals
MIT License
1 stars 0 forks source link

fix: indentation and paragraph spacing for multi-level-lists #274

Open hollandjg opened 1 year ago

hollandjg commented 1 year ago

Fix unexpected spacing on multi-level lists:

image
hollandjg commented 1 year ago

Relevant: https://tailwindcss.com/docs/preflight#lists-are-unstyled

hollandjg commented 1 year ago

We could also look at https://tailwindcss.com/docs/typography-plugin

hollandjg commented 1 year ago

The Markdown lists get formatted with an additional newline between entries and their sub-lists:

* Level 1, Entry 1

  * Level 2
* Level 1, Entry 2
* Level 1, Entry 3

This is the default behavior of the Netlify CMS. I'm not sure if that's what we want.

hollandjg commented 1 year ago

This looks to be a really tricky problem. There's a document here with a section on styling nested lists: https://play.tailwindcss.com/uj1vGACRJA?layout=preview

In short, it's a tricky design problem. We suggest not using nested lists. If we wanted a more bespoke solution, we'd need a designer to go through the different problems – list items with and without paragraph elements. Perhaps the tailwind typography plugin could be used here, but it can't be added without breaking the formatting of all the sites.

hollandjg commented 1 year ago

related to #295

hetd54 commented 1 year ago

Let's discuss with David Yokum and let him know that this is something we cannot fix.