The default aqua link colour looked aweful on orange/red background. I
tried a few different standard colours but couldn't get it right. So I
reverted to the web standard link style: underline. That's looks pretty
good. I personally think that we should use the more for links.
The flash container was set to 100% width to center the messages on the
screen. The messages were covering only part of the screen though. So
the container beyond the actual message box was covering part of the
page, blocking clicks on elements.
A new way of centering the container with CSS translate means that the
width of the container can be the same as the content, not covering
anyting accidentally.
And moving the whole container up instead of only moving the contained
message allows us to interact with elements below the flash message as
well.
It doesn't matter where the flash messages appear in the HTML (thanks to fixed positioning), so why not keep it simple and send them with the main response.
preventDefault in case we are inside a form, so the button doesn't submit it.