Skip to content

Commit

Permalink
doc: improve scrollbar appearance in dark mode
Browse files Browse the repository at this point in the history
PR-URL: #41890
Reviewed-By: Antoine du Hamel <duhamelantoine1995@gmail.com>
Reviewed-By: Tobias Nießen <tniessen@tnie.de>
Reviewed-By: Mestery <mestery@protonmail.com>
Reviewed-By: Luigi Pinca <luigipinca@gmail.com>
  • Loading branch information
Aaron Xie authored and danielleadams committed Apr 24, 2022
1 parent 83691ad commit 6fc0a25
Show file tree
Hide file tree
Showing 2 changed files with 8 additions and 4 deletions.
4 changes: 4 additions & 0 deletions doc/api_assets/style.css
Original file line number Diff line number Diff line change
Expand Up @@ -772,6 +772,10 @@ kbd {
display: none;
}

.dark-mode {
color-scheme: dark;
}

.dark-mode .dark-icon {
display: none;
}
Expand Down
8 changes: 4 additions & 4 deletions doc/template.html
Original file line number Diff line number Diff line change
Expand Up @@ -73,7 +73,7 @@ <h1>Node.js __VERSION__ documentation</h1>
const mq = window.matchMedia('(prefers-color-scheme: dark)');
if ('onchange' in mq) {
function mqChangeListener(e) {
document.body.classList.toggle('dark-mode', e.matches);
document.documentElement.classList.toggle('dark-mode', e.matches);
}
mq.addEventListener('change', mqChangeListener);
if (themeToggleButton) {
Expand All @@ -83,17 +83,17 @@ <h1>Node.js __VERSION__ documentation</h1>
}
}
if (mq.matches) {
document.body.classList.add('dark-mode');
document.documentElement.classList.add('dark-mode');
}
} else if (userSettings === 'true') {
document.body.classList.add('dark-mode');
document.documentElement.classList.add('dark-mode');
}
if (themeToggleButton) {
themeToggleButton.hidden = false;
themeToggleButton.addEventListener('click', function() {
sessionStorage.setItem(
kCustomPreference,
document.body.classList.toggle('dark-mode')
document.documentElement.classList.toggle('dark-mode')
);
});
}
Expand Down

0 comments on commit 6fc0a25

Please sign in to comment.