darkhelm/notifications-admin
1
0
Fork 0
mirror of https://github.com/GSA/notifications-admin.git synced 2026-07-17 21:20:32 -04:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #3194 from alphagov/revert-3158-replace-govuk-template-with-govuk-frontend-components

Browse Source 
Revert "Replace govuk template with govuk frontend components"
This commit is contained in:
Tom Byers
2019-11-25 10:45:48 +00:00
committed by GitHub
parent db255c7cf3 e02f94f238
commit 2a75f1ba22
47 changed files with 356 additions and 939 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
app/assets/javascripts/collapsibleCheckboxes.js
View File

@@ -53,7 +53,7 @@
}
Footer.prototype.buttonContent = {
change: (fieldLabel) => `Choose ${fieldLabel}s`,
done: (fieldLabel) => `Done<span class="govuk-visually-hidden"> choosing ${fieldLabel}s</span>`
done: (fieldLabel) => `Done<span class="visuallyhidden"> choosing ${fieldLabel}s</span>`
};
Footer.prototype.getEl = function (expanded) {
const buttonState = expanded ? 'done' : 'change';
@@ -118,7 +118,7 @@
this.$heading = $(`<h${headingLevel} class="heading-small">${this.legendText}</h${headingLevel}>`);
this.$fieldset.before(this.$heading);
this.$fieldset.find('legend').addClass('govuk-visually-hidden');
this.$fieldset.find('legend').addClass('visuallyhidden');
};
CollapsibleCheckboxes.prototype.expand = function(e) {
if (e !== undefined) { e.preventDefault(); }

16
app/assets/javascripts/cookieMessage.js
View File

@@ -1,16 +0,0 @@
(function () {
"use strict";
var root = this;
if(typeof root.GOVUK === 'undefined') { root.GOVUK = {}; }
GOVUK.addCookieMessage = function () {
var message = document.getElementById('global-cookie-message'),
hasCookieMessage = (message && GOVUK.cookie('seen_cookie_message') === null);
if (hasCookieMessage) {
message.style.display = 'block';
GOVUK.cookie('seen_cookie_message', 'yes', { days: 28 });
}
};
}).call(this);

62
app/assets/javascripts/govuk/cookie-functions.js
View File

@@ -1,62 +0,0 @@
(function () {
"use strict";
var root = this;
if(typeof root.GOVUK === 'undefined') { root.GOVUK = {}; }
/*
Cookie methods
==============
Usage:
Setting a cookie:
GOVUK.cookie('hobnob', 'tasty', { days: 30 });
Reading a cookie:
GOVUK.cookie('hobnob');
Deleting a cookie:
GOVUK.cookie('hobnob', null);
*/
GOVUK.cookie = function (name, value, options) {
if(typeof value !== 'undefined'){
if(value === false || value === null) {
return GOVUK.setCookie(name, '', { days: -1 });
} else {
return GOVUK.setCookie(name, value, options);
}
} else {
return GOVUK.getCookie(name);
}
};
GOVUK.setCookie = function (name, value, options) {
if(typeof options === 'undefined') {
options = {};
}
var cookieString = name + "=" + value + "; path=/";
if (options.days) {
var date = new Date();
date.setTime(date.getTime() + (options.days * 24 * 60 * 60 * 1000));
cookieString = cookieString + "; expires=" + date.toGMTString();
}
if (document.location.protocol == 'https:'){
cookieString = cookieString + "; Secure";
}
document.cookie = cookieString;
};
GOVUK.getCookie = function (name) {
var nameEQ = name + "=";
var cookies = document.cookie.split(';');
for(var i = 0, len = cookies.length; i < len; i++) {
var cookie = cookies[i];
while (cookie.charAt(0) == ' ') {
cookie = cookie.substring(1, cookie.length);
}
if (cookie.indexOf(nameEQ) === 0) {
return decodeURIComponent(cookie.substring(nameEQ.length));
}
}
return null;
};
}).call(this);

4
app/assets/javascripts/listEntry.js
View File

@@ -28,7 +28,7 @@
ListEntry.prototype.entryTemplate = Hogan.compile(
'<div class="list-entry">' +
'<label for="{{{id}}}" class="text-box-number-label">' +
'<span class="govuk-visually-hidden">{{listItemName}} number </span>{{number}}.' +
'<span class="visuallyhidden">{{listItemName}} number </span>{{number}}.' +
'</label>' +
'<input' +
' name="{{name}}-{{index}}"' +
@@ -38,7 +38,7 @@
'/>' +
'{{#button}}' +
'<button type="button" class="button-secondary list-entry-remove">' +
'Remove<span class="govuk-visually-hidden"> {{listItemName}} number {{number}}</span>' +
'Remove<span class="visuallyhidden"> {{listItemName}} number {{number}}</span>' +
'</button>' +
'{{/button}}' +
'</div>'

4
app/assets/javascripts/main.js
View File

@@ -1,7 +1,3 @@
window.GOVUK.Frontend.initAll();
$(() => GOVUK.addCookieMessage());
$(() => $("time.timeago").timeago());
$(() => GOVUK.stickAtTopWhenScrolling.init());

34
app/assets/javascripts/modules/all.mjs
View File

@@ -1,34 +0,0 @@
// JS Module used to combine all the JS modules used in the application into a single entry point,
// a bit like `app/__init__` in the Flask app.
//
// When processed by a bundler, this is turned into a Immediately Invoked Function Expression (IIFE)
// The IIFE format allows it to run in browsers that don't support JS Modules.
//
// Exported items will be added to the window.GOVUK namespace.
// For example, `export { Frontend }` will assign `Frontend` to `window.Frontend`
import Header from 'govuk-frontend/components/header/header';
// Copy of the initAll function from https://github.com/alphagov/govuk-frontend/blob/v2.13.0/src/all.js
// except it only includes, and initialises, the components used by this application.
function initAll (options) {
// Set the options to an empty object by default if no options are passed.
options = typeof options !== 'undefined' ? options : {}
// Allow the user to initialise GOV.UK Frontend in only certain sections of the page
// Defaults to the entire document if nothing is set.
var scope = typeof options.scope !== 'undefined' ? options.scope : document
// Find first header module to enhance.
var $toggleButton = scope.querySelector('[data-module="header"]')
new Header($toggleButton).init()
}
// Create separate namespace for GOVUK Frontend.
var Frontend = {
"Header": Header,
"initAll": initAll
}
export {
Frontend
}

2
app/assets/javascripts/templateFolderForm.js
View File

@@ -127,7 +127,7 @@
});
if (opts.hasOwnProperty('nonvisualText')) {
$btn.append(`<span class="govuk-visually-hidden"> ${opts.nonvisualText}</span>`);
$btn.append(`<span class="visuallyhidden"> ${opts.nonvisualText}</span>`);
}
return $btn;

58
app/assets/stylesheets/app.scss
View File

@@ -1,4 +1,62 @@
// Extra CSS overlaying elements
#global-header-bar {
background-color: $govuk-blue;
}
#global-header,
#global-header.with-proposition {
#logo {
white-space: nowrap;
#product-name {
font-size: 24px;
font-weight: 400;
padding-left: 5px;
}
}
.header-wrapper {
.header-global {
.header-logo {
@include media(desktop) {
width: auto;
}
&:after {
display: none;
}
}
}
}
.header-proposition {
#proposition-links {
li {
padding: 0 0 0 15px;
}
}
}
}
@include media(desktop) {
#proposition-menu {
float: right;
}
}
a {
&:visited {
color: $link-colour;
}
}
.form-control-1-1 {
width: 100%;
}

8
app/assets/stylesheets/components/cookie-message.scss
View File

@@ -1,8 +0,0 @@
.notify-cookie-message {
@include govuk-font($size: 16);
padding: govuk-spacing(3) 0;
.js-enabled & {
display: none;
}
}

77
app/assets/stylesheets/globals.scss
View File

