1
0
mirror of https://github.com/GenderDysphoria/GenderDysphoria.fyi.git synced 2025-11-25 20:42:40 +00:00
Files
GenderDysphoria.fyi/js/_dark.js
Dex 26aba42e2f Dark Mode (#168)
* Implement toggle button

* Dark mode mixins

* Dark mode color design

* Disable dark mode for prints

* Initial dark mode design

* Fix light mode mixin

* Disable dark mode on print style

* Move dark mode color scheme below the default style to allow referencing

* Fix dropdown

* Fix device-based dark mode

* Dark mode index page design

* Responsive auxiliary nav with dark mode toggle

* Remove box shadow when on smaller displays

* Prevent default on toggle click

* Move attribution/licensing to README.md

* Fix header padding on index page

* Background color transition animation

* Remove margin on index when on mobile displays

* Remove neon border when on mobile

* Fix post-header margin on mobile

* Lighten card headers in dark mode
2025-06-09 02:26:27 +00:00

26 lines
947 B
JavaScript

(function () {
// Check if local storage is available and if dark mode is set; overrides everything else
if (window.localStorage && window.localStorage.getItem('dark-mode') !== null) {
if (window.localStorage.getItem('dark-mode') === 'true') {
document.documentElement.classList.add('dark-mode');
}
// Evaluate device preferences
} else if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
document.documentElement.classList.add('dark-mode');
}
}());
$(function () {
$('.dark-toggle').on('click', function toggleDarkMode (e) {
e.preventDefault();
if (document.documentElement.classList.contains('dark-mode')) {
document.documentElement.classList.remove('dark-mode');
window.localStorage.setItem('dark-mode', 'false');
} else {
document.documentElement.classList.add('dark-mode');
window.localStorage.setItem('dark-mode', 'true');
}
});
});