Make a macro for email branding previews

This means we:
- don’t have to copy and paste the `<iframe>` code to every place where
  we use it
- can make changes to it in one place and have it apply everywhere
This commit is contained in:
Chris Hill-Scott
2022-03-01 12:20:20 +00:00
parent 42f0d36ab8
commit e8198f6a69
6 changed files with 15 additions and 7 deletions

View File

@@ -0,0 +1,3 @@
{% macro branding_preview(branding_style) %}
<iframe src="{{ url_for('main.email_template', branding_style=branding_style) }}" class="branding-preview"></iframe>
{% endmacro %}

View File

@@ -1,6 +1,7 @@
{% extends "org_template.html" %}
{% from "components/form.html" import form_wrapper %}
{% from "components/button/macro.njk" import govukButton %}
{% from "components/branding-preview.html" import branding_preview %}
{% block org_page_title %}
Preview email branding
@@ -11,7 +12,7 @@
<h1 class="heading-large">Preview email branding</h1>
<div class="govuk-grid-row">
<div class="govuk-grid-column-full">
<iframe src="{{ url_for('main.email_template', branding_style=form.branding_style.data) }}" class="branding-preview"></iframe>
{{ branding_preview(form.branding_style.data) }}
{% call form_wrapper(action=action) %}
<div class="form-group">
{{ form.hidden_tag() }}

View File

@@ -3,6 +3,7 @@
{% from "components/back-link/macro.njk" import govukBackLink %}
{% from "components/page-footer.html" import page_footer %}
{% from "components/page-header.html" import page_header %}
{% from "components/branding-preview.html" import branding_preview %}
{% block service_page_title %}
Check your new branding
@@ -22,7 +23,7 @@
Emails from {{ current_service.name }} will look like this.
</p>
<iframe src="{{ url_for('main.email_template', branding_style='__NONE__') }}" class="branding-preview"></iframe>
{{ branding_preview('__NONE__') }}
<h2 class="heading-medium">Before you continue</h2>

View File

@@ -3,6 +3,7 @@
{% from "components/back-link/macro.njk" import govukBackLink %}
{% from "components/page-footer.html" import page_footer %}
{% from "components/page-header.html" import page_header %}
{% from "components/branding-preview.html" import branding_preview %}
{% block service_page_title %}
Check your new branding
@@ -21,8 +22,7 @@
<p class="govuk-body">
Emails from {{ current_service.name }} will look like this.
</p>
<iframe src="{{ url_for('main.email_template', branding_style=nhs_branding_id) }}" class="branding-preview"></iframe>
{{ branding_preview(nhs_branding_id) }}
<h2 class="heading-medium">Before you continue</h2>

View File

@@ -6,6 +6,7 @@
{% from "components/page-footer.html" import page_footer %}
{% from "components/form.html" import form_wrapper %}
{% from "components/back-link/macro.njk" import govukBackLink %}
{% from "components/branding-preview.html" import branding_preview %}
{% block service_page_title %}
Change email branding
@@ -25,8 +26,9 @@
Your emails currently have {{ branding_name }} branding.
</p>
{% set branding_id = current_service.email_branding_id if current_service.email_branding else '__NONE__' %}
<iframe src="{{ url_for('main.email_template', branding_style=branding_id) }}" class="branding-preview"></iframe>
{{ branding_preview(
current_service.email_branding_id if current_service.email_branding else '__NONE__'
) }}
{% if current_service.needs_to_change_email_branding %}
<p class="govuk-body">

View File

@@ -1,6 +1,7 @@
{% extends "withnav_template.html" %}
{% from "components/form.html" import form_wrapper %}
{% from "components/button/macro.njk" import govukButton %}
{% from "components/branding-preview.html" import branding_preview %}
{% block service_page_title %}
Preview email branding
@@ -11,7 +12,7 @@
<h1 class="heading-large">Preview email branding</h1>
<div class="govuk-grid-row">
<div class="govuk-grid-column-full">
<iframe src="{{ url_for('main.email_template', branding_style=form.branding_style.data) }}" class="branding-preview"></iframe>
{{ branding_preview(form.branding_style.data) }}
{% call form_wrapper(action=action) %}
<div class="form-group">
{{ form.hidden_tag() }}