Add secondary navigation

[frankieroberto]

This adds a secondary navigation component, plus some documentation about it.

Resolves #182

[paulrobertlloyd]

Initial thoughts from a quick look.

[paulrobertlloyd]

Have fixed the homepage layout, and rebased from the main branch where I updated linting on the project.

[frankieroberto]

@paulrobertlloyd I've reworked the CSS on this (rather than the copy-and-paste job I had before), so now it's more similar to the primary navigation component implementation.

This means the same hover and focus styles are used as primary nav - ie with the double underline on hover, and the focus highlight being smaller. We can always review this separately if thinking on this changes.

This also means that the specific mobile view has been dropped, in favour of doing the same as the primary nav - ie horizontal with wrapping.

Let me know what you think!

[frankieroberto]

@paulrobertlloyd I've tweaked the padding so that it's reduced on mobile, which I think helps to make it clearer which item is the current page?

In reality, I think for most services, the nav should fix on a single line for most mobile viewports (given how much wider phones are nowadays).

We could still consider an option to have the items stack vertically on mobile (with or without a toggle) - but I think if we do that, it's worth doing it for the primary nav and secondary nav at the same time?

[paulrobertlloyd]

Let’s leave thoughts of responsive versions of this for now; as you say, in most cases shouldn’t be needed and the items wrap much better now.

Also… do you think an example layout for the Prototype Kit would be a useful addition?