@@ -1,77 +0,0 @@
// needed for IE10 desktop snap mode: http://menacingcloud.com/?c=cssViewportOrMetaTag
@-ms-viewport {
width: device-width;
}
b,
strong {
font-weight: 600;
}
abbr[title] {
cursor: help;
}
.js-enabled .js-hidden {
display: none;
}
// To be removed when all search inputs use the GOV.UK Frontend text input component:
// https://design-system.service.gov.uk/components/text-input/
/*
* 1. Addresses `appearance` set to `searchfield` in Safari 5 and Chrome.
* 2. Addresses `box-sizing` set to `border-box` in Safari 5 and Chrome
* (include `-moz` to future-proof).
*/
input[type="search"] {
-webkit-appearance: textfield; /* 1 */
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box; /* 2 */
box-sizing: content-box;
}
input[type="search"]::-webkit-search-cancel-button {
-webkit-appearance: searchfield-cancel-button;
margin-right: 2px;
}
input[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
// To be removed when all links follow the GOV.UK Frontend conventions:
// https://design-system.service.gov.uk/styles/typography/#links
a {
&:link {
color: $link-colour;
}
&:visited {
color: $link-visited-colour;
}
&:hover {
color: $link-hover-colour;
}
&:active {
color: $link-active-colour;
}
}
// Each selector, and then the whole block when only one remains, to be removed when the
// element comes from the corresponding GOV.UK Frontend component:
// - https://design-system.service.gov.uk/components/text-input/
// - https://design-system.service.gov.uk/components/textarea/
// - https://design-system.service.gov.uk/components/select/
// - https://design-system.service.gov.uk/components/button/
// Global styles for form controls
input:focus,
textarea:focus,
select:focus,
button:focus {
outline: 3px solid $focus-colour;
outline-offset: 0;
}

27
app/assets/stylesheets/govuk-frontend/_all.scss
View File

@@ -1,27 +0,0 @@
// Version of node_modules/govuk-frontend/components/all.scss specific to Notify
// Included to allow us to only include the components we need
// All imports come from node_modules/govuk-frontend
// set asset URL root to match that of application
$govuk-assets-path: "/static/";
@import "settings/all";
@import "tools/all";
@import "helpers/all";
@import "core/all";
@import "objects/all";
// section replacing @import 'components/all', specifying which components to include
@import 'components/skip-link/_skip-link';
@import 'components/header/_header';
@import 'components/footer/_footer';
@import "utilities/all";
@import "overrides/all";
// Styles extending those from GOV.UK Frontend
@import './extensions';
// Styles for GOV.UK Frontend components specific to this application
@import './overrides';

9
app/assets/stylesheets/govuk-frontend/extensions.scss
View File

@@ -1,9 +0,0 @@
// Extends footer column styles to allow 4 columns
@include mq ($from: desktop) {
.govuk-footer__list--columns-4 {
// TODO: Move support for legacy properties to something like Post-CSS's auto-prefixer
-webkit-column-count: 4;
-moz-column-count: 4;
column-count: 4;
}
}

58
app/assets/stylesheets/govuk-frontend/overrides.scss
View File

@@ -1,58 +0,0 @@
// Overrides for certain GOV.UK Frontend styles to make its components match this application's design
// Notify's header navigation aligns to the right
.govuk-header__navigation {
text-align: right;
// reset the alignment of each item to left-to-right
.govuk-header__navigation-item {
text-align: left;
}
}
// The GOV.UK Frontend header component wraps content that is `position: relative`
// This changes its z-index position, putting it above the `<main>` section
// We need the `<main>` section to be above it, like the default order, to hide the theme colour
// bar on full-width pages
.govuk-main-wrapper {
position: relative;
}
// Additional padding-bottom override, following the GOV.UK Frontend spacing scale:
// https://design-system.service.gov.uk/styles/spacing/#the-responsive-spacing-scale
.govuk-\!-padding-bottom-12 {
padding-bottom: 70px;
@include govuk-media-query($from: tablet) {
padding-bottom: 90px;
}
}
.govuk-footer__navigation {
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap
}
.govuk-footer__section {
-webkit-flex-basis: 200px;
-ms-flex-preferred-size: 200px;
flex-basis: 100%;
}
@include govuk-media-query($from: tablet) {
.govuk-footer__navigation {
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap
}
.govuk-footer__section {
-webkit-flex-basis: 200px;
-ms-flex-preferred-size: 200px;
flex-basis: 200px;
}
}

6
app/assets/stylesheets/main.scss
View File

@@ -16,9 +16,6 @@ $path: '/static/images/';
// Dependencies from GOVU.UK Frontend Toolkit, rewritten for this application
@import 'url-helpers';
// Specific to this application, needs to go at the top of the cascade
@import 'globals';
// Dependencies from GOV.UK Elements
// https://github.com/alphagov/govuk_elements
@import 'elements/helpers';
@@ -34,12 +31,9 @@ $path: '/static/images/';
@import 'elements/panels';
@import 'elements/tables';
// Dependencies from GOV.UK Frontend, packaged to be specific to this application
@import './govuk-frontend/all';
// Specific to this application
@import 'grids';
@import 'components/cookie-message';
@import 'components/site-footer';
@import 'components/placeholder';
@import 'components/sms-message';

85
app/assets/stylesheets/print.scss
View File

@@ -1,85 +0,0 @@
// sass-lint:disable no-important
// set asset URL root to match that of application
$govuk-assets-path: "/static/";
@import "settings/all";
@import "tools/all";
@import "helpers/all";
@import "core/all";
@import "objects/all";
* {
background: transparent;
color: black;
text-shadow: none;
filter: none;
-ms-filter: none;
}
body {
@include govuk-font($size: 14);
margin: 0;
padding: 0;
width: 100%;
}
a,
a:visited {
word-wrap: break-word;
}
a[href^="/"]:after,
a[href^="http://"]:after,
a[href^="https://"]:after {
content: " (" attr(href) ")";
font-size: 90%;
}
a[href^="javascript:"]:after,
a[href^="#"]:after {
content: "";
}
img {
max-width: 100% !important;
}
select {
background: white;
}
.govuk-header {
.govuk-header__logo {
@include govuk-font($size: 19);
text-rendering: optimizeLegibility;
a {
&,
&:visited {
text-decoration: none;
}
&:after {
content: "";
}
}
svg {
width: 45px;
height: 40px;
position: relative;
top: -3px;
vertical-align: bottom;
}
}
}
.govuk-visually-hidden,
.govuk-visually-hidden-focusable,
.notify-cookie-message,
.govuk-skip-link,
.govuk-footer {
display: none !important;
}

4
app/navigation.py
View File

@@ -328,10 +328,6 @@ class HeaderNavigation(Navigation):
'whitelist',
}
# header HTML now comes from GOVUK Frontend so requires a boolean, not an attribute
def is_selected(self, navigation_item):
return request.endpoint in self.mapping[navigation_item]
class MainNavigation(Navigation):

304
app/templates/admin_template.html
View File

