Forgot to include this before.
The template expects it in `./images` but it should probably live in
`./images/email-template`.
This commit puts it in both places; we can clean up later.
We need to host these images somewhere. Let’s start off doing it in
the admin app, like we do for other email assets.
Eventually we should have a CDN in front of this.
Images lifted from
76ff2e0b6d/app/assets/images/crests
The team page was a bit of a mess:
- invited and active tables didn’t line up
- lots of things were wrapping onto two lines
- the empty fields for when a user didn’t have permissions looked broken
This commit splits each row of the table (not actually a table any more)
onto two lines. First line has the user’s info, second has their
permissions and any associated actions.
_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.
Right now the crown logo in email templates is hosted on Github. Github
is not a CDN.
For now, hosting it in the app is a better solution. At some point we
should have a CDN for all assets on the app, which would be even better.
https://www.pivotaltracker.com/story/show/116952911
SVG images will look sharper and scale more cleanly. However they are
not supported on older browsers[1]
> The <picture> element allows for fallback images when the browser
> doesn't support a specified image format.
`<picture>` is supported in the latest versions of Chrome, Firefox, IE
(Edge), Safari and Android, so all these browsers will get the SVG
version.
Older browsers will fall back to the PNG version.
[1] http://caniuse.com/#feat=svg
[2] https://css-tricks.com/a-complete-guide-to-svg-fallbacks/#fallback-svg-as-img-picture
[3] http://caniuse.com/#feat=SVG
This commit adds a 3 screen tour, similar to those used on GOV.UK Verify
and Passports.
We guerilla tested this on Friday, and it really helped users to build a
mental model of how Notify works, so that when they’re playing around
with it they have a greater sense of what they’re aiming to do. This
makes concepts like templates and placeholders click more quickly.
https://www.pivotaltracker.com/story/show/116710119
This commit adds two new sections to the dashboard
1. A banner telling you about trial mode, including a count of how many messages
you have left today, which is a restriction of trial mode
2. Panels with counts of how many emails and text messages have been sent in a
day, plus the failure rates for each
It does **not**:
- link through to any further information about what trial mode is (coming
later)
- link through to pages for the failure rates (coming later)
- change the ‘recent jobs’ section to ‘recent notifications’
This takes the original prototype version of this page, and, using the same
fake data (ie nothing is wired up):
- adds an invite users page
- adds an edit (and delete) user page
Both these pages allow the user to set another user’s permissions.
This commit adds images for the ticks and crosses, so we have control over their
appearance.
Based on discussion with Pete.
Make the blue banner an ‘important’ banner (copied from Register to Vote, used
because it’s not as boxy and fits on the page better).
Remove the back button because you haven’t changed any data yet. If you need to
go back you can just press back or start again.
Make the filename stand out more.
Remove the ‘download example’ link. Will need to revist the best way of doing
this.
Make text messages consistently 2/3rd width.
…or how to move a bunch of things from a bunch of different places into
`app/static`.
There are three main reasons not to use Flask Assets:
- It had some strange behaviour like only
- It was based on Ruby SASS, which is slower to get new features than libsass,
and meant depending on Ruby, and having the SASS Gem globally installed—so
you’re already out of being a ‘pure’ Python app
- Martyn and I have experience of doing it this way on Marketplace, and we’ve
ironed out the initial rough patches
The specific technologies this introduces, all of which are Node-based:
- Gulp – like a Makefile written in Javascript
- NPM – package management, used for managing Gulp and its related dependencies
- Bower – also package management, and the only way I can think to have
GOV.UK template as a proper dependency
…speaking of which, GOV.UK template is now a dependency. This means it can’t be
modified at all (eg to add a global `#content` wrapper), so every page now
inherits from a template that has this wrapper. But it also means that we have a
clean upgrade path when the template is modified.
Everything else (toolkit, elements) I’ve kept as submodules but moved them to a
more logical place (`app/assets` not `app/assets/stylesheets`, because they
contain more than just SASS/CSS).
