Various tweaks

- remove black border from banner
- make banners have internal columns
- make nav 2/3rd width, 19px text and more spaced out
- only show the ‘restricted mode’ banner where it’s needed
- rename ‘restricted mode’ to ‘trial mode’
This commit is contained in:
Chris Hill-Scott
2016-02-02 13:38:39 +00:00
parent 658045e6d7
commit 686c4127cd
14 changed files with 118 additions and 104 deletions

View File

@@ -1,6 +1,19 @@
{% macro banner(body, type=None, with_tick=False, delete_button=None) %}
{% macro banner(body, type=None, with_tick=False, delete_button=None, subhead=None) %}
<div class='banner{% if type %}-{{ type }}{% endif %}{% if with_tick %}-with-tick{% endif %}'>
{% if subhead %}
<div class="grid-row">
<div class="column-one-third">
{{ subhead }}
</div>
<div class="column-two-thirds">
{% endif %}
{{ body }}
{% if subhead %}
</div>
</div>
{% endif %}
{% if delete_button %}
<form method='post'>
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}" />

View File

@@ -22,6 +22,12 @@
developer documentation</a>.
</p>
{{ banner(
'You can only send notifications to yourself',
subhead='Trial mode',
type='info'
) }}
<h2 class="api-key-name">
Service ID
</h2>

View File