@@ -1,236 +1,114 @@
{% extends "template.njk" %}
{% extends "govuk_template.html" %}
{% from "components/banner.html" import banner %}
{% from "components/notify-footer.html" import notify_footer %}
{% block headIcons %}
<link rel="shortcut icon" sizes="16x16 32x32 48x48" href="{{ asset_url('images/favicon.ico') }}" type="image/x-icon" />
<link rel="mask-icon" href="{{ asset_url('images/govuk-mask-icon.svg') }}" color="{{ themeColor | default('#0b0c0c') }}"> {# Hardcoded value of $govuk-black #}
<link rel="apple-touch-icon" sizes="180x180" href="{{ asset_url('images/govuk-apple-touch-icon-180x180.png') }}">
<link rel="apple-touch-icon" sizes="167x167" href="{{ asset_url('images/govuk-apple-touch-icon-167x167.png') }}">
<link rel="apple-touch-icon" sizes="152x152" href="{{ asset_url('images/govuk-apple-touch-icon-152x152.png') }}">
<link rel="apple-touch-icon" href="{{ asset_url('images/govuk-apple-touch-icon.png') }}">
{% endblock %}
{% block head %}
<link rel="stylesheet" media="screen" href="{{ asset_url('stylesheets/main.css') }}" />
<link rel="stylesheet" media="print" href="{{ asset_url('stylesheets/print.css') }}" />
<style>
.govuk-header__container { border-color: {{header_colour}} }
#global-header-bar { background-color: {{header_colour}} }
</style>
<meta name="google-site-verification" content="niWnSqImOWz6mVQTYqNb5tFK8HaKSB4b3ED4Z9gtUQ0" />
{% block meta %}
{% endblock %}
{% endblock %}
{% block pageTitle %}
{% block page_title %}
{% block per_page_title %}{% endblock %} – GOV.UK Notify
{% endblock %}
{% block bodyStart %}
{% block cookie_message %}
<div class="notify-cookie-message" id="global-cookie-message">
<p class="govuk-width-container">
GOV.UK Notify uses cookies to make the site simpler.
<a href="{{ url_for("main.cookies") }}">Find out more about cookies</a>
</p>
{% block cookie_message %}
<p>
GOV.UK Notify uses cookies to make the site simpler.
<a href="{{ url_for("main.cookies") }}">Find out more about cookies</a>
</p>
{% endblock %}
{% block header_class %}with-proposition{% endblock %}
{% block proposition_header %}
<div class="header-proposition">
<div class="content">
<a href="#proposition-links" class="js-header-toggle menu">Menu</a>
<nav id="proposition-menu">
<ul id="proposition-links">
<li><a href="{{ url_for('main.support') }}" {{ header_navigation.is_selected('support') }}>Support</a></li>
{% if current_user.is_authenticated %}
<li><a href="{{ url_for('main.documentation') }}" {{ header_navigation.is_selected('documentation') }}>Documentation</a></li>
<li><a href="{{ url_for('main.user_profile') }}" {{ header_navigation.is_selected('user-profile') }}>{{ current_user.name }}</a></li>
{% if current_user.platform_admin %}
<li><a href="{{ url_for('main.platform_admin') }}" {{ header_navigation.is_selected('platform-admin') }}>Platform admin</a></li>
{% endif %}
<li><a href="{{ url_for('main.sign_out')}}">Sign out</a></li>
{% else %}
<li><a href="{{ url_for('main.features') }}" {{ header_navigation.is_selected('features') }}>Features</a></li>
<li><a href="{{ url_for('main.pricing' )}}" {{ header_navigation.is_selected('pricing') }}>Pricing</a></li>
<li><a href="{{ url_for('main.documentation') }}" {{ header_navigation.is_selected('documentation') }}>Documentation</a></li>
<li><a href="{{ url_for('main.sign_in' )}}" {{ header_navigation.is_selected('sign-in') }}>Sign in</a></li>
{% endif %}
</ul>
</nav>
</div>
{% endblock %}
</div>
{% endblock %}
{% block header %}
{% if current_user.is_authenticated %}
{% if current_user.platform_admin %}
{% set navigation = [
{
"href": url_for('main.support'),
"text": "Support",
"active": header_navigation.is_selected('support')
},
{
"href": url_for('main.documentation'),
"text": "Documentation",
"active": header_navigation.is_selected('documentation')
},
{
"href": url_for('main.user_profile'),
"text": current_user.name,
"active": header_navigation.is_selected('user-profile')
},
{
"href": url_for('main.platform_admin'),
"text": "Platform admin",
"active": header_navigation.is_selected('platform-admin')
},
{
"href": url_for('main.sign_out'),
"text": "Sign out"
}
] %}
{% else %}
{% set navigation = [
{
"href": url_for('main.support'),
"text": "Support",
"active": header_navigation.is_selected('support')
},
{
"href": url_for('main.documentation'),
"text": "Documentation",
"active": header_navigation.is_selected('documentation')
},
{
"href": url_for('main.user_profile'),
"text": current_user.name,
"active": header_navigation.is_selected('user-profile')
},
{
"href": url_for('main.sign_out'),
"text": "Sign out"
}
] %}
{% set global_header_text = "GOV.UK <span id='product-name'>Notify</span>"|safe %}
{% set homepage_url = url_for('main.show_accounts_or_dashboard') %}
{% block content %}
{% block fullwidth_content %}{% endblock %}
{% endblock %}
{% block footer_top %}
<div class="footer-categories">
<div class="footer-categories-wrapper">
<div class="grid-row">
<div class="column-one-quarter">
<ul>
<li><a href="{{ url_for('main.support') }}">Support</a></li>
<li><a href="https://status.notifications.service.gov.uk">System status</a></li>
<li><a href="https://www.gov.uk/performance/govuk-notify">Performance</a></li>
<li><a href="https://ukgovernmentdigital.slack.com/messages/C0E1ADVPC">Slack channel</a></li>
<li><a href="https://gds.blog.gov.uk/category/notify/">Blog</a></li>
</ul>
</div>
<div class="column-one-quarter">
<ul>
<li><a href="{{ url_for("main.features") }}">Features</a></li>
<li><a href="{{ url_for("main.roadmap") }}">Roadmap</a></li>
<li><a href="{{ url_for("main.trial_mode_new") }}">Trial mode</a></li>
<li><a href="{{ url_for("main.message_status") }}">Message status</a></li>
<li><a href="{{ url_for("main.security") }}">Security</a></li>
<li><a href="{{ url_for("main.terms") }}">Terms of use</a></li>
</ul>
</div>
<div class="column-one-quarter">
<ul>
<li><a href="{{ url_for("main.pricing") }}">Pricing</a></li>
<li><a href="{{ url_for("main.how_to_pay") }}">How to pay</a></li>
</ul>
</div>
<div class="column-one-quarter">
<ul>
<li><a href="{{ url_for("main.documentation") }}">Documentation</a></li>
</ul>
</div>
</div>
</div>
</div>
{% endblock %}
{% block footer_support_links %}
<nav class="footer-nav">
Built by the <a href="https://www.gov.uk/government/organisations/government-digital-service">Government Digital Service</a>
<a href="{{ url_for("main.privacy") }}">Privacy</a>
<a href="{{ url_for("main.cookies") }}">Cookies</a>
{% if current_service and current_service.research_mode %}
<span id="research-mode" class="research-mode">research mode</span>
{% endif %}
{% else %}
{% set navigation = [
{
"href": url_for('main.support'),
"text": "Support",
"active": header_navigation.is_selected('support')
},
{
"href": url_for('main.features'),
"text": "Features",
"active": header_navigation.is_selected('features')
},
{
"href": url_for('main.pricing'),
"text": "Pricing",
"active": header_navigation.is_selected('pricing')
},
{
"href": url_for('main.documentation'),
"text": "Documentation",
"active": header_navigation.is_selected('documentation')
},
{
"href": url_for('main.sign_in'),
"text": "Sign in",
"active": header_navigation.is_selected('sign-in')
}
] %}
{% endif %}
{{ govukHeader({
"homepageUrl": url_for('main.show_accounts_or_dashboard'),
"productName": "Notify",
"navigation": navigation
}) }}
</nav>
{% endblock %}
{% block footer %}
{% set meta_items = [
{
"href": url_for("main.privacy"),
"text": "Privacy"
},
{
"href": url_for("main.cookies"),
"text": "Cookies"
}
] %}
{% if current_service and current_service.research_mode %}
{% set meta_suffix = 'Built by the <a href="https://www.gov.uk/government/organisations/government-digital-service" class="govuk-footer__link">Government Digital Service</a><span id="research-mode" class="research-mode">research mode</span>' %}
{% else %}
{% set meta_suffix = 'Built by the <a href="https://www.gov.uk/government/organisations/government-digital-service" class="govuk-footer__link">Government Digital Service</a>' %}
{% endif %}
{{ notify_footer({
"navigation": [
{
"columns": 1,
"items": [
{
"href": url_for('main.support'),
"text": "Support"
},
{
"href": "https://status.notifications.service.gov.uk",
"text": "System status"
},
{
"href": "https://www.gov.uk/performance/govuk-notify",
"text": "Performance"
},
{
"href": "https://ukgovernmentdigital.slack.com/messages/C0E1ADVPC",
"text": "Slack channel"
},
{
"href": "https://gds.blog.gov.uk/category/notify/",
"text": "Blog"
}
]
},
{
"columns": 1,
"items": [
{
"href": url_for("main.features"),
"text": "Features"
},
{
"href": url_for("main.roadmap"),
"text": "Roadmap"
},
{
"href": url_for("main.trial_mode_new"),
"text": "Trial mode"
},
{
"href": url_for("main.message_status"),
"text": "Message status"
},
{
"href": url_for("main.security"),
"text": "Security"
},
{
"href": url_for("main.terms"),
"text": "Terms of use"
}
]
},
{
"columns": 1,
"items": [
{
"href": url_for("main.pricing"),
"text": "Pricing"
},
{
"href": url_for("main.how_to_pay"),
"text": "How to pay"
}
]
},
{
"columns": 1,
"items": [
{
"href": url_for("main.documentation"),
"text": "Documentation"
}
]
}
],
"meta": {
"items": meta_items,
"html": meta_suffix
}
}) }}
{% endblock %}
{% block bodyEnd %}
{% block body_end %}
<!--[if gt IE 8]><!-->
<script type="text/javascript" src="{{ asset_url('javascripts/all.js') }}"></script>
<!--<![endif]-->

2
app/templates/components/file-upload.html
View File

@@ -10,7 +10,7 @@
) %}
<form method="post" enctype="multipart/form-data" {% if action %}action="{{ action }}"{% endif %} class="{% if field.errors and show_errors %}form-group-error{% endif %}" data-module="file-upload">
<label class="file-upload-label" for="{{ field.name }}">
<span class="govuk-visually-hidden">{{ field.label.text }}</span>
<span class="visually-hidden">{{ field.label.text }}</span>
{% if hint %}
<span class="form-hint">
{{ hint }}

