Cleaned up header and text styling a bit on mobile

diff --git a/themes/bookstack/sass/_header.scss b/themes/bookstack/sass/_header.scss
index dfe033a34347b9580da537466b29a686e01f8b24..3db105a9074532789a5d5f8a1534999293c291c4 100644 (file)
--- a/themes/bookstack/sass/_header.scss
+++ b/themes/bookstack/sass/_header.scss
@@ -37,6 +37,9 @@
   }
   .menu {
     padding-top: 8px;
+    @include smaller-than($m) {
+      padding-top: 0;
+    }
   }
 }
 
@@ -59,7 +62,9 @@
     height: 43px;
     width: auto;
   }
+
   @include smaller-than($s) {
+    margin: $-s 0;
     h1 {
       font-size: 1.8em;
     }
@@ -68,8 +73,10 @@
       margin-right: $-s;
     }
   }
+
   a {
-    display: inline-block;
+    display: inline-flex;
+    align-items: center;
   }
   a:hover {
     text-decoration: none;

diff --git a/themes/bookstack/sass/_text.scss b/themes/bookstack/sass/_text.scss
index 35c75e7e47b7b5234559e4b654a1e1eaac978af1..2d0d559e8f2a48a4ab7253dbb888aec4bb9b8bfe 100644 (file)
--- a/themes/bookstack/sass/_text.scss
+++ b/themes/bookstack/sass/_text.scss
@@ -1,6 +1,7 @@
 /* roboto-300 - latin */
 @font-face {
   font-family: 'Roboto';
+  font-display: swap;
   font-style: normal;
   font-weight: 300;
   src: local('Roboto Light'), local('Roboto-Light'),
@@ -10,6 +11,7 @@
 /* roboto-regular - latin */
 @font-face {
   font-family: 'Roboto';
+  font-display: swap;
   font-style: normal;
   font-weight: 400;
   src: local('Roboto'), local('Roboto-Regular'),
@@ -19,6 +21,7 @@
 /* roboto-500 - latin */
 @font-face {
   font-family: 'Roboto';
+  font-display: swap;
   font-style: normal;
   font-weight: 500;
   src: local('Roboto Medium'), local('Roboto-Medium'),
@@ -28,6 +31,7 @@
 /* roboto-700 - latin */
 @font-face {
   font-family: 'Roboto';
+  font-display: swap;
   font-style: normal;
   font-weight: 700;
   src: local('Roboto Bold'), local('Roboto-Bold'),
@@ -109,6 +113,21 @@ a, .link {
   }
 }
 
+@include smaller-than($m) {
+  h1 {
+    font-size: 2.666em;
+  }
+  h2 {
+    font-size: 2.2222em;
+  }
+  h3 {
+    font-size: 1.6666em;
+  }
+  h4 {
+    font-size: 1.3333em;
+  }
+}
+
 /*
  * Other HTML Text Elements
  */

diff --git a/themes/bookstack/sass/styles.scss b/themes/bookstack/sass/styles.scss
index 593bf30554031a76e543e339e021a1c50d6a9e2c..f1b747cd3232d8f3cfd791b085fa3cb4c15347ff 100644 (file)
--- a/themes/bookstack/sass/styles.scss
+++ b/themes/bookstack/sass/styles.scss
@@ -319,6 +319,13 @@ input[type=text] {
   }
 }
 
+@include smaller-than($m) {
+  .sidebar li a {
+    padding: $-xs 0;
+    display: block;
+  }
+}
+
 
 
 h2.thin-margin {