pkp/immersion#134 Skip to content link not visible - adding SkipTo.JS component

[israelcefrin]

Fixing the "skip to" hidden menu adding an open source Skipto.JS component to fix it.

This component has been already presented by @Godoy0722 to the Dev team for the ORE project.

Issue: #134

[kaitlinnewson]

Hi @israelcefrin, I've made a few suggestions here - let me know if anything is unclear!

[kaitlinnewson]

Rather than using the hook approach, I think you could instead add the js file path to gulpfile.js (under gulp.task('scripts', function()), then add the custom script here with something like:

        $this->addScript(
            'skip-to-js',
            "var SkipToConfig = {
                displayOption: 'popup',
                landmarks: 'main search navigation header footer',
                headings: ' h1 h2',
                colorTheme: 'openweba11y',
                highlightTarget: 'smooth'
            };",
            ['inline' => true]
        );

... and then you could remove the addCustomHeader function below as well.

By adding it to the gulp file, it's included in the build packages (see the README with more info about that if needed).

[kaitlinnewson]

This can be replaced with the minified version and moved to resources/dist/js.