2
app/templates/components/list-entry.html
View File

@@ -28,7 +28,7 @@
{% for index in range(0, field.entries|length) %}
<div class="list-entry">
<label for="input-{{ field.name }}-{{ index }}" class="text-box-number-label">
<span class="govuk-visually-hidden">{{ item_name }} number </span>{{ index + 1 }}.
<span class="visuallyhidden">{{ item_name }} number </span>{{ index + 1 }}.
</label>
<input
type="text"

90
app/templates/components/notify-footer.html
View File

@@ -1,90 +0,0 @@
{% macro notify_footer(params) %}
<footer class="govuk-footer {{ params.classes if params.classes }}" role="contentinfo" {%- for attribute, value in params.attributes %} {{attribute}}="{{value}}"{% endfor %}>
<div class="govuk-width-container {{ params.containerClasses if params.containerClasses }}">
{% if params.navigation %}
<div class="govuk-footer__navigation">
{% for nav in params.navigation %}
<div class="govuk-footer__section">
{# <h2 class="govuk-footer__heading govuk-heading-m">{{ nav.title }}</h2> removed #}
{% if nav['items'] %}
{% set listClasses %}
{% if nav.columns %}
govuk-footer__list--columns-{{ nav.columns }}
{% endif %}
{% endset %}
<ul class="govuk-footer__list {{ listClasses | trim }}">
{% for item in nav['items'] %}
{% if item.href and item.text %}
<li class="govuk-footer__list-item">
<a class="govuk-footer__link" href="{{ item.href }}"{% for attribute, value in item.attributes %} {{attribute}}="{{value}}"{% endfor %}>
{{ item.text }}
</a>
</li>
{% endif %}
{% endfor %}
</ul>
{% endif %}
</div>
{% endfor %}
</div>
<hr class="govuk-footer__section-break">
{% endif %}
<div class="govuk-footer__meta">
<div class="govuk-footer__meta-item govuk-footer__meta-item--grow">
{% if params.meta %}
<h2 class="govuk-visually-hidden">{{ params.meta.visuallyHiddenTitle | default("Support links") }}</h2>
{% if params.meta['items'] %}
<ul class="govuk-footer__inline-list">
{% for item in params.meta['items'] %}
<li class="govuk-footer__inline-list-item">
<a class="govuk-footer__link" href="{{ item.href }}"{% for attribute, value in item.attributes %} {{attribute}}="{{value}}"{% endfor %}>
{{ item.text }}
</a>
</li>
{% endfor %}
</ul>
{% endif %}
{% if params.meta.text or params.meta.html %}
<div class="govuk-footer__meta-custom">
{{ params.meta.html | safe if params.meta.html else params.meta.text }}
</div>
{% endif %}
{% endif %}
{#- The SVG needs `focusable="false"` so that Internet Explorer does not
treat it as an interactive element - without this it will be
'focusable' when using the keyboard to navigate. #}
<svg
role="presentation"
focusable="false"
class="govuk-footer__licence-logo"
xmlns="http://www.w3.org/2000/svg"
viewbox="0 0 483.2 195.7"
height="17"
width="41"
>
<path
fill="currentColor"
d="M421.5 142.8V.1l-50.7 32.3v161.1h112.4v-50.7zm-122.3-9.6A47.12 47.12 0 0 1 221 97.8c0-26 21.1-47.1 47.1-47.1 16.7 0 31.4 8.7 39.7 21.8l42.7-27.2A97.63 97.63 0 0 0 268.1 0c-36.5 0-68.3 20.1-85.1 49.7A98 98 0 0 0 97.8 0C43.9 0 0 43.9 0 97.8s43.9 97.8 97.8 97.8c36.5 0 68.3-20.1 85.1-49.7a97.76 97.76 0 0 0 149.6 25.4l19.4 22.2h3v-87.8h-80l24.3 27.5zM97.8 145c-26 0-47.1-21.1-47.1-47.1s21.1-47.1 47.1-47.1 47.2 21 47.2 47S123.8 145 97.8 145"
/>
</svg>
<span class="govuk-footer__licence-description">
All content is available under the
<a
class="govuk-footer__link"
href="https://www.nationalarchives.gov.uk/doc/open-government-licence/version/3/"
rel="license"
>Open Government Licence v3.0</a>, except where otherwise stated
</span>
</div>
<div class="govuk-footer__meta-item">
<a
class="govuk-footer__link govuk-footer__copyright-logo"
href="https://www.nationalarchives.gov.uk/information-management/re-using-public-sector-information/uk-government-licensing-framework/crown-copyright/"
>© Crown copyright</a>
</div>
</div>
</div>
</footer>
{% endmacro %}

2
app/templates/components/select-input.html
View File

@@ -43,7 +43,7 @@
{% endif %}
<fieldset id="{{ field.id }}" {% if inline %}class="inline"{% endif %}>
<legend class="{{ 'form-label' if not hide_legend else '' }}{% if legend_style != 'text' %} {{ legend_style }}{% endif %}">
{% if hide_legend %}<span class="govuk-visually-hidden">{% endif %}
{% if hide_legend %}<span class="visually-hidden">{% endif %}
{{ field.label.text|safe }}
{% if hide_legend %}</span>{% endif %}
{% if hint %}

6
app/templates/components/table.html
View File

@@ -2,7 +2,7 @@
{% macro mapping_table(caption='', field_headings=[], field_headings_visible=True, caption_visible=True, equal_length=False) -%}
<table class="table table-font-xsmall">
<caption class="heading-medium table-heading{{ ' govuk-visually-hidden' if not caption_visible}}">
<caption class="heading-medium table-heading{{ ' visuallyhidden' if not caption_visible}}">
{{ caption }}
</caption>
<thead class="table-field-headings{% if field_headings_visible %}-visible{% endif %}">
@@ -12,7 +12,7 @@
{% if field_headings_visible %}
{{ field_heading }}
{% else %}
<span class="govuk-visually-hidden">{{ field_heading }}</span>
<span class="visuallyhidden">{{ field_heading }}</span>
{% endif %}
</th>
{% endfor %}
@@ -138,7 +138,7 @@
{%- endmacro %}
{% macro hidden_field_heading(text) %}
<span class="govuk-visually-hidden">{{ text }}</span>
<span class="visuallyhidden">{{ text }}</span>
{%- endmacro %}

4
app/templates/components/tick-cross.html
View File

@@ -2,12 +2,12 @@
<li>
{% if yes %}
<span class="tick-cross-tick">
<span class="govuk-visually-hidden">{{ truthy_hint }}</span>
<span class="visually-hidden">{{ truthy_hint }}</span>
{{ label}}
</span>
{% else %}
<span class="tick-cross-cross">
<span class="govuk-visually-hidden">{{ falsey_hint }}</span>
<span class="visually-hidden">{{ falsey_hint }}</span>
{{ label}}
</span>
{% endif %}

9
app/templates/fullwidth_template.html
View File

@@ -1,10 +1,7 @@
{% extends "admin_template.html" %}
{% set mainClasses = "govuk-!-padding-top-0 govuk-!-padding-bottom-0" %}
{% block main %}
{% block beforeContent %}{% endblock %}
<main class="govuk-main-wrapper {{ mainClasses }}" id="main-content" role="main">
{% block content %}{% endblock %}
{% block fullwidth_content %}
<main role="main">
{% block maincolumn_content %}{% endblock %}
</main>
{% endblock %}

19
app/templates/org_template.html
View File

@@ -4,8 +4,8 @@
{% block org_page_title %}{% endblock %} – {{ current_org.name }}
{% endblock %}
{% block main %}
<div class="govuk-width-container">
{% block fullwidth_content %}
<div id="content">
<div class="navigation-service">
{% if current_user.platform_admin %}
<a href="{{ url_for('.organisations') }}" class="navigation-organisation-link">All organisations</a>
@@ -15,19 +15,14 @@
</div>
<a href="{{ url_for('main.choose_account') }}" class="navigation-service-switch">Switch service</a>
</div>
<div class="grid-row govuk-!-padding-bottom-12">
<div class="grid-row">
<div class="column-one-quarter">
{% include "org_nav.html" %}
</div>
<div class="column-three-quarters">
{% block beforeContent %}{% endblock %}
<main class="govuk-main-wrapper column-main govuk-!-padding-top-0 govuk-!-padding-bottom-0" id="main-content" role="main" >
{% block content %}
{% include 'flash_messages.html' %}
{% block maincolumn_content %}{% endblock %}
{% endblock %}
</main>
</div>
<main role="main" class="column-three-quarters column-main">
{% include 'flash_messages.html' %}
{% block maincolumn_content %}{% endblock %}
</main>
</div>
</div>
{% endblock %}

4
app/templates/views/check/column-errors.html
View File

@@ -8,7 +8,7 @@
{% set file_contents_header_id = 'file-preview' %}
{% macro skip_to_file_contents() %}
<p class="govuk-visually-hidden">
<p class="visually-hidden">
<a href="#{{ file_contents_header_id }}">Skip to file contents</a>
</p>
{% endmacro %}
@@ -165,7 +165,7 @@
caption=original_file_name,
caption_visible=False,
field_headings=[
'<span class="govuk-visually-hidden">Row in file</span><span aria-hidden="true">1</span>'|safe
'<span class="visually-hidden">Row in file</span><span aria-hidden="true">1</span>'|safe
] + column_headers
) %}
{% call index_field() %}

