bundle update
.bundle exec jekyll build
.Yes. Edit the following variables in _sass/_variables.scss
.
/* system typefaces */
$serif : Georgia, Times, serif !default;
$sans-serif : -apple-system, BlinkMacSystemFont, "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif !default;
$monospace : Monaco, Consolas, "Lucida Console", monospace !default;
/* sans serif typefaces */
$sans-serif-narrow : $sans-serif !default;
$helvetica : Helvetica, "Helvetica Neue", Arial, sans-serif !default;
/* serif typefaces */
$georgia : Georgia, serif !default;
$times : Times, serif !default;
$bodoni : "Bodoni MT", serif !default;
$calisto : "Calisto MT", serif !default;
$garamond : Garamond, serif !default;
$global-font-family : $sans-serif !default;
$header-font-family : $sans-serif !default;
$caption-font-family : $serif !default;
/* type scale */
$type-size-1 : 2.441em !default; // ~39.056px
$type-size-2 : 1.953em !default; // ~31.248px
$type-size-3 : 1.563em !default; // ~25.008px
$type-size-4 : 1.25em !default; // ~20px
$type-size-5 : 1em !default; // ~16px
$type-size-6 : 0.75em !default; // ~12px
$type-size-7 : 0.6875em !default; // ~11px
$type-size-8 : 0.625em !default; // ~10px
Thanks
Is this still the preferred method for modifying the size of font for the body of a post? Adjusting the variables does change the font size for some elements, like the title, but not the main body text. When I inspect a section of rendered text it appears that the font size is hardcoded at _1em_:
From __page.scss_:
.page__content {
h2 {
padding-bottom: 0.5em;
border-bottom: 1px solid $border-color;
}
p,
li,
dl {
font-size: 1em;
}
@PingTrip See #1219, you don't want to mess with the .page_content
font-sizes directly.
The base font-size scales up and down depending on the viewport size. You'll want to modify these values so all of the type across the entire page scales proportionally with each other.
I'm having the same issue. After seeing 3 different threads about changing the font-size, it's still unclear to me what I should do.
I would like to reduce the main body fonts on large screens (ideally while proportionally reducing headers, code, etc. as well), everything else can stay.
Changing the "type-size" variables doesn't change anything for me, and changing the breakpoints in _reset.scss
makes everything smaller, which I don't really want.
Most helpful comment
Yes. Edit the following variables in
_sass/_variables.scss
.