picocss / pico

Minimal CSS Framework for semantic HTML
https://picocss.com
MIT License
13.19k stars 381 forks source link

Vertical distance between sections is too small compared to spacing between h3 h4, etc. #445

Open andreashuber69 opened 6 months ago

andreashuber69 commented 6 months ago

Describe the issue

See title, a good example can be found here:

https://4mrnhq.csb.app/#typography

When viewed in isolation, the vertical spacing in this section looks ok to me. However, when you now scroll up just a little such that the section "Preview" becomes visible, it should be apparent that the vertical distance to that section is too small.

Current Behavior

Vertical distance between sections is too small.

Expected Behavior

Vertical distance between sections should be enlarged so that sections become clearly recognizable as such.

Reproduction URL

https://4mrnhq.csb.app/#typography

Environment

Latest Brave on Pop!OS

sawcrz commented 6 months ago

idk if this spacing is enough image

basically i doubled the spacing in the section style: image

andreashuber69 commented 6 months ago

idk if this spacing is enough

Thanks! I'm not sure whether this is the right solution. The weird thing is that the spacing looks perfect in the docs, but apparently these don't include pico.css directly. Assuming that they do via a bundler, I'm wondering whether this is just an oversight that is easily corrected?

sawcrz commented 6 months ago

we can assume this are the simplest solution, but it depends highly of the concrete value of the block-spacing-vertical variable

Regarding the spacing, it may be due to not bundled that specific change at the time of inserting it but I wouldn't know for sure.