-
Notifications
You must be signed in to change notification settings - Fork 29.9k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
doc: fix api docs when JS is disabled
- Loading branch information
1 parent
304f37d
commit f0ca620
Showing
5 changed files
with
112 additions
and
81 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,89 @@ | ||
| 'use strict'; | ||
|
|
||
| // Check if we have Javascript support | ||
| const root = document.querySelector(':root'); | ||
| root.classList.remove('no-js'); | ||
| root.classList.add('has-js'); | ||
|
|
||
| // Restore user mode preferences | ||
| const kCustomPreference = 'customDarkTheme'; | ||
| const userSettings = sessionStorage.getItem(kCustomPreference); | ||
| const themeToggleButton = document.getElementById('theme-toggle-btn'); | ||
| if (userSettings === null && window.matchMedia) { | ||
| const mq = window.matchMedia('(prefers-color-scheme: dark)'); | ||
| if ('onchange' in mq) { | ||
| function mqChangeListener(e) { | ||
| document.body.classList.toggle('dark-mode', e.matches); | ||
| } | ||
| mq.addEventListener('change', mqChangeListener); | ||
| if (themeToggleButton) { | ||
| themeToggleButton.addEventListener('click', function() { | ||
| mq.removeEventListener('change', mqChangeListener); | ||
| }, { once: true }); | ||
| } | ||
| } | ||
| if (mq.matches) { | ||
| document.body.classList.add('dark-mode'); | ||
| } | ||
| } else if (userSettings === 'true') { | ||
| document.body.classList.add('dark-mode'); | ||
| } | ||
| if (themeToggleButton) { | ||
| themeToggleButton.hidden = false; | ||
| themeToggleButton.addEventListener('click', function() { | ||
| sessionStorage.setItem( | ||
| kCustomPreference, | ||
| document.body.classList.toggle('dark-mode') | ||
| ); | ||
| }); | ||
| } | ||
|
|
||
| // Handle pickers with click/taps rather than hovers | ||
| const pickers = document.querySelectorAll('.picker-header'); | ||
| for(const picker of pickers) { | ||
| picker.addEventListener('click', e => { | ||
| if (!e.target.closest('.picker')) { | ||
| e.preventDefault(); | ||
| } | ||
|
|
||
| if (picker.classList.contains('expanded')) { | ||
| picker.classList.remove('expanded'); | ||
| } else { | ||
| for (const other of pickers) { | ||
| other.classList.remove('expanded'); | ||
| } | ||
|
|
||
| picker.classList.add('expanded'); | ||
| } | ||
| }); | ||
| } | ||
|
|
||
| // Track when the header is in sticky position | ||
| const header = document.querySelector(".header"); | ||
| let ignoreNextIntersection = false; | ||
| new IntersectionObserver( | ||
| ([e]) => { | ||
| const currentStatus = header.classList.contains('is-pinned'); | ||
| const newStatus = e.intersectionRatio < 1; | ||
|
|
||
| // Same status, do nothing | ||
| if(currentStatus === newStatus) { | ||
| return; | ||
| } else if(ignoreNextIntersection) { | ||
| ignoreNextIntersection = false; | ||
| return; | ||
| } | ||
|
|
||
| /* | ||
| To avoid flickering, ignore the next change event that is triggered | ||
| as the visible elements in the header change once we pin it. | ||
| The timer is reset anyway after few milliseconds | ||
| */ | ||
| ignoreNextIntersection = true; | ||
| setTimeout(() => ignoreNextIntersection = false, 50); | ||
|
|
||
| header.classList.toggle('is-pinned', newStatus); | ||
| }, | ||
| { threshold: [1] } | ||
| ).observe(header); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters