From 1667996716888c1df6733c68df0620038dd37541 Mon Sep 17 00:00:00 2001 From: Chris Hill-Scott Date: Fri, 3 Jun 2016 16:55:59 +0100 Subject: [PATCH 1/3] Make it clearer what Notify is for from homepage Uses some graphic design to communicate what Notify is: - for sending messages to lots of people - messages can be personalised --- app/assets/stylesheets/components/banner.scss | 67 +++++++++++++++---- app/assets/stylesheets/components/phone.scss | 40 +++++++++++ app/assets/stylesheets/main.scss | 1 + app/templates/components/phone.html | 16 +++++ app/templates/views/register.html | 3 - app/templates/views/signedout.html | 63 ++++++++++++----- 6 files changed, 157 insertions(+), 33 deletions(-) create mode 100644 app/assets/stylesheets/components/phone.scss create mode 100644 app/templates/components/phone.html diff --git a/app/assets/stylesheets/components/banner.scss b/app/assets/stylesheets/components/banner.scss index 583026dba..97154f5fd 100644 --- a/app/assets/stylesheets/components/banner.scss +++ b/app/assets/stylesheets/components/banner.scss @@ -109,13 +109,65 @@ } +.banner-intro { + + margin: $gutter 0 -90px 0; + padding: $gutter-half $gutter; + background: $govuk-blue; + color: $white; + overflow: hidden; + + .heading-medium { + @include core-24; + } + + a { + &:link, + &:visited { + color: $white; + } + + &:hover, + &:active { + color: $light-blue-25; + } + } + + .button-block { + line-height: 3.68em; + } + + .button { + + @include core-19; + background: $white; + padding: 0.3684210526em 0.8421052632em 0.2105263158em 0.7421052632em; + display: inline-block; + margin-top: $gutter-half; + margin-right: 0.3em; + box-shadow: 0 2px 0 mix($govuk-blue, $text-colour); + + &:link, + &:visited, + &:hover { + color: $govuk-blue; + } + + &:hover { + background: $light-blue-25; + outline: none; + } + + } + +} + .banner-tour { @extend %banner; background: $govuk-blue; color: $white; margin-top: $gutter; - margin-bottom: $gutter * -3; padding: $gutter; height: 475px; overflow: hidden; @@ -166,17 +218,4 @@ } - th { - padding: inherit 5px; - background: $grey-3; - border-left: 5px solid $grey-3; - border-right: 5px solid $grey-3; - } - - tr:last-child { - td { - border: none; - } - } - } diff --git a/app/assets/stylesheets/components/phone.scss b/app/assets/stylesheets/components/phone.scss new file mode 100644 index 000000000..97f22fbba --- /dev/null +++ b/app/assets/stylesheets/components/phone.scss @@ -0,0 +1,40 @@ +.phone { + + background: $black; + border-radius: 15px; + padding: 15px; + + &-speaker { + margin: 5px auto 20px; + border-radius: 5px; + width: 30px; + height: 7px; + background: rgba($white, 0.2); + } + + &-screen { + background: $white; + color: $black; + min-height: 377px; + border-radius: 1px; + } + + &-recipient { + @include core-16($tabular-numbers: true); + margin: 0 0 5px 7px; + padding-top: 10px; + color: $secondary-text-colour; + } + + &-sms { + padding: 10px; + margin: 10px; + background: $panel-colour; + border-radius: 5px; + } + +} + +.phone-container { + margin-bottom: -200px; +} diff --git a/app/assets/stylesheets/main.scss b/app/assets/stylesheets/main.scss index b6cc06f93..f4b29ea9f 100644 --- a/app/assets/stylesheets/main.scss +++ b/app/assets/stylesheets/main.scss @@ -52,6 +52,7 @@ $path: '/static/images/'; @import 'components/secondary-button'; @import 'components/show-more'; @import 'components/message'; +@import 'components/phone'; @import 'views/job'; @import 'views/edit-template'; diff --git a/app/templates/components/phone.html b/app/templates/components/phone.html new file mode 100644 index 000000000..dd1b72607 --- /dev/null +++ b/app/templates/components/phone.html @@ -0,0 +1,16 @@ +{% macro phone(recipient, message) %} +
+
+
+

+ + To: {{recipient}} +

+
+ {{ message }} +
+
+
+{% endmacro %} diff --git a/app/templates/views/register.html b/app/templates/views/register.html index efff07fde..ff76eb4c8 100644 --- a/app/templates/views/register.html +++ b/app/templates/views/register.html @@ -11,9 +11,6 @@ Create an account – GOV.UK Notify

