Add dark theme

Signed-off-by: Emmy D'Anello <ynerant@emy.lu>
This commit is contained in:
Emmy D'Anello 2023-04-20 13:18:51 +02:00
parent 9c30bd1b10
commit c57923ec0a
Signed by: ynerant
GPG Key ID: 3A75C55819C8CF85
2 changed files with 29 additions and 0 deletions

View File

@ -78,4 +78,6 @@
</div> </div>
</body> </body>
<script src="theme.js"></script>
</html> </html>

27
theme.js Normal file
View File

@ -0,0 +1,27 @@
/*!
* Color mode toggler for Bootstrap's docs (https://getbootstrap.com/)
* Copyright 2011-2022 The Bootstrap Authors
* Licensed under the Creative Commons Attribution 3.0 Unported License.
*/
(() => {
'use strict'
const getPreferredTheme = () => {
return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'
}
const setTheme = function (theme) {
if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
document.documentElement.setAttribute('data-bs-theme', 'dark')
} else {
document.documentElement.setAttribute('data-bs-theme', theme)
}
}
setTheme(getPreferredTheme())
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
setTheme(getPreferredTheme())
})
})()