Skip to content

Commit

Permalink
fix: shrink font size when georgia is used (#680)
Browse files Browse the repository at this point in the history
* shrink font size when georgia is used

* use line-height: 1.5 across the board

* shave a pixel off sans font size
  • Loading branch information
Rich-Harris authored Oct 29, 2024
1 parent 952edbf commit 082ad3c
Showing 1 changed file with 13 additions and 14 deletions.
27 changes: 13 additions & 14 deletions packages/site-kit/src/lib/styles/tokens.css
Original file line number Diff line number Diff line change
Expand Up @@ -32,14 +32,14 @@
--sk-font-size-h1: 3.6rem;
--sk-font-size-h2: 3rem;
--sk-font-size-h3: 2.4rem;
--sk-font-size-body: 2rem;
--sk-font-size-body-small: 1.8rem;
--sk-font-size-body: 1.8rem;
--sk-font-size-body-small: 1.6rem;
--sk-font-size-ui-small: 1.3rem;
--sk-font-size-ui-medium: 1.6rem;
--sk-font-size-ui-large: 3rem;
--sk-font-size-mono: 1.4rem;

--sk-line-height-body: 1.7;
--sk-line-height-body: 1.5;

--sk-font-h1: 500 var(--sk-font-size-h1) / 1.2 var(--sk-font-family-heading);
--sk-font-h2: 500 var(--sk-font-size-h2) / 1.2 var(--sk-font-family-heading);
Expand Down Expand Up @@ -125,7 +125,16 @@
--sk-font-family-body: 'EB Garamond', Georgia, serif;
--sk-font-size-body: 2.2rem;
--sk-font-size-body-small: 2rem;
--sk-line-height-body: 1.5;
}

&.font-boring {
--sk-font-family-body: 'Atkinson Hyperlegible', sans-serif;
--sk-font-size-body: 1.9rem;
--sk-font-size-body-small: 1.7rem;

p code {
font-size: 0.75em;
}
}

&.dark {
Expand Down Expand Up @@ -176,16 +185,6 @@
--sk-raised-hover-color: var(--sk-back-6) var(--sk-back-3) var(--sk-back-3) var(--sk-back-6);
--sk-raised-active-color: var(--sk-back-3) var(--sk-back-6) var(--sk-back-6) var(--sk-back-3);
}

&.font-boring {
--sk-font-family-body: 'Atkinson Hyperlegible', sans-serif;
--sk-font-size-body: 2rem;
--sk-font-size-body-small: 1.8rem;

p code {
font-size: 0.75em;
}
}
}

@media screen and (min-width: 480px) {
Expand Down

0 comments on commit 082ad3c

Please sign in to comment.