From 26adcc64c170313326528f6c2634df54dd5a5def Mon Sep 17 00:00:00 2001
From: Chris Hill-Scott <me@quis.cc>
Date: Thu, 4 Feb 2016 12:20:24 +0000
Subject: [PATCH] =?UTF-8?q?Updates=20to=20=E2=80=98send=20SMS=E2=80=99=20p?=
 =?UTF-8?q?age?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Based on discussion with Pete.

Make the blue banner an ‘important’ banner (copied from Register to Vote, used
because it’s not as boxy and fits on the page better).

Remove the back button because you haven’t changed any data yet. If you need to
go back you can just press back or start again.

Make the filename stand out more.

Remove the ‘download example’ link. Will need to revist the best way of doing
this.

Make text messages consistently 2/3rd width.
---
 app/assets/images/icon-important-2x.png       | Bin 0 -> 918 bytes
 app/assets/stylesheets/components/banner.scss |  11 +++++++++++
 .../stylesheets/components/file-upload.scss   |   1 +
 app/assets/stylesheets/main.scss              |   3 +++
 app/main/forms.py                             |   2 +-
 app/main/views/add_service.py                 |   4 ++--
 app/main/views/dashboard.py                   |   2 +-
 app/templates/components/file-upload.html     |   4 ++--
 app/templates/views/add-service.html          |   5 +++--
 app/templates/views/check-sms.html            |  10 +++++++---
 app/templates/views/job.html                  |   2 +-
 app/templates/views/manage-templates.html     |   2 +-
 app/templates/views/send-sms.html             |  18 ++++++++----------
 13 files changed, 41 insertions(+), 23 deletions(-)
 create mode 100644 app/assets/images/icon-important-2x.png

diff --git a/app/assets/images/icon-important-2x.png b/app/assets/images/icon-important-2x.png
new file mode 100644
index 0000000000000000000000000000000000000000..c04e9c2c942b611fd885f4a2ba48f2c43d7a3dcf
GIT binary patch
literal 918
zcmeAS@N?(olHy`uVBq!ia0vp^E+EXo3?%u_CO0rJFmea@gt-3y{~stq3jj1ZH8nLi
zH}~@8%V}w8j~+dG`SRt54<F8)Idk;r(Y<^3PMkP#{rdIGmoHziV8P6pGq-Kq_T$Ho
zuCA`;=H}|^>XMR@@bK`sxHx8J=74~JTeoiAzI|I>UY?7KOGHG3m6f%=zW&XdH+Syb
z2?`2gWMtgEdv`@e#jjt#baZr%963@~SNG}Dr`4-h_w@8knl#DB$45|5@Y%Cx8#iv$
z)YLqE`t+hji}?BZSy)(XZEXt*3UqaKuXuHQ2L^;}NswPKgUa^c)%QQLpI`9kr_qe}
zHgDJ(ekh-b`B&Hx(%e!cH!qxlfl1cW#WAEJZtacsb&m`LS|1v!Ou69HaDdhC!MA&_
zzul|8|Gj?FRio<GmJfy}e%l^c?=jIvu6wR0yQ5~0_EZZU*5)fGHg)|iYLN`w89(J{
zXm;tD(Dk9IhP^T!G0t~-)FO^?T=$78$WrxHyd|r%<g(c68b)rdCr1}uKYD1F?aXXe
z??^@7^<MnmuTS>Wh<m?&mi}+;)BQcy)ZAvQzA#NQv&`Urp;=+iPb=S<UI`mlPV|jX
zx!jg{Fv(e2dP9cf&Z*63ce!0loGh%$8*%sI3EnkQ=lBn<atnL-Yl_yJZ6=#ot!-at
zZMc2ygxQ;{$;LbRcFXp@Ij}BHWTIV%a<5F|i*66eBlFz8IZSa?VcNKUVy(c$4#wgI
z6PXR%f(+WFELkR>5;(KYt?VF=3PbUtiNXerQx43@dLrWE>12>DWyvh;#q%si`FTRp
z$_B~o6rN>|I@V;SJn1-+pl4ddsWwgEOskvTftJ4bnza+N4OBS~#N3^|gGu;=z&*A}
zhoZIE?)7-Eyn9z$F!6Oo&4&+x(`@UQmc6l9G2iaA+Pvly)^5ivg7xDrO+46sef699
z*Gnos8vc4__UW3bo9gjrJFDE;t@cOl+232UAe{T3ro4UTW8<F!-%DSgzP`UV|NhTX
zZ`BPyKYqUc!hDU;bI~hnFPFr&-Q{}wzfSjiyuhDu(f><N*4KWHSNR(rb*OmfxA@P0
s<z@cNxBDZXXfc^@`FTg@Z!%xl&DJg4{y4|i6_m9+UHx3vIVCg!0KaIAx&QzG

literal 0
HcmV?d00001

diff --git a/app/assets/stylesheets/components/banner.scss b/app/assets/stylesheets/components/banner.scss
index 75674611b..8b79307ab 100644
--- a/app/assets/stylesheets/components/banner.scss
+++ b/app/assets/stylesheets/components/banner.scss
@@ -82,3 +82,14 @@
   }
 
 }
