From 3c140ecdbf13a39a3a43970776dd8f2e5356f997 Mon Sep 17 00:00:00 2001
From: Chris Hill-Scott <me@quis.cc>
Date: Fri, 28 Feb 2020 15:41:59 +0000
Subject: [PATCH] Add some subheadings

This helps differentiate the totals from the rest of the page, and it
harmonises it with the per-service usage page.
---
 .../views/organisations/organisation/index.html  | 16 ++++++++++------
 .../views/organisations/test_organisation.py     |  8 ++++----
 2 files changed, 14 insertions(+), 10 deletions(-)

diff --git a/app/templates/views/organisations/organisation/index.html b/app/templates/views/organisations/organisation/index.html
index 186a431d7..b44402bc3 100644
--- a/app/templates/views/organisations/organisation/index.html
+++ b/app/templates/views/organisations/organisation/index.html
@@ -12,46 +12,50 @@
     Usage
   </h1>
 
-  <div class="bottom-gutter-3-2">
+  <div class="bottom-gutter">
     {{ pill(years, selected_year, big_number_args={'smallest': True}) }}
   </div>
 
   <div class="govuk-grid-row bottom-gutter">
     <div class="govuk-grid-column-one-third">
+      <h2 class="heading-small">Emails</h2>
       <div class="keyline-block">
         {{ big_number(
           total_emails_sent,
-          label='emails sent',
+          label='sent',
           smaller=True
         ) }}
       </div>
     </div>
     <div class="govuk-grid-column-one-third">
+      <h2 class="heading-small">Text messages</h2>
       <div class="keyline-block">
         {{ big_number(
           total_sms_cost,
-          'spent on text messages',
+          'spent',
           currency="£",
           smaller=True
         ) }}
       </div>
     </div>
     <div class="govuk-grid-column-one-third">
+      <h2 class="heading-small">Letters</h2>
       <div class="keyline-block">
         {{ big_number(
           total_letter_cost,
-          'spent on letters',
+          'spent',
           currency="£",
           smaller=True
         ) }}
       </div>
     </div>
   </div>
+  <h2 class="heading-small">By service</h2>
   {% for service in services %}
     <div class="keyline-block govuk-!-margin-top-2">
-      <h2 class="govuk-!-font-weight-bold govuk-!-font-size-24 govuk-!-margin-bottom-1 govuk-!-margin-top-1">
+      <h3 class="govuk-!-font-weight-bold govuk-!-font-size-24 govuk-!-margin-bottom-1 govuk-!-margin-top-1">
         <a href="{{ url_for('main.usage', service_id=service.service_id) }}" class="govuk-link govuk-link--no-visited-state browse-list-link">{{ service.service_name  }}</a>
-      </h2>
+      </h3>
       <div class="govuk-grid-row">
         <div class="govuk-grid-column-one-third">
           {{ big_number(
diff --git a/tests/app/main/views/organisations/test_organisation.py b/tests/app/main/views/organisations/test_organisation.py
index afb1bb526..6a801beed 100644
--- a/tests/app/main/views/organisations/test_organisation.py
+++ b/tests/app/main/views/organisations/test_organisation.py
@@ -414,14 +414,14 @@ def test_organisation_services_shows_live_services_and_usage(
     page = client_request.get('.organisation_dashboard', org_id=ORGANISATION_ID)
     mock.assert_called_once_with(ORGANISATION_ID, 2019)
 
-    services = page.select('main h2')
+    services = page.select('main h3')
     usage_rows = page.select('main .govuk-grid-column-one-third')
     assert len(services) == 2
 
     # Totals
-    assert normalize_spaces(usage_rows[0].text) == "33,000 emails sent"
-    assert normalize_spaces(usage_rows[1].text) == "£43.93 spent on text messages"
-    assert normalize_spaces(usage_rows[2].text) == "£30.50 spent on letters"
+    assert normalize_spaces(usage_rows[0].text) == "Emails 33,000 sent"
+    assert normalize_spaces(usage_rows[1].text) == "Text messages £43.93 spent"
+    assert normalize_spaces(usage_rows[2].text) == "Letters £30.50 spent"
 
     assert normalize_spaces(services[0].text) == '1'
     assert normalize_spaces(services[1].text) == '5'