Improvment to reset plus spelling fix.
This commit is contained in:
parent
7585387985
commit
17bd5c22ba
5 changed files with 32 additions and 18 deletions
|
|
@ -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;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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();
|
||||
|
|
|
|||
|
|
@ -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 {
|
||||
|
|
|
|||
|
|
@ -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.
|
||||
|
|
|
|||
|
|
@ -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) {
|
||||
|
|
|
|||
Loading…
Reference in a new issue