Move parameters out of the …_message components

This commit refactors the `email_message` and `sms_message` UI components to
take fewer parameters.

`name`, `edit_link` and anything to do with versions are identical for both
text and email messages so I’ve moved them to the pages where you choose a
template or see the versions.

This commit also tidies up the wording and styling of the template history
stuff.
This commit is contained in:
Chris Hill-Scott
2016-05-26 17:05:16 +01:00
parent 01884655c7
commit b84d06bd68
12 changed files with 77 additions and 144 deletions

View File

@@ -198,7 +198,7 @@ def format_datetime(date):
def format_datetime_normal(date):
return gmt_timezones(date).strftime('%d %B %Y at %H:%M')
return gmt_timezones(date).strftime('%d %B %Y at %H:%M').lstrip('0')
def format_datetime_short(date):
@@ -214,7 +214,7 @@ def format_date(date):
def format_date_normal(date):
return gmt_timezones(date).strftime('%d %B %Y')
return gmt_timezones(date).strftime('%d %B %Y').lstrip('0')
def format_date_short(date):

View File

@@ -5,17 +5,6 @@ $button-bottom-border-colour: rgba(0, 0, 0, 0.17);
margin-bottom: $gutter;
&-name {
@include bold-24;
margin: 20px 0 5px 0;
}
&-updated-at {
@include copy-16;
color: $secondary-text-colour;
margin: 0 0 10px 0;
}
&-meta {
@include core-19;
@@ -45,7 +34,7 @@ $button-bottom-border-colour: rgba(0, 0, 0, 0.17);
}
&-body {
width: 100%;
box-sizing: border-box;
padding: $gutter-half 0 0 0;

View File

@@ -0,0 +1,38 @@
.message {
&-name {
@include bold-24;
margin: 20px 0 5px 0;
}
&-updated-at {
@include copy-16;
color: $secondary-text-colour;
margin: 0 0 5px 0;
}
&-use-links {
@include copy-16;
margin-top: -7px;
color: $secondary-text-colour;
a {
@include core-19;
display: block;
margin-bottom: 5px;
text-decoration: none;
&:hover {
text-decoration: underline;
}
}
.primary {
@include bold-19;
}
}
}

View File

@@ -40,23 +40,6 @@
margin: 20px 0 5px 0;
}
.sms-message-updated-at {
@include copy-16;
color: $secondary-text-colour;
margin: 0 0 10px 0;
}
.sms-message-use-links-history {
@include copy-16;
color: $secondary-text-colour;
margin: 45px 0 0 0;
.primary {
color: $text-colour;
}
}
.sms-message-picker {
display: block;
margin: 7px 0 0 0;
@@ -66,34 +49,6 @@
z-index: 50;
}
%sms-message-use-links,
.sms-message-use-links {
@include copy-19;
margin-top: 35px;
a {
display: block;
margin-bottom: 5px;
text-decoration: none;
&:hover {
text-decoration: underline;
}
}
.primary {
@include bold-19;
}
}
.sms-message-use-links-with-title {
@extend %sms-message-use-links;
margin-top: 50px;
}
.sms-message-from {
@include bold-19;
display: block;

View File

@@ -51,6 +51,7 @@ $path: '/static/images/';
@import 'components/pill';
@import 'components/secondary-button';
@import 'components/show-more';
@import 'components/message';
@import 'views/job';
@import 'views/edit-template';

View File

@@ -1,32 +1,13 @@
{% macro email_message(
subject,
body,
name=None,
edit_link=None,
from_name=None,
from_address=None,
recipient=None,
id=None,
updated_at=None,
versions_url=None,
version=1,
show_placeholder_for_recipient=False,
show_id=False
) %}
{% if name %}
<h3 class="email-message-name">
{% if edit_link %}
<a href="{{ edit_link }}">{{ name }}</a>
{% else %}
{{ name }}
{% endif %}
</h3>
{% endif %}
{% if version > 1 %}
{% if updated_at %}
<p class="email-message-updated-at">Last updated on {{ updated_at|format_date_normal }} <a href="{{ versions_url }}">see earlier versions</a></p>
{% endif %}
{% endif %}
<div class="email-message">
{% if from_name or subject %}
<table class="email-message-meta">

View File

@@ -1,9 +1,7 @@
{% macro sms_message(
body,
recipient=None,
name=None,
id=None,
edit_link=None,
from=None,
version=1,
updated_at=None,
@@ -11,20 +9,6 @@
show_placeholder_for_recipient=False,
show_id=False
) %}
{% if name %}
<h3 class="sms-message-name">
{% if edit_link %}
<a name="{{ name|linkable_name }}" href="{{ edit_link }}">{{ name }}</a>
{% else %}
{{ name }}
{% endif %}
</h3>
{% endif %}
{% if version > 1 %}
{% if updated_at %}
<p class="sms-message-updated-at">Last updated on {{ updated_at|format_date_normal }} <a href="{{ versions_url }}">see earlier versions</a></p>
{% endif %}
{% endif %}
{% if recipient is not none %}
<p class="sms-message-recipient">
To:

View File

@@ -118,7 +118,6 @@
<div class="column-half">
{{ sms_message(
'Your vehicle tax for LC12 BFL is due on 1 March 2016. Renew online at www.gov.uk/vehicle-tax',
name='Two week reminder',
) }}
{{ sms_message(
template.formatted_as_markup
@@ -128,9 +127,7 @@
'+44 7700 900 306'
) }}
{{ sms_message(
template.formatted_as_markup,
name='Two week reminder',
edit_link='#'
template.formatted_as_markup
) }}
</div>
</div>
@@ -145,8 +142,7 @@
subject="Vehicle tax reminder",
body="Dear Alice Smith,\n\nYour vehicle tax for LC12 BFL is due on 1 March 2016.\n\nRenew online at www.gov.uk/vehicle-tax",
from_name="Vehicle tax",
from_address="vehicle.tax@notifications.service.gov.uk",
name="Two week reminder",
from_address="vehicle.tax@notifications.service.gov.uk"
) }}
</div>
</div>