Create an account

- -

If you’ve used GOV.UK Notify before, sign in to your account

-
{{ textbox(form.name, width='3-4') }} {{ textbox(form.email_address, hint="Must be from a central government organisation", width='3-4', safe_error_message=True) }} diff --git a/app/templates/views/signedout.html b/app/templates/views/signedout.html index f16afaec6..671f6dd7b 100644 --- a/app/templates/views/signedout.html +++ b/app/templates/views/signedout.html @@ -1,3 +1,6 @@ +{% from "components/banner.html" import banner_wrapper %} +{% from "components/phone.html" import phone %} + {% extends "withoutnav_template.html" %} {% block page_title %} @@ -6,23 +9,51 @@ {% block maincolumn_content %} -
-
-

GOV.UK Notify

-

- Making it easy to send text messages and emails to your users. + {% call banner_wrapper(type='intro') %} +

+ GOV.UK Notify makes it easy to send text messages and emails to + your users. +

+

+ If you work for a UK government department or agency you can try + it now.

-

- If you work for a UK government department or agency you can try it now. +

+ + Create an account + + or sign in if you’ve used + it before

-

- Set up an account -

-

- If you’ve used GOV.UK Notify before, sign in to your account. -

- -
-
+
+
+ {{ phone( + "07900911111", + """ + Joshua, we’ve started processing your application. + You should hear back from us within two weeks. + """ + ) }} +
+
+ {{ phone( + "07900922222", + """ + Amala, we’ve started processing your application. + You should hear back from us within two weeks. + """ + ) }} +
+
+ {{ phone( + "07900933333", + """ + Roman, we’ve started processing your application. + You should hear back from us within two weeks. + """ + ) }} +
+
+ {% endcall %} {% endblock %} From 18963f4645bd9c84e07cd7cf9d80efa9ff0189cf Mon Sep 17 00:00:00 2001 From: Chris Hill-Scott Date: Tue, 21 Jun 2016 09:40:04 +0100 Subject: [PATCH 2/3] Redirect to homepage after signout --- app/main/views/sign_out.py | 2 +- tests/app/main/views/test_sign_out.py | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/app/main/views/sign_out.py b/app/main/views/sign_out.py index 3388fcc45..42ddefdd7 100644 --- a/app/main/views/sign_out.py +++ b/app/main/views/sign_out.py @@ -13,4 +13,4 @@ from app.main import main def sign_out(): session.clear() logout_user() - return redirect(url_for('main.sign_in')) + return redirect(url_for('main.index')) diff --git a/tests/app/main/views/test_sign_out.py b/tests/app/main/views/test_sign_out.py index 33ebc067e..11dd86a96 100644 --- a/tests/app/main/views/test_sign_out.py +++ b/tests/app/main/views/test_sign_out.py @@ -7,7 +7,7 @@ def test_render_sign_out_redirects_to_sign_in(app_): url_for('main.sign_out')) assert response.status_code == 302 assert response.location == url_for( - 'main.sign_in', _external=True) + 'main.index', _external=True) def test_sign_out_user(app_, @@ -34,6 +34,6 @@ def test_sign_out_user(app_, response = client.get(url_for('main.sign_out')) assert response.status_code == 302 assert response.location == url_for( - 'main.sign_in', _external=True) + 'main.index', _external=True) with client.session_transaction() as session: assert session.get('user_id') is None From 41ef6de6666d881ce04e59a24674622fbbb11c1a Mon Sep 17 00:00:00 2001 From: Chris Hill-Scott Date: Wed, 22 Jun 2016 14:36:20 +0100 Subject: [PATCH 3/3] Add a reference number to the example texts To show that the personalisation can include any kind of information, not just name. --- app/templates/views/signedout.html | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/app/templates/views/signedout.html b/app/templates/views/signedout.html index 671f6dd7b..b9158511e 100644 --- a/app/templates/views/signedout.html +++ b/app/templates/views/signedout.html @@ -31,7 +31,7 @@ "07900911111", """ Joshua, we’ve started processing your application. - You should hear back from us within two weeks. + Your reference number is 300312. """ ) }}
@@ -40,7 +40,7 @@ "07900922222", """ Amala, we’ve started processing your application. - You should hear back from us within two weeks. + Your reference number is 444250. """ ) }}
@@ -49,7 +49,7 @@ "07900933333", """ Roman, we’ve started processing your application. - You should hear back from us within two weeks. + Your reference number is 568821. """ ) }}