makeup-style
Version:
Minimal CSS files for correcting, improving and normalizing default browser CSS, for narrow viewports first, and provides convenient and intuitive CSS-defaults for styling in general and typographic style.
90 lines (83 loc) • 1.78 kB
CSS
div, header, nav, footer,
address, datalist, details, fieldset, pre, table,
canvas, embed, figure, iframe, object, video,
dl, ol, ul,
blockquote, p {
line-height: calc(1 + var(--added-lead, .6));
}
h1, .heading-1 {
--_added-lead: .125;
--_line-height: calc(
1 + var(--h1-added-lead, var(--_added-lead))
);
--_font-size: calc(
var(--h1-line-span, 2)
* 1em
* (1 + var(--added-lead, .6))
/ var(--_line-height)
);
font-size: var(--h1-font-size, var(--_font-size));
line-height: var(--_line-height);
}
h2, .heading-2 {
--_added-lead: .25;
--_line-height: calc(
1 + var(--h2-added-lead, var(--_added-lead))
);
font-size: calc(
var(--h2-line-span, 1)
* 1em
* (1 + var(--added-lead, .6))
/ var(--_line-height)
);
line-height: var(--_line-height);
}
h3, .heading-3 {
--_added-lead: var(--added-lead, .6);
--_line-height: calc(
1 + var(--h3-added-lead, var(--_added-lead))
);
font-size: calc(
var(--h3-line-span, 1)
* 1em
* (1 + var(--added-lead, .6))
/ var(--_line-height)
);
line-height: var(--_line-height);
}
h4, .heading-4 {
--_line-height: calc(
1 + var(--h4-added-lead, var(--added-lead, .6))
);
font-size: calc(
var(--h4-line-span, 1)
* 1em
* (1 + var(--added-lead, .6))
/ var(--_line-height)
);
line-height: var(--_line-height);
}
h5, .heading-5 {
--_line-height: calc(
1 + var(--h5-added-lead, var(--added-lead, .6))
);
font-size: calc(
var(--h5-line-span, 1)
* 1em
* (1 + var(--added-lead, .6))
/ var(--_line-height)
);
line-height: var(--_line-height);
}
h6, .heading-6 {
--_line-height: calc(
1 + var(--h6-added-lead, var(--added-lead, .6))
);
font-size: calc(
var(--h6-line-span, 1)
* 1em
* (1 + var(--added-lead, .6))
/ var(--_line-height)
);
line-height: var(--_line-height);
}