+
+.banner-important {
+  @extend %banner;
+  background: $white;
+  color: $text-colour;
+  background-image: file-url("icon-important-2x.png");
+  background-size: 34px 34px;
+  background-position: 0 0;
+  background-repeat: no-repeat;
+  padding: 7px 0 5px 50px;
+}
diff --git a/app/assets/stylesheets/components/file-upload.scss b/app/assets/stylesheets/components/file-upload.scss
index 8f75a8e4c..5750b24d8 100644
--- a/app/assets/stylesheets/components/file-upload.scss
+++ b/app/assets/stylesheets/components/file-upload.scss
@@ -29,6 +29,7 @@
     &-filename {
       display: inline-block;
       padding-left: $gutter-half;
+      @include bold-19;
     }
 
   }
diff --git a/app/assets/stylesheets/main.scss b/app/assets/stylesheets/main.scss
index 614b7c9c8..f04d61fce 100644
--- a/app/assets/stylesheets/main.scss
+++ b/app/assets/stylesheets/main.scss
@@ -1,3 +1,6 @@
+// Path to assets for use with file-url()
+$path: '/static/images/';
+
 // Dependencies from GOV.UK Frontend Toolkit
 // https://github.com/alphagov/govuk_frontend_toolkit/
 @import 'conditionals';
diff --git a/app/main/forms.py b/app/main/forms.py
index 9c6787548..a5e7f739c 100644
--- a/app/main/forms.py
+++ b/app/main/forms.py
@@ -217,7 +217,7 @@ class ChangePasswordForm(Form):
 
 
 class CsvUploadForm(Form):
-    file = FileField('Add your recipients by uploading a CSV file', validators=[DataRequired(
+    file = FileField('Add recipients', validators=[DataRequired(
                      message='Please pick a file'), CsvFileValidator()])
 
 
diff --git a/app/main/views/add_service.py b/app/main/views/add_service.py
index 27472bbc5..dc7a3a7d4 100644
--- a/app/main/views/add_service.py
+++ b/app/main/views/add_service.py
@@ -10,8 +10,8 @@ from app.main.forms import AddServiceForm
 def add_service():
     form = AddServiceForm(services_dao.find_all_service_names)
     services = services_dao.get_services(current_user.id)
-    if len(services) == 0:
-        heading = 'Set up notifications for your service'
+    if len(services['data']) == 0:
+        heading = 'Which service do you want to set up notifications for?'
     else:
         heading = 'Add a new service'
     if form.validate_on_submit():
diff --git a/app/main/views/dashboard.py b/app/main/views/dashboard.py
index fe3c9fd1b..86acf81c1 100644
--- a/app/main/views/dashboard.py
+++ b/app/main/views/dashboard.py
@@ -29,7 +29,7 @@ def service_dashboard(service_id):
     return render_template(
         'views/service_dashboard.html',
         jobs=list(reversed(jobs)),
-        free_text_messages_remaining='25,000',
+        free_text_messages_remaining='250,000',
         spent_this_month='0.00',
         template_count=len(templates),
         service_id=str(service_id))
diff --git a/app/templates/components/file-upload.html b/app/templates/components/file-upload.html
index 0c92c0f76..1451b0ee3 100644
--- a/app/templates/components/file-upload.html
+++ b/app/templates/components/file-upload.html
@@ -1,4 +1,4 @@
-{% macro file_upload(field) %}
+{% macro file_upload(field, button_text="Choose file") %}
   <div class="form-group{% if field.errors %} error{% endif %}" data-module="file-upload">
     <label class="file-upload-label" for="{{ field.name }}">
       {{ field.label }}
@@ -17,7 +17,7 @@
       'class': 'file-upload-field'
     }) }}
     <label class="file-upload-button" for="{{ field.name }}">
