htwkmooc/codeocean
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Migrate color-mode-picker to work with Turbolinks

Browse Source 
Fix CODEOCEAN-FRONTEND-2D
This commit is contained in:
Sebastian Serth
2023-08-16 23:49:50 +02:00
parent 71acb0cf3d
commit 730e6f85eb
1 changed files with 10 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
lib/assets/javascripts/color_mode_picker.js
View File

@ -5,10 +5,15 @@
* Taken from https://getbootstrap.com/docs/5.3/customize/color-modes/#javascript * Taken from https://getbootstrap.com/docs/5.3/customize/color-modes/#javascript
*/ */
const getStoredTheme = () => localStorage.getItem('theme') function getStoredTheme(){
const setStoredTheme = theme => localStorage.setItem('theme', theme) return localStorage.getItem('theme')
}
const getPreferredTheme = () => { function setStoredTheme(theme) {
localStorage.setItem('theme', theme)
}
function getPreferredTheme() {
const storedTheme = getStoredTheme() const storedTheme = getStoredTheme()
if (storedTheme) { if (storedTheme) {
return storedTheme return storedTheme
@ -17,7 +22,7 @@ const getPreferredTheme = () => {
return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light' return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'
} }
const setTheme = theme => { function setTheme(theme) {
let currentTheme = theme || 'auto'; let currentTheme = theme || 'auto';
if (theme === 'auto') { if (theme === 'auto') {
if (window.matchMedia('(prefers-color-scheme: dark)').matches) { if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
@ -44,7 +49,7 @@ window.getCurrentTheme = () => {
return document.documentElement.getAttribute('data-bs-theme') || setTheme(getPreferredTheme()); return document.documentElement.getAttribute('data-bs-theme') || setTheme(getPreferredTheme());
} }
const showActiveTheme = (theme, focus = false) => { function showActiveTheme(theme, focus = false) {
const themeSwitcher = document.querySelector('#bd-theme') const themeSwitcher = document.querySelector('#bd-theme')
if (!themeSwitcher) { if (!themeSwitcher) {