This is part of the new header style that Tim, Stephen et al have been
working on.
This means that we lose the feedback link, so I’m trying out having it
in the top right.
This link looked odd floating above the left column, and although we may want
to have admin navigation on the left we aren't sure what that would include
yet, so move this link to the header alongside the Platform admin link.
> Make the header bar red
>
> Red for admin is a good reckon.
– 286fc308d9 (part of https://github.com/alphagov/notifications-admin/pull/130)
Starting to think it’s not such a good reckon. Users could take a guess
at what it meant, but they often guessed wrong.
However, changing the colour of the header bar _is_ useful for us
internally to see which environment we’re in. So this commit makes three
changes:
1. On live, the header bar is always standard GOV.UK blue
2. On other environments, the header bar is some other colour (local is
very different, staging and preview are related colours)
3. If an enviroment has a different header colour, it has it even when
you’re not logged in.
Because users have difficulty getting back to the Notify admin
interface.
The `rel` attribute mitigates against [a nasty cross-domain
vulnerability](https://mathiasbynens.github.io/rel-noopener/).
If all our URLs are unique (because they contain service/job/template
IDs) then it makes it hard to aggrate how users are behaving across a
range of services/jobs/templates.
This commit replaces anything that looks like a UUID in a URL with `…`.
In research we found that developers orientate themselves around the
API clients rather than the documentation.
We should get them to the client documentation as quickly as possible.
We currently link to the API documentation in three places:
- API integration page
- global footer
- template ‘API info’ page
For the first two this commit:
- removes the link to the documentation
- adds links to each of the 5 clients
For the last one it just removes the link entirely.
_The code for this is quite hacky and light on tests. But I’d really like to get
it in the app for the research tomorrow to see how well the feature works._
This commit changes the tour from being a set of static screens to some help
which guides you through the process of sending your first test message.
The theory behind this is that what users are really struggling with is the
concept of a variable, rather than the relationship between the placeholders and
the column headers. And like learning to program, the best way to learn is by
taking an example and modifying it to your own needs.
This means that when someone adds their first service we set them up an
example email template and an example text message template. Then there is a
guided, three step process where _all_ the user can do is send a test message to
themselves.
Once the message is sent, the user still has the example templates which they
can edit, rather than having to remember what they’re supposed to be doing.
When the user clicks ‘GOV.UK Notify’ in the header, they should, by
default, be redirected to the dashboard for their service. They should
only see the ‘Choose service’ page if they have multiple services.
This also allows some logic to be factored out of the template, so one
route now handles all this redirection.
In the future we might want to keep the last-used service in the
session, and always redirect to that. But for now, this should fix most
of the confusion for first-time users.
> We start in trial mode and there are a bunch of things that we need to know, so
> let's explain this with a page, accessed from the footer. Not requiring log in.
> Should explain:
> 50 messages per day
> Can only send to yourself or team members
> How to go live
> We can then link to this from the dashboard (and any other place) where we
> tell you that you're in trial mode.
https://www.pivotaltracker.com/story/show/115775751
https://www.pivotaltracker.com/story/show/113448149
This commit adds a query string to assets URLs which is generated from a hash
of the file contents. When asset files are changed they will now be served from
a different URL, which means they wont be loaded from browser cache.
This is similar to how GOV.UK template adds its version number as a querystring
parameter for its assets.
This is mostly copied from Digital Marketplace utils:
https://github.com/alphagov/digitalmarketplace-utils/pull/102
They have it in a shared codebase, we only have one frontend app so don’t need
to do that.
Usage in a template:
``` jinja
{{ asset_fingerprinter.get_url('stylesheets/application.css') }}
```
Output:
```
static/stylesheets/application.css?418e6f4a6cdf1142e45c072ed3e1c90a
```
Assistive technologies use the `<main>` element to navigate around a document.
In `<main>` their users expect to find:
> [content] unique to the document, excluding any content that is
> repeated across a set of documents such as sidebars, navigation links,
> copyright information, site logos, and search forms…
— https://developer.mozilla.org/en/docs/Web/HTML/Element/main
Previously, the `<main>` element also wrapped the sidebar navigation. This
commit moves the `<main>` element to only wrap the content of the page when the
page has a navigation sidebar.
This commit also removes the `page-container` class which wasn’t being used for
anything.
https://www.pivotaltracker.com/story/show/112786779
> There's an emerging convention on admin apps, to have a red strip atop the
> page, also to have a different colour for preview environment... so let's
> adopt that and see how it feels. Red for prod and gold for preview.
This commit adds config so that:
- yellow locally
- orange on preview and staging
- red on live
It will not actually work until each AWS environment uses the right config, but
can be tested locally by setting the environment variable manually, eg:
`export HEADER_COLOUR='#F47738'`
Banners should always be the first thing on the page.
Because headers already have padding we don’t want to put padding on the
container.
So banners should also have top padding to distance then from the red bar.
They should also sit in the 3/4 column if the page has side navigation. This
commit adds a new template (`withoutnav_template.html`) which extends
`admin_template.html`. All views then extend one or the other, never the
`admin_template.html` directly. This means that `admin_template.html` doesn’t
have to make decisions about where the flash messages are displayed.
There’s an argument to be made that the beta label should only apply to
the public-facing parts of services/platforms.
Removing it from here means that we don’t need to deal with the hassle of how it
fits into the navigation. If we have to bring it back then we could follow the
banner example here instead:
http://govuk-elements.herokuapp.com/alpha-beta-banners/#beta-banner
This commit moves user-related navigation into the proposition header (the black
bar) at the top of the site. It adds some custom SASS to override GOV.UK
template and align these navigation items to the right (because it looks
better).
It then removes the service chooser dropdown (and its associated SASS and JS) in
favour of a link alongside the user-related navigation items. ‘Switch service’
is the best language for this that we’ve come up with so far.
This means that the only way of adding a new service is from the `/services`
page. So this commit removes the redirect if you land on this page with only one
service (else it would prevent you from ever being able to add more).
