Use a <caption> for the template statistics table

This is semantically more accurate because it’s describing the whole
table, not just the first column.

Adjusting the font-size to make it sit within the ‘In the last 7 days’
section. Adjusting the spacing because now that we have more borders we
don’t need quite so much whitespace to separate different bits of the
page.

app/assets/stylesheets/components/show-more.scss

@@ -4,7 +4,7 @@
   @include core-16;
   display: block;
   padding: 0 0;
-  margin: $gutter-half 0 $gutter 0;
+  margin: $gutter-half 0 $gutter-half 0;
   text-align: center;
   border-top: 1px solid $border-colour;
 

app/assets/stylesheets/components/table.scss

@@ -57,8 +57,9 @@
     table-layout: fixed;
   }
 
-  .table-field-heading {
-    font-size: 0;
+  .table-heading {
+    @include core-19;
+    margin: 0 0 10px 0;
   }
 
   .table-field-heading-first {

app/templates/views/dashboard/template-statistics.html

@@ -9,14 +9,14 @@
     <div class='template-statistics-table'>
       {% call(item, row_number) list_table(
         template_statistics,
-        caption="Templates used",
-        caption_visible=False,
+        caption="By template",
+        caption_visible=True,
         empty_message='',
         field_headings=[
           'Template',
           'Messages sent'
         ],
-        field_headings_visible=True
+        field_headings_visible=False
       ) %}
 
         {% call row_heading() %}