Beautify substitution table:

- Mobile-optimize the upper box (and trim the text)
- adjust the position of the `print`-button
- some .idea changes
- hide some text on mobile phones

biscuit/apps/chronos/templates/timetable/substitution.html

@@ -7,10 +7,10 @@
 
 <main>
     <div class="row no-margin">
-        <div class="col s12 m6">
+        <div class="col s10 m6">
             <h4>Vertretungen</h4>
         </div>
-        <div class="col s12 m6 right align-right">
+        <div class="col s2 m6 right align-right print-icon">
             <a class="waves-effect waves-teal btn-flat btn-flat-medium right"
                href="
                     {% if debug %}
@@ -32,7 +32,7 @@
                         {% for row in header_info.rows %}
                             <div class="row no-margin">
                                 <div class="col s3">
-                                    <strong>{{ row.0 }}</strong>
+                                    <strong class="truncate">{{ row.0 }}</strong>
                                 </div>
                                 <div class="col s9">
                                     {{ row.1 }}
@@ -50,7 +50,7 @@
         </div>
     </div>
 
-    <h5>{{ date|date:"l, j. F Y" }}</h5>
+    <h5 class="hide-on-small-and-down">{{ date|date:"l, j. F Y" }}</h5>
 
     <table class="substitutions striped">
         <thead>