4
app/templates/views/check/ok.html
View File

@@ -9,7 +9,7 @@
{% set file_contents_header_id = 'file-preview' %}
{% macro skip_to_file_contents() %}
<p class="govuk-visually-hidden">
<p class="visually-hidden">
<a href="#{{ file_contents_header_id }}">Skip to file contents</a>
</p>
{% endmacro %}
@@ -62,7 +62,7 @@
caption=original_file_name,
caption_visible=False,
field_headings=[
'<span class="govuk-visually-hidden">Row in file</span><span aria-hidden="true">1</span>'|safe
'<span class="visually-hidden">Row in file</span><span aria-hidden="true">1</span>'|safe
] + recipients.column_headers
) %}
{% call index_field() %}

4
app/templates/views/check/row-errors.html
View File

@@ -8,7 +8,7 @@
{% set file_contents_header_id = 'file-preview' %}
{% macro skip_to_file_contents() %}
<p class="govuk-visually-hidden">
<p class="visually-hidden">
<a href="#{{ file_contents_header_id }}">Skip to file contents</a>
</p>
{% endmacro %}
@@ -64,7 +64,7 @@
caption=original_file_name,
caption_visible=False,
field_headings=[
'<span class="govuk-visually-hidden">Row in file</span><span aria-hidden="true" class="table-field-invisible-error">1</span>'|safe
'<span class="visually-hidden">Row in file</span><span aria-hidden="true" class="table-field-invisible-error">1</span>'|safe
] + recipients.column_headers
) %}
{% call index_field() %}

2
app/templates/views/choose-account.html
View File

@@ -53,7 +53,7 @@
{% block maincolumn_content %}
<h1 class="heading-large {% if current_user.has_access_to_live_and_trial_mode_services %}govuk-visually-hidden{% endif %}">
<h1 class="heading-large {% if current_user.has_access_to_live_and_trial_mode_services %}visually-hidden{% endif %}">
Choose service
</h1>

2
app/templates/views/dashboard/dashboard.html
View File

@@ -14,7 +14,7 @@
<div class="dashboard">
<h1 class="govuk-visually-hidden">Dashboard</h1>
<h1 class="visuallyhidden">Dashboard</h1>
{% if current_user.has_permissions('manage_templates') and not current_service.all_templates %}
{% include 'views/dashboard/write-first-messages.html' %}
{% endif %}

37
app/templates/views/organisations/add-organisation.html
View File

@@ -9,32 +9,29 @@
New organisation
{% endblock %}
{% block main %}
<div class="govuk-width-container">
{% block fullwidth_content %}
<div id="content">
<div class="navigation-service">
<a href="{{ url_for('.organisations') }}" class="navigation-service-back-to">All organisations</a>
<a href="{{ url_for('main.choose_account') }}" class="navigation-service-switch">Switch service</a>
</div>
<div class="grid-row">
<div class="column-one-quarter">
&nbsp;
<main role="main">
<div class="grid-row">
<div class="column-one-quarter">
&nbsp;
</div>
<div class="column-three-quarters">
{{ page_header('New organisation') }}
{% call form_wrapper() %}
{{textbox(form.name)}}
{{radios(form.organisation_type)}}
{{radios(form.crown_status)}}
{{ page_footer('Save') }}
{% endcall %}
</div>
</div>
<div class="column-three-quarters">
<main class="govuk-main-wrapper column-main govuk-!-padding-top-0 govuk-!-padding-bottom-0" id="main-content" role="main" >
{% block beforeContent %}{% endblock %}
{% block content %}
{{ page_header('New organisation') }}
{% call form_wrapper() %}
{{textbox(form.name)}}
{{radios(form.organisation_type)}}
{{radios(form.crown_status)}}
{{ page_footer('Save') }}
{% endcall %}
{% endblock %}
</main>
</div>
</div>
</main>
</div>
{% endblock %}

75
app/templates/views/organisations/index.html
View File

