fix: revise the heading's margins and line height #11

New issue

Open

opened 2025-10-14 15:48:48 -06:00 by navan · 0 comments

navan commented

2025-10-14 15:48:48 -06:00

Owner

Originally created by @vihuna on 2/11/2025

Use em, relative to heading title font units, for section headings (top and bottom, for h2-h6)
Use <number> units to specify the line height of section headings (for h2-h6)
Make null the top margin for paragraphs after a section heading (so the bottom margin size of the heading is always used, relative to its font size)
Make null the bottom margin for heading hn with a next-sibling hn+1, n= 2,..6 (to avoid unpredictable margin collapses)
Use a linear application to compute the margin size for next-sibling headings: m(s) = alpha * (s - (1 - epsilon) * h6).
Explicitly indicate the margin-top for abstract heading, to keep the same dimensions, because it uses a custom font size.
Add the following (auto-descriptive) variables:
- --h2-font-size
- --h3-font-size
- --h4-font-size
- --h5-font-size
- --h6-font-size
- --h2-line-height
- --h3-h6-line-height
- --h2-margin-top (em units)
- --h3-h6-margin-top (em units)
- --h2-margin-bottom (em units)
- --h3-h6-margin-bottom (em units)
Add the following variables to control next-sibling heading margins (m(s) parameters):
- --h3-h6-sibling-alpha
- --h3-h6-sibling-epsilon

*Originally created by @vihuna on 2/11/2025* - Use `em`, relative to heading title font units, for section headings (top and bottom, for `h2`-`h6`) - Use `<number>` units to specify the line height of section headings (for `h2`-`h6`) - Make null the top margin for paragraphs after a section heading (so the bottom margin size of the heading is always used, relative to its font size) - Make null the bottom margin for heading `hn` with a next-sibling `hn+1`, n= 2,..6 (to avoid unpredictable margin collapses) - Use a linear application to compute the margin size for next-sibling headings: `m(s) = alpha * (s - (1 - epsilon) * h6)`. - Explicitly indicate the `margin-top` for abstract heading, to keep the same dimensions, because it uses a custom font size. - Add the following (auto-descriptive) variables: - `--h2-font-size` - `--h3-font-size` - `--h4-font-size` - `--h5-font-size` - `--h6-font-size` - `--h2-line-height` - `--h3-h6-line-height` - `--h2-margin-top` (`em` units) - `--h3-h6-margin-top` (`em` units) - `--h2-margin-bottom` (`em` units) - `--h3-h6-margin-bottom` (`em` units) - Add the following variables to control next-sibling heading margins (`m(s)` parameters): - `--h3-h6-sibling-alpha` - `--h3-h6-sibling-epsilon`