View File

@@ -2,30 +2,21 @@
{% from "components/sms-message.html" import sms_message %}
<div class="column-two-thirds">
{{ template.versions }}
{% if 'email' == template.template_type %}
{{ email_message(
template.formatted_subject_as_markup,
template.formatted_as_markup,
name=template.name if show_title else None,
id=template.id,
updated_at=template.get_raw('updated_at', None),
version=template.get_raw('version', 1),
versions_url=url_for('.view_template_versions', service_id=current_service.id, template_id=template.id)
id=template.id
) }}
{% elif 'sms' == template.template_type %}
{{ sms_message(
template.formatted_as_markup,
name=template.name if show_title else None,
id=template.id,
updated_at=template.get_raw('updated_at', None),
version=template.get_raw('version', 1),
versions_url=url_for('.view_template_versions', service_id=current_service.id, template_id=template.id)
id=template.id
) }}
{% endif %}
</div>
<div class="column-one-third">
<div class="sms-message-use-links{% if show_title %}-with-title{% endif %}">
<div class="message-use-links{% if show_title %}-with-title{% endif %}">
{% if current_user.has_permissions(permissions=['send_texts', 'send_emails', 'send_letters']) %}
<a href="{{ url_for(".send_messages", service_id=current_service.id, template_id=template.id) }}" class="primary">
Send {{ 'text messages' if 'sms' == template.template_type else 'emails' }}

View File

@@ -1,41 +1,30 @@
{% from "components/email-message.html" import email_message %}
{% from "components/sms-message.html" import sms_message %}
<div class="column-whole">
<h2 class="message-name">{{ template.name }}</h2>
</div>
<div class="column-two-thirds">
{% if 'email' == template.template_type %}
{{ email_message(
template.formatted_subject_as_markup,
template.formatted_as_markup,
name=template.name if show_title else None,
edit_link=url_for(
'.view_template_version',
service_id=current_service.id,
template_id=template.id,
version=template.get_raw('version')
)
) }}
{% elif 'sms' == template.template_type %}
{{ sms_message(
template.formatted_as_markup,
name=template.name if show_title else None,
edit_link=url_for(
'.view_template_version',
service_id=current_service.id,
template_id=template.id,
version=template.get_raw('version')
)
template.formatted_as_markup
) }}
{% endif %}
</div>
<div class="column-one-third">
<div class="sms-message-use-links-history">
<p>
<div class="message-use-links">
{% if template.get_raw('version', 1) > 1 %}
Updated on<br/>{% if template.get_raw('updated_at', None) %}<span class="primary">{{ template.get_raw('updated_at')|format_datetime_normal }}</span>{% endif %}
{% if template.get_raw('updated_at', None) %}{{ template.get_raw('updated_at')|format_datetime_normal }}{% endif %}
{% else %}
Created on<br/>{% if template.get_raw('created_at', None) %}<span class="primary">{{ template.get_raw('created_at')|format_datetime_normal }}</span>{% endif %}
Created<br/>{% if template.get_raw('created_at', None) %}{{ template.get_raw('created_at')|format_datetime_normal }}{% endif %}
{% endif %}
<br/>By {{ template.get_raw('created_by').name }}
<br/>by {{ template.get_raw('created_by').name }}
</div>
</div>
</div>

View File

@@ -35,9 +35,15 @@
<div class="grid-row">
{% for template in templates %}
{% with show_title=True %}
{% include 'views/templates/_template.html' %}
{% endwith %}
<div class="column-whole">
<h2 class="message-name">{{ template.name }}</h2>
{% if template.get_raw('updated_at', None) %}
<p class="message-updated-at">
Edited {{ template.get_raw('updated_at', None)|format_date_short }}&ensp;<a href="{{ url_for('.view_template_versions', service_id=current_service.id, template_id=template.id) }}">see previous versions</a>
</p>
{% endif %}
</div>
{% include 'views/templates/_template.html' %}
{% endfor %}
</div>
{% endif %}

View File

@@ -5,12 +5,15 @@
{% endblock %}
{% block maincolumn_content %}
<h1 class="heading-large">{{ template.name }} version history</h1>
<div class="grid-row">
{% for template in versions %}
{% with show_title=True %}
{% include 'views/templates/_template_history.html' %}
{% endwith %}
{% endfor %}
</div>
<h1 class="heading-large">Previous versions</h1>
<div class="grid-row">
{% for template in versions %}
{% with show_title=True %}
{% include 'views/templates/_template_history.html' %}
{% endwith %}
{% endfor %}
</div>
<p>
<a href="{{ url_for(".choose_template", service_id=current_service.id, template_type=versions[0].template_type) }}">Back to current templates</a>
</p>
{% endblock %}