Improve table for numeric tabular data

Make row headers out of the first column cells
for better semantics and accessibility.

As our current default for `th` is bold
and that looked weird with the longer content which was in those cells,
this changes the content to an example which has shorter row headers.
It also changes to an example which is clearer out of context.

app/views/snippets/data_table_numeric.html

@@ -1,26 +1,36 @@
 <table>
   <thead>
     <tr>
-      <th scope="col">Date</th>
-      <th class="numeric" scope="col">Paper form</th>
-      <th class="numeric" scope="col">Digital</th>
+      <th scope="col">Month you apply</th>
+      <th class="numeric" scope="col">Months valid for</th>
+      <th class="numeric" scope="col">Rate for vehicles</th>
+      <th class="numeric" scope="col">Rate for bicycles</th>
     </tr>
   </thead>
   <tbody>
     <tr>
-      <td>25 November to 1 December 2013</td>
-      <td class="numeric">2,763</td>
-      <td class="numeric">1,792</td>
+      <th scope="row">January</th>
+      <td class="numeric">12</td>
+      <td class="numeric">£165.00</td>
+      <td class="numeric">£85.00</td>
     </tr>
     <tr>
-      <td>2 to 8 December 2013</td>
-      <td class="numeric">2,850</td>
-      <td class="numeric">1,740</td>
+      <th scope="row">February</th>
+      <td class="numeric">11</td>
+      <td class="numeric">£165.00</td>
+      <td class="numeric">£85.00</td>
     </tr>
     <tr>
-     <td>9 to 15 December 2013</td>
-      <td class="numeric">2,388</td>
-      <td class="numeric">1,683</td>
+      <th scope="row">March</th>
+      <td class="numeric">10</td>
+      <td class="numeric">£151.25</td>
+      <td class="numeric">£77.90</td>
+    </tr>
+    <tr>
+      <th scope="row">April</th>
+      <td class="numeric">9</td>
+      <td class="numeric">£136.10</td>
+      <td class="numeric">£70.10</td>
     </tr>
   </tbody>
 </table>