src/_includes/donations-current.html

@@ -1,5 +1,5 @@
-{{locale}}
-<table class="table">
+<div class="table-container">
+    <table class="table">
         <thead>
         <tr>
             <th>{{strings.date[locale]}}</th>
@@ -32,4 +32,5 @@
             <th>{{donations[0].donations | sum | amount}} €</th>
         </tr>
         </tfoot>
-</table>
+    </table>
+</div>

src/_includes/donations.html

@@ -1,7 +1,8 @@
 {% for year in donations %}
 <h2>{{year.year}}</h2>
 
-<table class="table">
+<div class="table-container">
+    <table class="table">
         <thead>
         <tr>
             <th>{{strings.date[locale]}}</th>
@@ -34,5 +35,6 @@
             <th>{{year.donations | sum | amount}} €</th>
         </tr>
         </tfoot>
-</table>
+    </table>
+</div>
 {% endfor %}

src/_includes/expenses-current.html

@@ -1,4 +1,5 @@
-<table class="table">
+<div class="table-container">
+    <table class="table">
         <thead>
         <tr>
             <th>{{strings.name[locale]}}</th>
@@ -30,4 +31,5 @@
             <th>{{expenses | sum | year | amount}} €</th>
         </tr>
         </tfoot>
-</table>
+    </table>
+</div>

src/scss/main.scss

@@ -270,6 +270,10 @@ pre {
   }
 }
 
+.table-container {
+  overflow-y: auto;
+}
+
 table.table {
   width: 100%;
   margin-bottom: 16px;