Accessibility issue with lgPage component

[NemirStephan]

I am getting a 'All page content should be contained by landmarks` error in axe dev tools when using the lgPage component

Element location

.lg-page__skip-link

Element source

<a class="lg-page__skip-link"> Skip to main content </a>

I think the issue is because the a tag is not wrapped inside the main content area which contains the main aria role

The fix should be to either declare the main role at the component root, or add another role such as banner to the anchor tag

[elenagarrone]

Yes, I agree. Ideally it should be in the header before the navigation.

[pauleustice]

@Legal-and-General/canopy-regular-contributors This sounds like a legit issue that should be quite easy to fix. I'm not sure the best way to place it in the lg-header as per Elena's suggestion, though.

Will the header component always precede a [role=main]? Maybe it should be an input to toggle whether it's shown in the header?