mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-02-05 02:42:26 -05:00
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:
@@ -1,26 +1,5 @@
|
||||
// Extra CSS overlaying elements
|
||||
|
||||
.form-control-2-3, .form-control-1-4 {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
font-family: "nta", Arial, sans-serif;
|
||||
font-size: 16px;
|
||||
line-height: 1.25;
|
||||
font-weight: 400;
|
||||
text-transform: none;
|
||||
padding: 4px;
|
||||
background-color: #fff;
|
||||
border: 2px solid #6f777b;
|
||||
}
|
||||
|
||||
@media (min-width: 641px) {
|
||||
.form-control-2-3, .form-control-1-4 {
|
||||
font-size: 19px;
|
||||
line-height: 1.31579;
|
||||
}
|
||||
}
|
||||
|
||||
#global-header-bar {
|
||||
background-color: $red;
|
||||
}
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
display: block;
|
||||
padding: $gutter-half;
|
||||
margin: $gutter-half 0 $gutter 0;
|
||||
text-align: center;
|
||||
text-align: left;
|
||||
position: relative;
|
||||
|
||||
}
|
||||
@@ -16,7 +16,7 @@
|
||||
.banner-with-tick {
|
||||
|
||||
@extend %banner;
|
||||
padding: $gutter-half $gutter;
|
||||
padding: $gutter-half ($gutter + $gutter-half);
|
||||
|
||||
&:before {
|
||||
@include core-24;
|
||||
@@ -58,7 +58,6 @@
|
||||
background: $yellow;
|
||||
color: $text-colour;
|
||||
text-align: left;
|
||||
border: 5px solid $text-colour;
|
||||
font-weight: bold;
|
||||
|
||||
a:link, a:visited {
|
||||
|
||||
@@ -1,13 +1,13 @@
|
||||
.navigation {
|
||||
|
||||
padding: 3px 0 0 0;
|
||||
padding: 20px 0 0 0;
|
||||
|
||||
ul, h2 {
|
||||
@include core-16;
|
||||
@include core-19;
|
||||
border-bottom: 1px solid $border-colour;
|
||||
margin: 10px 20px 0 0;
|
||||
margin: 10px 20px 15px 0;
|
||||
list-style-type: none;
|
||||
padding: 0 0 8px 0;
|
||||
padding: 0 0 10px 0;
|
||||
}
|
||||
|
||||
h2 {
|
||||
@@ -15,7 +15,7 @@
|
||||
}
|
||||
|
||||
li {
|
||||
margin: 7px 0 0 0;
|
||||
margin: 10px 0 0 0;
|
||||
}
|
||||
|
||||
a:link,
|
||||
|
||||
@@ -30,5 +30,5 @@ def service_dashboard(service_id):
|
||||
jobs=jobs,
|
||||
free_text_messages_remaining='25,000',
|
||||
spent_this_month='0.00',
|
||||
has_templates=bool(len(templates)),
|
||||
template_count=len(templates),
|
||||
service_id=str(service_id))
|
||||
|
||||
@@ -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() }}" />
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
|
||||
@@ -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 %}
|
||||
|
||||
@@ -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 haven’t 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 haven’t 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 %}
|
||||
|
||||
@@ -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('You’re 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>
|
||||
|
||||
|
||||
@@ -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>We’ve 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 haven’t 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 haven’t received a text</a></span>
|
||||
</p>
|
||||
{{ page_footer("Continue") }}
|
||||
</form>
|
||||
|
||||
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user