@@ -9,14 +9,19 @@ GOV.UK Notify | Manage templates
{% block maincolumn_content %}
<h1 class="heading-large">Templates</h1>
{{ banner(
'<a href="{}">Try sending a text message</a>'.format(
url_for(".send_sms", service_id=service_id)
)|safe,
subhead='Next step',
type="tip"
)}}
<div class="grid-row">
<div class="column-two-thirds">
<h1 class="heading-large">Templates</h1>
<p>
<a href="{{ url_for('.add_service_template', service_id=service_id) }}">Add new template</a>
{% for template in templates %}
{% if template.get_field('template_type') == 'sms' %}
{{ sms_message(
@@ -35,6 +40,10 @@ GOV.UK Notify | Manage templates
{% endif %}
{% endfor %}
<p>
<a href="{{ url_for('.add_service_template', service_id=service_id) }}" class="button">Add new template</a>
</p>
</div>
</div>

View File

@@ -10,37 +10,34 @@
{% block maincolumn_content %}
<form method="POST" enctype="multipart/form-data">
<div class="grid-row">
<div class="column-three-quarters">
<h1 class="heading-large">Send text messages</h1>
<fieldset class='form-group'>
<legend class="heading-medium">1. Choose text message template</legend>
{% for template in templates %}
{{ sms_message(
template.content, name=template.name, input_name='template', input_index=template.id
) }}
{% endfor %}
</fieldset>
<fieldset class='form-group'>
<legend class="heading-medium">1. Choose text message template</legend>
{% for template in templates %}
{{ sms_message(
template.content, name=template.name, input_name='template', input_index=template.id
) }}
{% endfor %}
</fieldset>
<h2 class="heading-medium">2. Add recipients</h2>
<h2 class="heading-medium">2. Add recipients</h2>
{{ banner(
'You can only send notifications to yourself',
subhead='Trial mode',
type='info'
) }}
<p>
Upload a CSV file to add your recipients details.
</p>
<p>
You can also <a href="#">download an example CSV</a>.
</p>
<p>
{{textbox(form.file)}}
</p>
<p>
Upload a CSV file to add your recipients details.
</p>
<p>
You can also <a href="#">download an example CSV</a>.
</p>
<p>
{{textbox(form.file)}}
</p>
{{ page_footer("Continue") }}
</div>
</div>
{{ page_footer("Continue") }}
</form>
{% endblock %}

View File

@@ -8,15 +8,6 @@
{% block maincolumn_content %}
{% if not has_templates %}
{{ banner(
'<a href="{}">Add a template</a> to start sending notifications'.format(
url_for(".add_service_template", service_id=service_id)
)|safe,
type="tip"
)}}
{% endif %}
<ul class="grid-row job-totals">
<li class="column-half">
{{ big_number(
@@ -32,24 +23,44 @@
</li>
</ul>
{% call(item) list_table(
[],
caption="Recent text messages",
empty_message='You havent sent any text messages yet',
field_headings=['Job', 'File', 'Time', 'Status']
) %}
{% call field() %}
<a href="{{ url_for('.view_job', service_id=service_id, job_id=456) }}">{{ item.file }}</a>
{% if not template_count %}
{{ banner(
'<a href="{}">Add a text message template</a>'.format(
url_for(".add_service_template", service_id=service_id)
)|safe,
subhead='Get started',
type="tip"
)}}
{% else %}
{{ banner(
'<a href="{}">Try sending a text message</a>'.format(
url_for(".send_sms", service_id=service_id)
)|safe,
subhead='Next step',
type="tip"
)}}
{% endif %}
{% if [] %}
{% call(item) list_table(
[],
caption="Recent text messages",
empty_message='You havent sent any text messages yet',
field_headings=['Job', 'File', 'Time', 'Status']
) %}
{% call field() %}
<a href="{{ url_for('.view_job', service_id=service_id, job_id=456) }}">{{ item.file }}</a>
{% endcall %}
{% call field() %}
<a href="{{ url_for('.view_job', service_id=service_id, job_id=456) }}">{{ item.job }}</a>
{% endcall %}
{% call field() %}
{{ item.time }}
{% endcall %}
{% call field() %}
{{ item.status }}
{% endcall %}
{% endcall %}
{% call field() %}
<a href="{{ url_for('.view_job', service_id=service_id, job_id=456) }}">{{ item.job }}</a>
{% endcall %}
{% call field() %}
{{ item.time }}
{% endcall %}
{% call field() %}
{{ item.status }}
{% endcall %}
{% endcall %}
{% endif %}
{% endblock %}

View File

@@ -35,15 +35,20 @@
</div>
{{ banner(
'Your service is in restricted mode. You can only send notifications to yourself.',
'info'
'You can only send notifications to yourself',
type='info',
subhead='Restricted mode'
) }}
{{ banner('Youre not allowed to do this', 'dangerous')}}
{{ banner('Are you sure you want to delete?', 'dangerous', delete_button="Yes, delete this thing")}}
{{ banner('<a href="#">Send your first message</a>'|safe, 'tip')}}
{{ banner(
'<a href="#">Send your first message</a>'|safe,
subhead='Get started',
type='tip'
)}}
<h2 class="heading-large">Big number</h2>

View File

@@ -12,16 +12,16 @@ GOV.UK Notify | Confirm email address and mobile number
<div class="column-two-thirds">
<h1 class="heading-large">Activate your account</h1>
<p>We've sent you confirmation codes by email and text message. You need to enter both codes here.</p>
<p>Weve sent you confirmation codes by email and text message. You need to enter both codes here.</p>
<form autocomplete="off" method="post">
{{ textbox(form.email_code) }}
<p>
<a href="{{ url_for('.check_and_resend_email_code')}}">I haven't received an email</a>
<a href="{{ url_for('.check_and_resend_email_code')}}">I havent received an email</a>
</p>
{{ textbox(form.sms_code) }}
<p>
<a href="{{ url_for('.check_and_resend_text_code') }}">I haven't received a text</a></span>
<a href="{{ url_for('.check_and_resend_text_code') }}">I havent received a text</a></span>
</p>
{{ page_footer("Continue") }}
</form>

View File

@@ -2,14 +2,10 @@
{% block fullwidth_content %}
<div class="grid-row">
<div class="column-one-quarter">
<div class="column-one-third">
{% include "main_nav.html" %}
</div>
<div class="column-three-quarters">
{{ banner(
'Your service is in restricted mode. You can only send notifications to yourself.',
'info'
) }}
<div class="column-two-thirds">
{% include 'flash_messages.html' %}
{% block maincolumn_content %}{% endblock %}
</div>