Commit Graph

731 Commits

Author SHA1 Message Date
Chris Hill-Scott
954f43ae48 Let users archive their own trial mode services
At the moment we have a blanket rule that users can’t archive their own
services, to prevent someone accidentally deleting a real live service,
because that would be Very Bad.

But the tickets we get from users asking us to delete services are for
services they set up when they were just trying out Notify. There’s not
much harm in letting users delete these services, the consequences of
doing so are much lower than those of deleting a live service. And it
should mean fewer support tickets for us to deal with.
2019-06-04 09:45:51 +01:00
Chris Hill-Scott
3deff78a75 Merge pull request #2988 from alphagov/loading-spacing
Remove spacing tweak on loading indicator
2019-05-30 13:54:32 +01:00
Pea Tyczynska
6cf9959058 Stop AJAX when success or failure and show form on failure
AJAX requests stop on success or failure, as the waiting page
does not have to referesh any longer.

Also on failure a form that allows user to try again
is shown.
2019-05-23 15:34:25 +01:00
Chris Hill-Scott
3137c5acf6 Remove spacing tweak on loading indicator
It’s not needed when there’s no whitespace around the text.
2019-05-23 11:34:34 +01:00
Tom Byers
a0ecbe473e Merge pull request #2957 from alphagov/add-js-tests-for-list-entry
Add JS tests for list entry module
2019-05-17 13:36:52 +01:00
Chris Hill-Scott
2dc731c2d8 Merge pull request #2971 from alphagov/loading-indicator
Add a loading indicator component
2019-05-17 11:18:14 +01:00
Tom Byers
a6f39c08de Dedupe list-entry shared attributes
The `getSharedAttributes` method gathers all
attributes, and [DOM tokens](https://developer.mozilla.org/en-US/docs/Web/API/Element/classList)
in the `class` attribute not controlled by the
module for re-applying in the `render` method.

Because it gathered them for all items, many
duplicates ended up being added to new items.

Browser engines were tidying up the duplicates
but we shouldn't be adding them in the first
place.
2019-05-16 15:36:46 +01:00
Tom Byers
84b02ee57a Remove reference to global 'this' from listEntry
Also removes setting of the `$` variable to
jQuery.

This can mess up the unit tests if they run
against JSDOM, which doesn't set the global `this`
to `window`, as browsers do.

We don't set `$` in any other module scripts and
adding it to `this` without making explicit that
`this` means `window` isn't useful.
2019-05-16 15:36:46 +01:00
Chris Hill-Scott
5b4edc92fd Add a loading indicator component
This will let us design a page which tells the user they need to wait.
2019-05-15 15:29:47 +01:00
Tom Byers
ccd09b9fd7 Revert "Merge pull request #2969 from alphagov/revert-2956-progressively-enhance-folder-permissions"
This reverts commit 8266f3d65c, reversing
changes made to b2a38fe222.
2019-05-15 14:26:51 +01:00
Tom Byers
0e6caa7fda Revert "Progressively enhance folder permissions" 2019-05-13 16:19:24 +01:00
Tom Byers
b2a38fe222 Merge pull request #2956 from alphagov/progressively-enhance-folder-permissions
Progressively enhance folder permissions
2019-05-13 14:41:43 +01:00
Tom Byers
6f12a39b58 Move folder-black.png image into correct folder
Was placed in app/assets/stylesheets/ by mistake
in fe457464a8
2019-05-13 14:08:07 +01:00
Tom Byers
cd5f6251d1 Adjust selection summary spacing
Co-Authored-By: Chris Hill-Scott <me@quis.cc>
2019-05-13 13:15:45 +01:00
Tom Byers
bbc962298c Make selection summary use tabular numbers
Stops them jumping around as much when the numbers change. As requested in: https://github.com/alphagov/notifications-admin/pull/2956/files#r283271635

Co-Authored-By: Chris Hill-Scott <me@quis.cc>
2019-05-13 13:07:28 +01:00
Tom Byers
fe457464a8 Fixes for folder .svg icon
Match format of .svg file to others in the same
folder to fix issues in IE11.

Add a .png alternative for IE8 users.
2019-05-10 14:59:31 +01:00
Tom Byers
d75c26eb83 Make done button, and its surround, sticky 2019-05-10 14:21:58 +01:00
Tom Byers
19b68048d0 Fix undefined local variables in sticky JS
Running the sticky JS in Jest raised errors due to
these variables not being assigned properly.

It's JavaScript so any variable not defined by the
`var` prefix will automatically become a property
of the global object. That is not what is intended
by the code so requires changing.
2019-05-10 14:20:44 +01:00
Tom Byers
bb16626209 Split module out into objects for each component
Is clearer than just having one large hierarchical
object and makes the relationships between the
module and its components clearer.
2019-05-10 14:20:14 +01:00
Tom Byers
7328649537 Combine 'Change' and 'Done' buttons into one
Includes addition of classes by JS to ensure CSS
selectors don't have to reference the data
attributes.
2019-05-10 14:16:03 +01:00
Chris Hill-Scott
923ac7190c Add a hint when no team members are selected
This helps clarify that you will still be able to see the folder.
Follows the phrasing used for the "No folders…" message.
2019-05-09 13:43:04 +01:00
Tom Byers
1ffa8c8915 Only show the folder icon if fields are folders 2019-05-09 11:25:28 +01:00
Chris Hill-Scott
3dc2130926 Align baseline of summary text with button text 2019-05-09 10:30:46 +01:00
Chris Hill-Scott
89478ac2ca Use larger folder icon 2019-05-09 10:27:14 +01:00
Chris Hill-Scott
f274759cd8 Add larger version of black folder icon
This is for use in the folder permissions UI. It’s designed to be sized
at the same width as a GOV.UK style checkbox. The CSS to render it is
something like:

```css
background-image: file-url('folder-black.svg');
background-repeat: no-repeat;
background-size: 39px auto;
background-position: 0px 4px;
```
2019-05-09 10:21:30 +01:00
Tom Byers
db12ec3a5c Make buttons work outside of context
This is important for users who find buttons via
interfaces that present them out of the context of
the page, like screenreaders.
2019-05-08 17:16:08 +01:00
Tom Byers
42a9a0cf23 Make selection summary a live region
Live regions need to be in the original HTML of
the page to work. We were generating the summary
in JS.

This changes the JS to only generate the contents
of the summary so changes to its contents are
announces by the existing live-region.
2019-05-08 17:16:06 +01:00
Tom Byers
33d074c00a Allow nested checkboxes to be collapsible
Expands the API of the macro to allow nested
checkboxes to have a summary tracking the current
selection, the fieldset to expand/collapse and
buttons to be added to allow jumping between
states.

Includes making 'Done' button inline on mobile.
Helps differentiate it form the form submit.
2019-05-08 17:08:16 +01:00
Tom Byers
20a94910cb Give permissions form legend heading styles
Also includes putting the text at the foot of the
checkboxes into a hint below the legend.
2019-05-08 11:35:58 +01:00
Chris Hill-Scott
a67e14b900 Even out the spacing a bit 2019-05-02 14:17:14 +01:00
Chris Hill-Scott
078e9bc7a4 Say ‘done’ not ‘back’
We use ‘back’ to label a control which navigates to a previous page now.
It could be confusing to keep this control labelled the same way. And
in the future the folder permissions interaction definitely shouldn’t be
using ‘back’, because it suggests undoing the selection you’ve made.
2019-05-02 11:29:24 +01:00
Chris Hill-Scott
71835a4182 Style radio select controls as buttons
For the upcoming user permissions enhancements we want to differentiate
between actions that take the user to a new page (eg changing a user’s
phone number or email address) and actions that reveal extra controls in
the current page (which will be changing the folders a team member can
see).

This change will be inconsistent with the interaction for scheduling a
job, which uses links to reveal other controls in the page.

This commit changes the scheduling interaction to use grey ‘secondary’
buttons for revealing extra controls in the page, for consistency with
the upcoming folder permissions work.
2019-05-02 11:19:29 +01:00
Chris Hill-Scott
74638f4cd0 Use proper icon for breadcrumb
Uses the asset from the GOV.UK Frontend Toolkit.
2019-04-30 16:03:27 +01:00
Chris Hill-Scott
8ad58d641c Fix vertical position of ‘Manage’ link
This doesn’t line up now that the heading sizes have changed.
2019-04-30 15:30:31 +01:00
Chris Hill-Scott
d9da63401f Normalise heading sizes
Since we added template folders the templates page has had a ‘medium’
sized heading, where other pages have stuck with a ‘large’ size.

This commit rationalises the decision around which pages have which
heading size:
- ‘navigation’ pages (eg templates, team members, email reply to
  addresses) have medium sized headings
- transactional pages (ie ones which have a green button) keep the
  larger heading size
2019-04-30 15:30:31 +01:00
Chris Hill-Scott
75bbf4f45c Remove back link arguments to page footer
We’ve stopped using them in favour of putting any ‘back’ link at the top
of the page. This commit removes them from the macro to make sure we
don’t accidentally reintroduce them.
2019-04-30 15:29:40 +01:00
Chris Hill-Scott
0f449087e8 Increase hit area of back link
The GOV.UK Design System back link component is sized (roughly) to the
contain the text and icon. Presumably this is so it’s safe to use in
various contexts.

Since we have control over the context is which it’s used, we can get
away with making the click area larger – in accordance with Fitt’s law –
without risking overlapping other page elements.
2019-04-30 15:29:40 +01:00
Chris Hill-Scott
74fb30ce5f Add GOV.UK Design System style back links
The Design System has standardised on back links being at the top of the
page, decorated with a small text-coloured arrow.

I think this makes more sense than having them at the bottom, because it
suggests, in some way, being able to go back before commiting to any of
the forms on the page. Whereas the things at the bottom of the page
should be performing actions on what’s in the page.

The reason for making this change now is that it de-clutters the area
around the green buttons. This was presenting a design challenge where
multiple levels of interaction were happening in the same form. Moving
these back links to the top of the page should mean that, in these
complicated forms, there’s one fewer thing to compete for the user’s
attention.

I’ve componentised this into a `page_header` macro so that the change is
easier to roll out and maintain.
2019-04-30 15:29:39 +01:00
Chris Hill-Scott
0f2f9fa946 Merge pull request #2931 from alphagov/rationalise-settings
Allow more space for values in settings tables
2019-04-29 16:58:24 +01:00
Chris Hill-Scott
0512f40ad3 Fix misleading class name
Not sure where this came from, but visually our tables have always
aligned text to the left by default.
2019-04-29 16:36:47 +01:00
Chris Hill-Scott
5340c4c2e8 Prefer CSS-native first child selector
This fits nicer with the block below and with the CSS further down that
applies certain styles for the first cell using `:first-child` too.
2019-04-29 16:25:06 +01:00
Chris Hill-Scott
a1025111d9 Allow overflow on right-aligned table cells
The right aligned cells contain ‘Change’ links. These have a large
`border` to make the clickable area bigger. This commit removes the
`overflow: hidden` from these cells, so that the larger border remains
visible.
2019-04-26 11:43:41 +01:00
Chris Hill-Scott
bb19617bb1 Remove secondary and tertiary button styles
We don’t use them anywhere (at least not the definitions in this
stylesheet).
2019-04-25 17:16:14 +01:00
Chris Hill-Scott
da19c0b4ad Remove bullets from lists in tables
I think this is something we inherited from the Digital Marketplace
code. We only use this for organisation settings are the moment, but
the list markers are redundant because each item will never wrap onto a
new line; it will truncate instead. Still keeps a little sliver of
spacing just so it doesn’t look like a paragraph.
2019-04-24 16:11:32 +01:00
Chris Hill-Scott
5ac2abb7bc Make center column of table wider
Most of the content of our ‘settings’ tables is in the value, not the
key. The value is in the middle column. So we should allocate the most
space to the value.

The previous layout was based on the premise that most pages divided the
grid like this:
```
 _______ _______ _______ _______ _______ _______ _______ _______
|  1/8  |  1/8  |  1/8  |  1/8  |  1/8  |  1/8  |  1/8  |  1/8  |
|               |               |               |               |
|      2/8      |      2/8      |      2/8      |      2/8      |
|               |               |               |               |
|–Navigation––––|–Main column–––––––––––––––––––––––––––––––––––|
|               |                       |                       |
|               |          3/8          |          3/8          |
|               |                       |                       |
|               |–Label–––––––––––––––––|–Value––––––––––––Link–|
|               |                       |                       |
|_______________|_______________________|_______________________|
```

This was because a lot of pages had a left column for emails, and a
right column for text messages, so it felt consistent for tables to
always default to 50% of the width of the main column.

This consistency has faded with time, especially as we added letters.

So this commit changes these tables to allocate more space to the
central column, but still sticking to the grid like this:

```
 _______ _______ _______ _______ _______ _______ _______ _______
|  1/8  |  1/8  |  1/8  |  1/8  |  1/8  |  1/8  |  1/8  |  1/8  |
|       |       |       |       |       |       |       |       |
|      2/8      |      2/8      |              4/8              |
|               |               |                               |
|–Navigation––––|–Main column–––––––––––––––––––––––––––––––––––|
|               |               |                       |       |
|               |      2/8      |          3/8          |  1/8  |
|               |               |                       |       |
|               |–Label–––––––––|–Value–––––––––––––––––|–––Link|

|_______________|_______________|_______________________|_______|
```

Since there’s more space to display the value of a setting this commit
also truncates settings that are too long to fit in the width of the
column (for example a long email address) rather than the previous
behaviour of truncating them. This all just makes things look a bit
cleaner.
2019-04-24 16:11:32 +01:00
Tom Byers
b3d73030ee Remove use of spread operator
This is a temporary fix for the fact that the
babel plugin for the spread operator calls a
function called `_iterableToArray` which assumes
the JavaScript runtime supports Symbols.

IE11 doesn't support Symbols so this causes an
error when it runs our JS.

This swaps out use of the spread operator for a
use of
[apply](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/apply)
to unpack the `arguments` object.

Related issue on babel:

https://github.com/babel/babel/issues/7597
2019-04-17 12:40:49 +01:00
karlchillmaid
f3a2e695fb Merge pull request #2858 from alphagov/features-content-updates
Update features and footer content and answer some common support questions.
2019-04-16 15:42:51 +01:00
Chris Hill-Scott
0303d6a018 Indent sub navigation items 2019-04-16 15:19:28 +01:00
Tom Byers
1d88324175 Revert "Update diff-dom package to 3.1.0"
This reverts commit 01b97986f6.
2019-04-16 13:09:15 +01:00
Tom Byers
a8a29698cb Replace gulp-base64 with gulp-base64-inline
The gulp-base64 package has 11 dependencies with
vulnerabilities listed against them as of this
time. It also doesn't seem to be maintained any
more. The last commit was in 2015 and there are
issues and pull requests up to bump the
dependencies.

This replaces it with gulp-base64-inline.

gulp-base64-inline takes a single path, which it
prepends to any image paths it finds. Our image
paths are actually URLs, not filesystem paths so
we need to send it a relative path to repoint the
URL.

This commit includes changes that remove a few
`@import`s from one of our sass partials.

They aren't needed as those files are imported
further up the stack and `_typography.scss` has an
import in it that overwrites the new
`_url-helpers.scss` we added here.
2019-04-12 15:36:57 +01:00