hmrc / platui-support

Apache License 2.0
0 stars 0 forks source link

HmrcInternalHeader to accept a parameter to control use of an internal width container #3

Closed nubz closed 2 years ago

nubz commented 2 years ago

Related component

uk.gov.hmrc.hmrcfrontend.views.html.components.HmrcInternalHeader

Context

Contain the width of the internal children in the same way as we do with the GovukHeader so that it creates an width alignment with content and footer. Having a full screen width on the header whilst the content and footer are contained in a width container creates an uncomfortable design . Because the component's internal HTML markup has a header element and multiple children we cannot externally influence the internal width with CSS code so making a copy appears to be the only solution if we want to insert a width container around the internal children e.g.

<header role="banner" class="hmrc-internal-header">
  <div class="govuk-width-container">
  ...
  </div>
</header>

Alternatives

Creating a custom copy of HmrcInternalHeader has already proved troublesome when trying to keep up with updates, for example the switch to using inline SVG for the crown logo broke the custom component's layout when we updated to the latest play-hmrc-frontend version (1.31.0-play28) and patching it was a little fiddly...

oscarduignan commented 2 years ago

Thank you for raising this @nubz, I've flagged this with our product owner

HollyHughes commented 2 years ago

Hey @nubz , thanks for raising this! this piece of work is already underway thanks to the design-resources team. You can take a look at the PR here https://github.com/hmrc/hmrc-frontend/pull/200

oscarduignan commented 2 years ago

Referenced change has been merged so I'm going to close this now