fix(docs-infra): do not focus h1 from docs-top-level-banner (#57698)

fix(docs-infra): do not focus h1 from docs-top-level-banner

Do not focus heading from docs-top-level-banner.
Move the `Skip to main content` button to the top of DOM tree.

PR Close #57698
This commit is contained in:
Paweł Kubiak 2024-09-06 18:22:37 +02:00 committed by Pawel Kozlowski
parent e495a68dc1
commit e76ddcc753
2 changed files with 4 additions and 3 deletions

View file

@ -1,8 +1,9 @@
<button (click)="focusFirstHeading()" class="adev-skip">Skip to main content</button>
@defer (when isBrowser) {
<adev-progress-bar />
<docs-top-level-banner expiry="2024-12-06" id="state-of-js-2024" link="https://survey.devographics.com/en-US/survey/state-of-js/2024?source=angular_homepage" text="Share your experience with Angular in The State of JavaScript 2024 survey" />
}
<button (click)="focusFirstHeading()" class="adev-skip">Skip to main content</button>
<div class="adev-nav"></div>
@if (displaySecondaryNav()) {

View file

@ -16,7 +16,7 @@ import {
signal,
WritableSignal,
} from '@angular/core';
import {NavigationEnd, NavigationSkipped, Router, RouterLink, RouterOutlet} from '@angular/router';
import {NavigationEnd, NavigationSkipped, Router, RouterOutlet} from '@angular/router';
import {filter, map, skip} from 'rxjs/operators';
import {
CookiePopup,
@ -84,7 +84,7 @@ export class AppComponent implements OnInit {
return;
}
const h1 = this.document.querySelector<HTMLHeadingElement>('h1');
const h1 = this.document.querySelector<HTMLHeadingElement>('h1:not(docs-top-level-banner h1)');
h1?.focus();
}