Align service name to logo in header

[anandamaryon1]

Whilst working on the 'Logged in header' (nhsuk/nhsuk-service-manual-community-backlog#192) with colleagues, we discussed the transactional header and service name placement. We feel that keeping the service name to the right of the NHS logo could save space in the header.

For example:

current	proposed

This alignment seems possible with flexbox by adding align-items: stretch to .nhsuk-header__container and align-items: centre to .nhsuk-header__transactional-service-name. In the examples I've also tweaked the logo size and service name line-height so that they align better.

Related issue: nhsuk/nhsuk-service-manual-community-backlog#16

[frankieroberto]

@anandamaryon1 this looks great! Would be happy to help test a PR for this.

Could this also cover merging the transactional service name and the service name options into 1? Currently they are very similar, but the logo size is very slightly different. This could be a follow-up issue though, if we don’t want to conflate the two.