From 6797ac6d98af08adcd20ba75a568b1bb037c19fe Mon Sep 17 00:00:00 2001 From: Ian Weller Date: Wed, 13 Apr 2016 10:32:38 -0400 Subject: [PATCH] updating the font resizing for mobile view --- css/app.css | 10 ++++++++-- scss/_main.scss | 6 ++++++ scss/_settings.scss | 4 ++-- 3 files changed, 16 insertions(+), 4 deletions(-) diff --git a/css/app.css b/css/app.css index 43e1ef5..a626493 100644 --- a/css/app.css +++ b/css/app.css @@ -4855,10 +4855,10 @@ h1, h2, h3, h4, h5, h6 { line-height: 0; } h1 { - font-size: 2.6875rem; } + font-size: 2.5625rem; } h2 { - font-size: 2.6875rem; } + font-size: 2.4375rem; } h3 { font-size: 1.6875rem; } @@ -6560,10 +6560,16 @@ main.page-inside #content-wrapper #main-content h1 { font-weight: bold; letter-spacing: 0.05em; color: #0568b3; } + @media only screen and (max-width: 40em) { + main.page-inside #content-wrapper #main-content h1 { + font-size: 2.4375rem; } } main.page-inside #content-wrapper #main-content h2 { font-size: 1.5rem; letter-spacing: 0.1em; color: #f5822a; } + @media only screen and (max-width: 40em) { + main.page-inside #content-wrapper #main-content h2 { + font-size: 1.375rem; } } h2#block-title { text-transform: uppercase; diff --git a/scss/_main.scss b/scss/_main.scss index 9184745..8384d87 100644 --- a/scss/_main.scss +++ b/scss/_main.scss @@ -56,11 +56,17 @@ main.page-inside { font-weight: bold; letter-spacing: 0.05em; color: $blue; + @media #{$small-only}{ + font-size: rem-calc(39); + } } h2 { font-size: rem-calc(24); letter-spacing: 0.1em; color: $orange; + @media #{$small-only}{ + font-size: rem-calc(22); + } } } } diff --git a/scss/_settings.scss b/scss/_settings.scss index be9e8cb..13e8f8d 100644 --- a/scss/_settings.scss +++ b/scss/_settings.scss @@ -228,8 +228,8 @@ $h5-font-size: rem-calc(24); $h6-font-size: rem-calc(22); // We use these to control header size reduction on small screens -$h1-font-reduction: rem-calc(9); -$h2-font-reduction: rem-calc(5); +$h1-font-reduction: rem-calc(11); +$h2-font-reduction: rem-calc(9); $h3-font-reduction: rem-calc(5); $h4-font-reduction: rem-calc(2); $h5-font-reduction: rem-calc(2); -- 2.17.1