@@ -7,10 +7,9 @@
All organisations
{% endblock %}
{% block beforeContent %}{% endblock %}
{% block maincolumn_content %}
{% block fullwidth_content %}
<div id="content">
<div class="navigation-service">
<div class="navigation-service-name">
&nbsp;
@@ -18,45 +17,47 @@
<a href="{{ url_for('main.choose_account') }}" class="navigation-service-switch">Switch service</a>
</div>
<div class="grid-row top-gutter-2-3">
<div class="column-one-quarter">
<h1>
All organisations
</h1>
</div>
<div class="column-three-quarters">
{{ live_search(target_selector='.browse-list-item', show=True, form=search_form, label='Search by name') }}
<nav class="browse-list">
<ul>
{% for org in organisations %}
<li class="browse-list-item">
<a href="{{ url_for('main.organisation_dashboard', org_id=org.id) }}" class="browse-list-link">{{ org.name }}</a>
<p class="browse-list-hint">
{{ org.count_of_live_services }}
live service{% if org.count_of_live_services != 1 %}s{% endif %}
</p>
{% if not org.active %}
<span class="table-field-status-default heading-medium">- archived</span>
{% endif %}
</li>
{% endfor %}
</ul>
</nav>
</div>
</div>
<div class="js-stick-at-bottom-when-scrolling">
<div class="grid-row">
<main role="main">
<div class="grid-row top-gutter-2-3">
<div class="column-one-quarter">
&nbsp;
<h1>
All organisations
</h1>
</div>
<div class="column-three-quarters">
<a href="{{ url_for('main.add_organisation') }}" class="button-secondary">New organisation</a>
{{ live_search(target_selector='.browse-list-item', show=True, form=search_form, label='Search by name') }}
<nav class="browse-list">
<ul>
{% for org in organisations %}
<li class="browse-list-item">
<a href="{{ url_for('main.organisation_dashboard', org_id=org.id) }}" class="browse-list-link">{{ org.name }}</a>
<p class="browse-list-hint">
{{ org.count_of_live_services }}
live service{% if org.count_of_live_services != 1 %}s{% endif %}
</p>
{% if not org.active %}
<span class="table-field-status-default heading-medium">- archived</span>
{% endif %}
</li>
{% endfor %}
</ul>
</nav>
</div>
</div>
</div>
<div class="js-stick-at-bottom-when-scrolling">
<div class="grid-row">
<div class="column-one-quarter">
&nbsp;
</div>
<div class="column-three-quarters">
<a href="{{ url_for('main.add_organisation') }}" class="button-secondary">New organisation</a>
</div>
</div>
</div>
</main>
</div>
{% endblock %}

2
app/templates/views/register.html
View File

@@ -18,7 +18,7 @@ Create an account
<div class="extra-tracking">
{{ textbox(form.mobile_number, width='3-4', hint='We’ll send you a security code by text message') }}
</div>
<input class="govuk-visually-hidden" aria-hidden="true" tabindex="-1" id="defeat-chrome-autocomplete">
<input class="visually-hidden" aria-hidden="true" tabindex="-1" id="defeat-chrome-autocomplete">
{{ textbox(form.password, hint="At least 8 characters", width='3-4', autocomplete='new-password') }}
{{form.auth_type}}
{{ page_footer("Continue") }}

14
app/templates/views/signedout.html
View File

@@ -4,11 +4,11 @@
<meta name="description" content="GOV.UK Notify lets you send emails, text messages and letters to your users. Try it now if you work in central government, a local authority, or the NHS.">
{% endblock %}
{% block pageTitle %}
{% block page_title %}
GOV.UK Notify
{% endblock %}
{% block content %}
{% block maincolumn_content %}
<div class="product-page-intro">
<div class="product-page-intro-wrapper override-elements-content" id="content">
@@ -119,12 +119,12 @@
<h2>Who’s using GOV.UK Notify</h2>
<div class="grid-row bottom-gutter">
<div class="column-half">
<h3 class="govuk-visually-hidden">Services</h3>
<h3 class="visually-hidden">Services</h3>
<div class="product-page-big-number">{{ counts.services|format_thousands }}</div>
services
</div>
<div class="column-half">
<h3 class="govuk-visually-hidden">Organisations</h3>
<h3 class="visually-hidden">Organisations</h3>
<div class="product-page-big-number">{{ counts.organisations|format_thousands }}</div>
organisations
</div>
@@ -140,18 +140,18 @@
<h2>Pricing</h2>
<div class="grid-row bottom-gutter">
<div class="column-half">
<h3 class="govuk-visually-hidden">Emails</h3>
<h3 class="visually-hidden">Emails</h3>
<div class="product-page-big-number">Unlimited</div>
free emails
</div>
<div class="column-half">
<h3 class="govuk-visually-hidden">Text messages</h3>
<h3 class="visually-hidden">Text messages</h3>
<div class="product-page-big-number">Up to 250,000</div>
free text messages a year,<br>
then 1.58 pence per message
</div>
<div class="column-half">
<h3 class="govuk-visually-hidden">Letters</h3>
<h3 class="visually-hidden">Letters</h3>
<div class="product-page-big-number">35 pence</div>
to print and post a one page letter
</div>

6
app/templates/views/templates/_move_to.html
View File

@@ -15,7 +15,7 @@
</div>
<div id="move_to_new_folder_form">
<fieldset class="js-will-stick-at-bottom-when-scrolling">
<legend class="govuk-visually-hidden">Add to new folder</legend>
<legend class="visuallyhidden">Add to new folder</legend>
{{ textbox(templates_and_folders_form.move_to_new_folder_name, width='1-1') }}
{{ page_footer('Add to new folder', button_name='operation', button_value='move-to-new-folder') }}
</fieldset>
@@ -23,7 +23,7 @@
{% endif %}
<div id="add_new_folder_form">
<fieldset class="js-will-stick-at-bottom-when-scrolling">
<legend class="govuk-visually-hidden">Add new folder</legend>
<legend class="visuallyhidden">Add new folder</legend>
{{ textbox(templates_and_folders_form.add_new_folder_name, width='1-1') }}
{{ page_footer('Add new folder', button_name='operation', button_value='add-new-folder') }}
</fieldset>
@@ -36,7 +36,7 @@
{{ page_footer('Continue', button_name='operation', button_value='add-new-template') }}
</div>
</div>
<div class="selection-counter govuk-visually-hidden" role="status" aria-live="polite">
<div class="selection-counter visuallyhidden" role="status" aria-live="polite">
Nothing selected
</div>
</div>

31
app/templates/withnav_template.html
View File

