aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorBryan Brattlof <hello@bryanbrattlof.com>2020-04-26 10:12:51 -0400
committerBryan Brattlof <hello@bryanbrattlof.com>2020-04-26 11:20:10 -0400
commita9725e8ac4c39db8eb435c4f24b9e33713b38928 (patch)
tree198810148b1b4e6741b4b76de70ac8f02e1318ff
parent33988d5a36b640a1966a5907c40e1b7c0d3fd4d3 (diff)
downloadbryanbrattlof.com-a9725e8ac4c39db8eb435c4f24b9e33713b38928.tar.gz
bryanbrattlof.com-a9725e8ac4c39db8eb435c4f24b9e33713b38928.tar.bz2
remove default font-sizes
almost every browser has this set to 16px. removing the 16px and switching to using 'em' and 'rem' units simplifies the typography considerably
-rw-r--r--stylesheets/base/base.scss6
-rw-r--r--stylesheets/base/variables.scss4
-rw-r--r--stylesheets/code.scss1
3 files changed, 3 insertions, 8 deletions
diff --git a/stylesheets/base/base.scss b/stylesheets/base/base.scss
index 5c18c8f..0909cfa 100644
--- a/stylesheets/base/base.scss
+++ b/stylesheets/base/base.scss
@@ -17,12 +17,10 @@ body {
padding: 0;
margin: 0 20px;
- font-size: $mobile-font-size;
- @include breakpoint-min(600px) {
- font-size: $font-size;
+ @include breakpoint-max(600px) {
+ font-size: $mobile-font-size;
}
@include print {
- font-size: $print-font-size;
font-color: $print-font-color;
margin: 0;
}
diff --git a/stylesheets/base/variables.scss b/stylesheets/base/variables.scss
index 8cece91..fbda6f7 100644
--- a/stylesheets/base/variables.scss
+++ b/stylesheets/base/variables.scss
@@ -6,9 +6,7 @@ $title-font: sans-serif !default;
$display-font: serif !default;
$code-font: monospace !default;
-$print-font-size: 12px !default;
-$mobile-font-size: 14px !default;
-$font-size: 16px !default;
+$mobile-font-size: .75em !default;
$line-height: 1.75 !default;
$bold-font-weight: 700 !default;
diff --git a/stylesheets/code.scss b/stylesheets/code.scss
index 2470a75..d37addb 100644
--- a/stylesheets/code.scss
+++ b/stylesheets/code.scss
@@ -8,7 +8,6 @@
white-space: pre-wrap;
font-family: $code-font, $code-font;
- font-size: 1em;
}
%code-italic { font-style: italic; }