max-widths adjusted for tablet and mobile breakpoints

max-widths adjusted for tablet and mobile breakpoints - improved UX for lower screen resolutions.
Kellenkjames · Jun 23, 2020 · 370b220 · 370b220
1 parent 6533ec8
commit 370b220
Show file tree

Hide file tree

Showing 4 changed files with 6 additions and 6 deletions.
diff --git a/css/styles.css b/css/styles.css
diff --git a/scss/base/_spacings.scss b/scss/base/_spacings.scss
@@ -32,7 +32,7 @@
     }
 
     @media (max-width: $bp-mobile-sm) {
-        max-width: 30rem;
+        max-width: 37rem;
     }
 
     @media (max-width: $bp-mobile-xs) {

diff --git a/scss/component/_card.scss b/scss/component/_card.scss
@@ -65,7 +65,7 @@
             }
 
             @media (max-width: $bp-tablet-lg) {
-                font-size: 1.5rem;
+                font-size: 1.4rem;
             }
 
             @media (max-width: $bp-tablet) {

diff --git a/scss/component/_header.scss b/scss/component/_header.scss
@@ -29,7 +29,7 @@
     }
 
     @media (max-width: $bp-mobile-sm) {
-        max-width: 30rem;
+        max-width: 37rem;
     }
 
     @media (max-width: $bp-mobile-xs) {