@@ -1,13 +1,11 @@
{% extends "admin_template.html" %}
{% set mainClasses = "govuk-!-padding-top-0 govuk-!-padding-bottom-0" %}
{% block per_page_title %}
{% block service_page_title %}{% endblock %} – {{ current_service.name }}
{% endblock %}
{% block main %}
<div class="govuk-width-container">
{% block fullwidth_content %}
<div id="content">
<div class="navigation-service">
{% if current_service.organisation_id %}
{% if current_user.platform_admin or
@@ -20,27 +18,22 @@
</div>
<a href="{{ url_for('main.choose_account') }}" class="navigation-service-switch">Switch service</a>
</div>
<div class="grid-row govuk-!-padding-bottom-12">
<div class="grid-row">
{% if help %}
<div class="column-one-third">
{% else %}
<div class="column-one-quarter">
{% endif %}
{% include "main_nav.html" %}
</div>
{% if help %}
<div class="column-two-thirds">
{% else %}
<div class="column-three-quarters">
{% endif %}
{% block beforeContent %}{% endblock %}
<main class="govuk-main-wrapper column-main {{ mainClasses }}" id="main-content" role="main">
{% block content %}
{% include 'flash_messages.html' %}
{% block maincolumn_content %}{% endblock %}
{% endblock %}
</main>
{% include "main_nav.html" %}
</div>
{% if help %}
<main role="main" class="column-two-thirds column-main">
{% else %}
<main role="main" class="column-three-quarters column-main">
{% endif %}
{% include 'flash_messages.html' %}
{% block maincolumn_content %}{% endblock %}
</main>
</div>
</div>
{% endblock %}

15
app/templates/withoutnav_template.html
View File

@@ -1,16 +1,15 @@
{% extends "admin_template.html" %}
{% set mainClasses = "govuk-!-padding-top-0 govuk-!-padding-bottom-12" %}
{% block beforeContent %}
{% block fullwidth_content %}
<div id="content">
{% if current_service and current_service.active and current_user.is_authenticated and current_user.belongs_to_service(current_service.id) %}
<div class="navigation-service">
<a href="{{ url_for('main.show_accounts_or_dashboard') }}" class="navigation-service-back-to">Back to {{ current_service.name }}</a>
</div>
{% endif %}
{% endblock %}
{% block content %}
{% include 'flash_messages.html' %}
{% block maincolumn_content %}{% endblock %}
<main role="main">
{% include 'flash_messages.html' %}
{% block maincolumn_content %}{% endblock %}
</main>
</div>
{% endblock %}

159
gulpfile.js
View File

@@ -6,16 +6,12 @@
// 1. LIBRARIES
// - - - - - - - - - - - - - - -
const { src, pipe, dest, series, parallel, watch } = require('gulp');
const rollupPluginCommonjs = require('rollup-plugin-commonjs');
const rollupPluginNodeResolve = require('rollup-plugin-node-resolve');
const streamqueue = require('streamqueue');
const stylish = require('jshint-stylish');
const plugins = {};
plugins.addSrc = require('gulp-add-src');
plugins.babel = require('gulp-babel');
plugins.base64 = require('gulp-base64-inline');
plugins.rollup = require('gulp-better-rollup')
plugins.concat = require('gulp-concat');
plugins.cssUrlAdjuster = require('gulp-css-url-adjuster');
plugins.jshint = require('gulp-jshint');
@@ -31,8 +27,8 @@ const paths = {
dist: 'app/static/',
templates: 'app/templates/',
npm: 'node_modules/',
toolkit: 'node_modules/govuk_frontend_toolkit/',
govuk_frontend: 'node_modules/govuk-frontend/'
template: 'node_modules/govuk_template_jinja/',
toolkit: 'node_modules/govuk_frontend_toolkit/'
};
// 3. TASKS
@@ -41,49 +37,70 @@ const paths = {
// Move GOV.UK template resources
const copy = {
error_pages: () => {
return src(paths.src + 'error_pages/**/*')
.pipe(dest(paths.dist + 'error_pages/'))
},
govuk_frontend: {
govuk_template: {
template: () => {
return src(paths.template + 'views/layouts/govuk_template.html')
.pipe(dest(paths.templates));
},
css: () => {
return src(paths.template + 'assets/stylesheets/**/*.css')
.pipe(plugins.sass({
outputStyle: 'compressed'
}))
.on('error', plugins.sass.logError)
.pipe(plugins.cssUrlAdjuster({
prependRelative: process.env.NOTIFY_ENVIRONMENT == 'development' ? '/static/' : '/',
}))
.pipe(dest(paths.dist + 'stylesheets/'));
},
js: () => {
return src(paths.template + 'assets/javascripts/**/*.js')
.pipe(plugins.uglify())
.pipe(dest(paths.dist + 'javascripts/'));
},
images: () => {
return src(paths.template + 'assets/stylesheets/images/**/*')
.pipe(dest(paths.dist + 'images/'));
},
fonts: () => {
return src(paths.govuk_frontend + 'assets/fonts/**/*')
return src(paths.template + 'assets/stylesheets/fonts/**/*')
.pipe(dest(paths.dist + 'fonts/'));
},
error_page: () => {
return src(paths.src + 'error_pages/**/*')
.pipe(dest(paths.dist + 'error_pages/'))
}
}
};
const javascripts = () => {
// JS from third-party sources
// We assume none of it will need to pass through Babel
const vendored = src(paths.src + 'javascripts/modules/all.mjs')
// Use Rollup to combine all JS in JS module format into a Immediately Invoked Function
// Expression (IIFE) to:
// - deliver it in one bundle
// - allow it to run in browsers without support for JS Modules
.pipe(plugins.rollup(
{
plugins: [
// determine module entry points from either 'module' or 'main' fields in package.json
rollupPluginNodeResolve({
mainFields: ['module', 'main']
}),
// gulp rollup runs on nodeJS so reads modules in commonJS format
// this adds node_modules to the require path so it can find the GOVUK Frontend modules
rollupPluginCommonjs({
include: 'node_modules/**'
})
]
},
{
format: 'iife',
name: 'GOVUK'
}
))
// return a stream which pipes these files before the JS modules bundle
return src([
paths.toolkit + 'javascripts/govuk/modules.js',
paths.toolkit + 'javascripts/govuk/show-hide-content.js',
paths.src + 'javascripts/stick-to-window-when-scrolling.js',
paths.src + 'javascripts/detailsPolyfill.js',
paths.src + 'javascripts/apiKey.js',
paths.src + 'javascripts/autofocus.js',
paths.src + 'javascripts/enhancedTextbox.js',
paths.src + 'javascripts/fileUpload.js',
paths.src + 'javascripts/radioSelect.js',
paths.src + 'javascripts/updateContent.js',
paths.src + 'javascripts/listEntry.js',
paths.src + 'javascripts/liveSearch.js',
paths.src + 'javascripts/errorTracking.js',
paths.src + 'javascripts/preventDuplicateFormSubmissions.js',
paths.src + 'javascripts/fullscreenTable.js',
paths.src + 'javascripts/previewPane.js',
paths.src + 'javascripts/colourPreview.js',
paths.src + 'javascripts/templateFolderForm.js',
paths.src + 'javascripts/collapsibleCheckboxes.js',
paths.src + 'javascripts/main.js'
])
.pipe(plugins.prettyerror())
.pipe(plugins.babel({
presets: ['@babel/preset-env']
}))
.pipe(plugins.addSrc.prepend([
paths.npm + 'hogan.js/dist/hogan-3.0.2.js',
paths.npm + 'jquery/dist/jquery.min.js',
@@ -91,41 +108,7 @@ const javascripts = () => {
paths.npm + 'diff-dom/diffDOM.js',
paths.npm + 'timeago/jquery.timeago.js',
paths.npm + 'textarea-caret/index.js'
]));
// JS local to this application
const local = src([
paths.toolkit + 'javascripts/govuk/modules.js',
paths.toolkit + 'javascripts/govuk/show-hide-content.js',
paths.src + 'javascripts/govuk/cookie-functions.js',
paths.src + 'javascripts/cookieMessage.js',
paths.src + 'javascripts/stick-to-window-when-scrolling.js',
paths.src + 'javascripts/detailsPolyfill.js',
paths.src + 'javascripts/apiKey.js',
paths.src + 'javascripts/autofocus.js',
paths.src + 'javascripts/enhancedTextbox.js',
paths.src + 'javascripts/fileUpload.js',
paths.src + 'javascripts/radioSelect.js',
paths.src + 'javascripts/updateContent.js',
paths.src + 'javascripts/listEntry.js',
paths.src + 'javascripts/liveSearch.js',
paths.src + 'javascripts/errorTracking.js',
paths.src + 'javascripts/preventDuplicateFormSubmissions.js',
paths.src + 'javascripts/fullscreenTable.js',
paths.src + 'javascripts/previewPane.js',
paths.src + 'javascripts/colourPreview.js',
paths.src + 'javascripts/templateFolderForm.js',
paths.src + 'javascripts/collapsibleCheckboxes.js',
paths.src + 'javascripts/main.js'
])
.pipe(plugins.prettyerror())
.pipe(plugins.babel({
presets: ['@babel/preset-env']
}));
// return single stream of all vinyl objects piped from the end of the vendored stream, then
// those from the end of the local stream
return streamqueue({ objectMode: true }, vendored, local)
]))
.pipe(plugins.uglify())
.pipe(plugins.concat('all.js'))
.pipe(dest(paths.dist + 'javascripts/'))
@@ -133,14 +116,13 @@ const javascripts = () => {
const sass = () => {
return src([paths.src + '/stylesheets/main*.scss', paths.src + '/stylesheets/print.scss'])
return src(paths.src + '/stylesheets/main*.scss')
.pipe(plugins.prettyerror())
.pipe(plugins.sass({
outputStyle: 'compressed',
includePaths: [
paths.npm + 'govuk-elements-sass/public/sass/',
paths.toolkit + 'stylesheets/',
paths.govuk_frontend,
paths.toolkit + 'stylesheets/'
]
}))
.pipe(plugins.base64('../..'))
@@ -154,8 +136,7 @@ const images = () => {
return src([
paths.src + 'images/**/*',
paths.toolkit + 'images/**/*',
paths.template + 'assets/images/**/*',
paths.govuk_frontend + 'assets/images/**/*'
paths.template + 'assets/images/**/*'
])
.pipe(dest(paths.dist + 'images/'))
};
@@ -195,9 +176,7 @@ const lint = {
.pipe(plugins.sassLint.failOnError());
},
'js': (cb) => {
return src(
paths.src + 'javascripts/**/*.js'
)
return src(paths.src + 'javascripts/**/*.js')
.pipe(plugins.jshint())
.pipe(plugins.jshint.reporter(stylish))
.pipe(plugins.jshint.reporter('fail'))
@@ -208,14 +187,16 @@ const lint = {
// Default: compile everything
const defaultTask = parallel(
series(
copy.govuk_frontend.fonts,
copy.govuk_template.template,
copy.govuk_template.images,
copy.govuk_template.fonts,
copy.govuk_template.css,
copy.govuk_template.js,
images
),
series(
copy.error_pages,
series(
javascripts
),
copy.govuk_template.error_page,
javascripts,
sass
)
);

9
package.json
View File

@@ -21,16 +21,15 @@
"dependencies": {
"@babel/core": "7.4.0",
"@babel/preset-env": "7.4.2",
"del": "5.1.0",
"diff-dom": "2.5.1",
"govuk-elements-sass": "3.1.2",
"govuk-frontend": "2.13.0",
"govuk_frontend_toolkit": "8.1.0",
"govuk_template_jinja": "0.24.1",
"gulp": "4.0.0",
"gulp-add-src": "1.0.0",
"gulp-babel": "8.0.0",
"gulp-base64-inline": "1.0.4",
"gulp-better-rollup": "4.0.1",
"gulp-concat": "2.6.1",
"gulp-include": "2.3.1",
"gulp-sass": "4.0.2",
@@ -38,8 +37,6 @@
"hogan": "1.0.2",
"jquery": "3.4.1",
"query-command-supported": "1.0.0",
"rollup": "1.23.1",
"streamqueue": "1.1.2",
"textarea-caret": "3.1.0",
"timeago": "1.6.5"
},
@@ -50,8 +47,6 @@
"gulp-sass-lint": "1.4.0",
"jest": "24.7.1",
"jshint": "2.10.2",
"jshint-stylish": "2.2.1",
"rollup-plugin-commonjs": "10.1.0",
"rollup-plugin-node-resolve": "5.2.0"
"jshint-stylish": "2.2.1"
}
}

10
tests/app/main/views/accounts/test_choose_accounts.py
View File

@@ -88,7 +88,7 @@ def test_choose_account_should_show_choose_accounts_page(
mock_get_organisation,
):
resp = client_request.get('main.choose_account')
page = resp.find('main', {'id': 'main-content'})
page = resp.find('div', {'id': 'content'}).main
assert normalize_spaces(page.h1.text) == 'Choose service'
outer_list_items = page.select('nav ul')[0].select('li')
@@ -144,7 +144,7 @@ def test_choose_account_should_show_choose_accounts_page_if_no_services(
'services': []
}
resp = client_request.get('main.choose_account')
page = resp.find('main', {'id': 'main-content'})
page = resp.find('div', {'id': 'content'}).main
links = page.findAll('a')
assert len(links) == 1
@@ -182,8 +182,8 @@ def test_choose_account_should_show_back_to_service_link(
):
resp = client_request.get('main.choose_account')
service_navigation = resp.find('div', {'class': 'navigation-service'})
back_to_service_link = service_navigation.a
page = resp.find('div', {'id': 'content'})
back_to_service_link = page.find('div', {'class': 'navigation-service'}).a
assert back_to_service_link['href'] == url_for('main.show_accounts_or_dashboard')
assert back_to_service_link.text == 'Back to service one'
@@ -273,7 +273,7 @@ def test_should_not_show_back_to_service_if_user_doesnt_belong_to_service(
)
assert normalize_spaces(
page.select_one('header + .govuk-width-container').text
page.select_one('#content').text
).startswith(
normalize_spaces(page_text)
)

4
tests/app/main/views/test_index.py
View File

@@ -172,8 +172,10 @@ def test_css_is_served_from_correct_path(client_request):
page.select('link[rel=stylesheet]')
):
assert link['href'].startswith([
'https://static.example.com/stylesheets/govuk-template.css?',
'https://static.example.com/stylesheets/govuk-template-print.css?',
'https://static.example.com/stylesheets/fonts.css?',
'https://static.example.com/stylesheets/main.css?',
'https://static.example.com/stylesheets/print.css?',
][index])

5
tests/app/main/views/test_notifications.py
View File

@@ -227,9 +227,10 @@ def test_notification_page_shows_page_for_letter_notification(
letter_images = page.select('main img')
assert len(letter_images) == count_of_pages
for index in range(count_of_pages):
for index in range(1, count_of_pages + 1):
assert page.select('img')[index]['src'].endswith(
'.png?page={}'.format(index + 1)
'.png?page={}'.format(index)
)
assert len(mock_page_count.call_args_list) == 1

2
tests/app/main/views/test_send.py
View File

@@ -94,7 +94,7 @@ def test_show_correct_title_and_description_for_sender_type(
assert page.select_one('h1').text == expected_title
for element in ('legend', 'legend .govuk-visually-hidden'):
for element in ('legend', 'legend .visually-hidden'):
assert normalize_spaces(page.select_one(element).text) == expected_description

4
tests/app/main/views/test_service_settings.py
View File

@@ -1187,8 +1187,8 @@ def test_non_gov_user_is_told_they_cant_go_live(
assert normalize_spaces(page.select_one('main p').text) == (
'Only team members with a government email address can request to go live.'
)
assert len(page.select('form')) == 0
assert len(page.select('button')) == 1
assert page.select('form') == []
assert page.select('button') == []
@pytest.mark.parametrize('consent_to_research, displayed_consent', (

2
tests/app/main/views/test_template_folders.py
View File

@@ -835,7 +835,7 @@ def test_delete_template_folder_should_request_confirmation(
assert page.select_one('input[name=name]')['value'] == 'sacrifice'
assert len(page.select('form')) == 2
assert len(page.select('button')) == 3
assert len(page.select('button')) == 2
assert 'action' not in page.select('form')[0]
assert page.select('form button')[0].text == 'Yes, delete'

6
tests/app/test_navigation.py
View File

@@ -124,7 +124,7 @@ def test_a_page_should_nave_selected_header_navigation_item(
selected_nav_item,
):
page = client_request.get(endpoint, service_id=SERVICE_ONE_ID)
selected_nav_items = page.select('.govuk-header__navigation-item--active')
selected_nav_items = page.select('#proposition-links a.active')
assert len(selected_nav_items) == 1
assert selected_nav_items[0].text.strip() == selected_nav_item
@@ -179,7 +179,7 @@ def test_caseworkers_get_caseworking_navigation(
return_value=active_caseworking_user(fake_uuid)
)
page = client_request.get('main.choose_template', service_id=SERVICE_ONE_ID)
assert normalize_spaces(page.select_one('header + .govuk-width-container nav').text) == (
assert normalize_spaces(page.select_one('#content nav').text) == (
'Templates Sent messages Team members'
)
@@ -197,6 +197,6 @@ def test_caseworkers_see_jobs_nav_if_jobs_exist(
return_value=active_caseworking_user(fake_uuid)
)
page = client_request.get('main.choose_template', service_id=SERVICE_ONE_ID)
assert normalize_spaces(page.select_one('header + .govuk-width-container nav').text) == (
assert normalize_spaces(page.select_one('#content nav').text) == (
'Templates Sent messages Uploads Team members'
)

2
tests/javascripts/collapsibleCheckboxes.test.js
View File

@@ -113,7 +113,7 @@ describe('Collapsible fieldset', () => {
const legend = helpers.element(fieldset.querySelector('legend'));
expect(legend.hasClass('govuk-visually-hidden')).toBe(true);
expect(legend.hasClass('visuallyhidden')).toBe(true);
});