Themes: Move the skip link to outside the canvas in block themes

Fix Twenty Twenty-one having an erroneous margin above the Header template part
by moving the skip link outside of the wp-site-blocks canvas.

This is a backport of https://github.com/WordPress/gutenberg/pull/34986.

Props youknowriad.
Fixes #54491.





git-svn-id: https://develop.svn.wordpress.org/trunk@52243 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Robert Anderson 2021-11-25 01:05:30 +00:00
parent 37abb3a470
commit 5349ecdc99

View File

@ -165,7 +165,7 @@ function the_block_template_skip_link() {
<script>
( function() {
var skipLinkTarget = document.querySelector( 'main' ),
parentEl,
sibling,
skipLinkTargetID,
skipLink;
@ -176,10 +176,10 @@ function the_block_template_skip_link() {
// Get the site wrapper.
// The skip-link will be injected in the beginning of it.
parentEl = document.querySelector( '.wp-site-blocks' );
sibling = document.querySelector( '.wp-site-blocks' );
// Early exit if the root element was not found.
if ( ! parentEl ) {
if ( ! sibling ) {
return;
}
@ -197,7 +197,7 @@ function the_block_template_skip_link() {
skipLink.innerHTML = '<?php esc_html_e( 'Skip to content' ); ?>';
// Inject the skip link.
parentEl.insertAdjacentElement( 'afterbegin', skipLink );
sibling.parentElement.insertBefore( skipLink, sibling );
}() );
</script>
<?php