-      Choose file
+      {{ button_text }}
     </label>
     <label class="file-upload-filename" for="{{ field.name }}"></label>
   </div>
diff --git a/app/templates/views/add-service.html b/app/templates/views/add-service.html
index eb1e4af9c..27074cf92 100644
--- a/app/templates/views/add-service.html
+++ b/app/templates/views/add-service.html
@@ -16,7 +16,8 @@ GOV.UK Notify | Set up service
     </h1>
 
     <p>
-      Users will see your service name:
+      Users will see your service name when they receive messages through GOV.UK
+      Notify:
     </p>
 
     <ul class="list-bullet bottom-gutter">
@@ -30,7 +31,7 @@ GOV.UK Notify | Set up service
     </ul>
 
     <form autocomplete="off" method="post">
-      {{ textbox(form.name) }}
+      {{ textbox(form.name, hint="You can change this later") }}
       {{ page_footer('Continue') }}
     </form>
 
diff --git a/app/templates/views/check-sms.html b/app/templates/views/check-sms.html
index 419eb2fe3..61950804b 100644
--- a/app/templates/views/check-sms.html
+++ b/app/templates/views/check-sms.html
@@ -21,9 +21,13 @@
 
   {% else %}
 
-    {{ sms_message(
-      message_template|replace_placeholders(upload_result.valid[0])
-    )}}
+    <div class="grid-row">
+      <div class="column-two-thirds">
+        {{ sms_message(
+          message_template|replace_placeholders(upload_result.valid[0])
+        )}}
+      </div>
+    </div>
 
     <form method="POST" enctype="multipart/form-data">
       <input type="hidden" name="csrf_token" value="{{ csrf_token() }}" />
diff --git a/app/templates/views/job.html b/app/templates/views/job.html
index 0a2e86ca2..2891e73da 100644
--- a/app/templates/views/job.html
+++ b/app/templates/views/job.html
@@ -25,7 +25,7 @@
     <ul class="grid-row job-totals">
       <li class="column-one-quarter">
         {{ big_number(
-          counts.total, 'queued'
+          1, 'queued'
         )}}
       </li>
       <li class="column-one-quarter">
diff --git a/app/templates/views/manage-templates.html b/app/templates/views/manage-templates.html
index b6e0f2c83..a5c1519c9 100644
--- a/app/templates/views/manage-templates.html
+++ b/app/templates/views/manage-templates.html
@@ -14,7 +14,7 @@ GOV.UK Notify | Manage templates
 
     {% if not has_jobs %}
       {{ banner(
-        '<a href="{}">Try sending a text message</a>'.format(
+        '<a href="{}">Send yourself a text message</a>'.format(
           url_for(".choose_sms_template", service_id=service_id)
         )|safe,
         subhead='Next step',
diff --git a/app/templates/views/send-sms.html b/app/templates/views/send-sms.html
index e227a3185..2f5c62935 100644
--- a/app/templates/views/send-sms.html
+++ b/app/templates/views/send-sms.html
@@ -13,25 +13,23 @@
 
   <form method="POST" enctype="multipart/form-data">
 
-    {{ sms_message(template.content) }}
+    <div class="grid-row">
+      <div class="column-two-thirds">
+        {{ sms_message(template.content) }}
+      </div>
+    </div>
 
-    {{file_upload(form.file)}}
-
-    <p>
-      <a href="#">Download an example CSV file</a>
-    </p>
+    {{file_upload(form.file, button_text='Choose a CSV file')}}
 
     {{ banner(
       'You can only send messages to yourself until you <a href="{}">request to go live</a>'.format(
         url_for('.service_request_to_go_live', service_id=service_id)
       )|safe,
-      type='info'
+      type='important'
     ) }}
 
     {{ page_footer(
-      "Continue to preview",
-      back_link=url_for(".choose_sms_template", service_id=service_id),
-      back_link_text="Back"
+      "Continue to preview"
     ) }}
 
   </form>