Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Ensure masthead component appears within main landmark on product layout #244

Merged
merged 1 commit into from
Jan 16, 2024

Conversation

paulrobertlloyd
Copy link
Collaborator

@paulrobertlloyd paulrobertlloyd commented Jan 15, 2024

Fixes #169. Closes #170.

With a fresh set of eyes on this, as well as another (really rather strange) issue raising its head as a result of the masthead not appearing within the main container, this PR updates the product layout to overwrite the main template block:

  • <main> contains the masthead, and keeps its id and lang attributes
  • beforeContent template block is removed; this is primarily used for breadcrumbs which can be added to/via the masthead component
  • A div with class govuk-main-wrapper, and which accepts mainClasses is used to wrap the content area below the masthead component, essentially replicating the classes and nesting that is used for other layouts.

Thanks to @keithkennedyHO for reporting in #169 and submitting a long neglected fix in #170, for Adam Liptrot reporting the layout issues on Windows and Android; shame on me for not addressing this issue sooner!

@paulrobertlloyd paulrobertlloyd merged commit cb3337e into main Jan 16, 2024
2 checks passed
@paulrobertlloyd paulrobertlloyd deleted the 169-product-layout-landmark branch January 16, 2024 18:23
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Masthead in product page layout not contained within a landmark
2 participants