Fix pager and header in tutorial

Author: Matthieu Oger

_layouts/tutorial.html

@@ -35,7 +35,7 @@
       <div class="pager pager--top-separator pager--em">
         <section class="pager__older">
         {% if page.links.previous %}
-          <a href="{{ page.links.previous }}" title="Previous chapter">← Previous</a>
+          <a href="{{ page.links.previous }}" title="Previous chapter">← Prev.</a>
         {% endif %}
         </section>
 
@@ -79,7 +79,7 @@ <h2 class="entry__title">
       <div class="pager pager--bottom-separator pager--em">
         <section class="pager__older">
         {% if page.links.previous %}
-          <a href="{{ page.links.previous }}" title="Previous chapter">← Previous</a>
+          <a href="{{ page.links.previous }}" title="Previous chapter">← Prev.</a>
         {% endif %}
         </section>
 

_sources/tutorial.scss

@@ -12,6 +12,11 @@
 
     font-size: 0.8em;
 
+    // Decrease the font a bit on small screen
+    @media only screen and (max-width: $phone) {
+      font-size: 0.6em;
+    }
+
     nav {
       display: table;
       width: 100%;

static/css/pixelnest.css

@@ -617,6 +617,9 @@ li {
   padding: 12px 10px;
   background-color: rgba(240, 240, 240, 0.8);
   font-size: 0.8em; }
+  @media only screen and (max-width: 600px) {
+    .tutorial .page-header {
+      font-size: 0.6em; } }
   .tutorial .page-header nav {
     display: table;
     width: 100%; }