Improvment to reset plus spelling fix.

This commit is contained in:
Fredrik Jonsson 2024-10-16 08:41:36 +02:00
commit 17bd5c22ba
5 changed files with 32 additions and 18 deletions

View file

@ -3,25 +3,22 @@
// Document
html {
// Prevent adjustments of font size.
-webkit-text-size-adjust: none;
text-size-adjust: none;
// On short pages, we want any background gradients to fill the entire height
// of the browser.
min-height: 100%;
// Use the saner border-box model.
box-sizing: border-box;
// Improve text rendering.
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
// Use the saner border-box model for all elements.
*,
*::before,
*::after {
box-sizing: inherit;
box-sizing: border-box;
}
html {
// Prevent adjustments of font size.
-webkit-text-size-adjust: none;
text-size-adjust: none;
// Improve text rendering.
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
// Activate transition to intrinsic sizes like auto and fit-content.
interpolate-size: allow-keywords;
}
// Sections
@ -30,6 +27,9 @@ body {
// Remove the margin in all browsers.
margin: 0;
padding: 0;
// On short pages, we want the body to fill the entire height
// of the browser.
min-height: 100vh;
}
// Embedded content
@ -82,3 +82,11 @@ kbd,
samp {
font-family: var(--ff-monospace);
}
// Numbers
td,
math,
time[datetime*=":"] {
font-variant-numeric: tabular-nums lining-nums;
}

View file

@ -5,13 +5,13 @@ html {
font-family: var(--ff-body);
// Set base font size in percent.
font-size: calc(#{$base-font-size} / 16 * 100%);
// Correct the line height in all browsers.
line-height: $base-line-height;
// Set text colour.
color: var(--color-text);
}
body {
// Correct the line height in all browsers.
line-height: $base-line-height;
// Output a horizontal grid to help with debugging typography. The
// $debug variable will toggle its output.
@include debug-grid();

View file

@ -51,6 +51,12 @@ textarea {
width: Min(30em, 100%);
}
// Make sure textareas without a rows attribute are not tiny.
textarea:not([rows]) {
min-height: 10em
}
// For forms with multibple fields show submit button below the form.
input:not(:only-of-type),
textarea {

View file

@ -13,7 +13,7 @@
blockquote {
// Add vertical rhythm margins.
@include margin-block(0 1);
// Nicer text wrap, e.g. no lone work on last line.
// Nicer text wrap, e.g. no lone word on last line.
text-wrap: pretty;
// Also indent the quote on both sides.
margin-inline: var(--indent-amount);
@ -51,7 +51,7 @@ menu {
}
li {
// Nicer text wrap, e.g. no lone work on last line.
// Nicer text wrap, e.g. no lone word on last line.
text-wrap: pretty;
// Set max text line width in main for readability.
.main & {
@ -78,7 +78,7 @@ hr {
p {
// Add vertical rhythm margins.
@include margin-block(0 1);
// Nicer text wrap, e.g. no lone work on last line.
// Nicer text wrap, e.g. no lone word on last line.
text-wrap: pretty;
// Set max text line width in main for readability.

View file

@ -38,7 +38,7 @@ figure {
padding-block-start: var(--image-padding);
// Set max text line width in main for readability.
max-width: var(--max-line-width);
// Nicer text wrap, e.g. no lone work on last line.
// Nicer text wrap, e.g. no lone word on last line.
text-wrap: pretty;
@include respond-to(s) {