diff --git a/src/newsreader/js/lib/theme.js b/src/newsreader/js/lib/theme.js index ee7ef48..7d89c5f 100644 --- a/src/newsreader/js/lib/theme.js +++ b/src/newsreader/js/lib/theme.js @@ -1,8 +1,8 @@ -function isCSSVariablesSupported() { +const isCSSVariablesSupported = () => { return window.CSS && window.CSS.supports('color', 'var(--fake-color'); -} +}; -function changeTheme(e) { +const changeTheme = event => { const currentPref = sessionStorage.getItem('t-dark'); const isDark = currentPref && currentPref === 'true' ? true : false; @@ -14,12 +14,12 @@ function changeTheme(e) { try { sessionStorage.setItem('t-dark', !isDark); - } catch (e) { + } catch (error) { // do nothing. } -} +}; -function prefersDarkTheme() { +const getThemePreference = () => { try { const currentPref = sessionStorage.getItem('t-dark'); @@ -33,12 +33,12 @@ function prefersDarkTheme() { } else { return false; } - } catch (e) { + } catch (error) { return false; } -} +}; -function toggleDarkTheme(isDark) { +const toggleDarkTheme = isDark => { if (isDark) { document.documentElement.classList.add('dark-theme'); } else { @@ -47,30 +47,30 @@ function toggleDarkTheme(isDark) { try { sessionStorage.setItem('t-dark', isDark); - } catch (e) { + } catch (error) { // do nothing. } -} +}; -function initThemeSelector() { +const initThemeSelector = () => { const themeButton = document.getElementsByClassName('theme-switcher')[0]; - const mqPrefersDarkTheme = window.matchMedia('(prefers-color-scheme: dark)'); + const prefersDarkTheme = window.matchMedia('(prefers-color-scheme: dark)'); - if (prefersDarkTheme()) { + if (getThemePreference()) { toggleDarkTheme(true); } themeButton.addEventListener('click', changeTheme); - mqPrefersDarkTheme.addListener(mq => { - toggleDarkTheme(mq.matches); + prefersDarkTheme.addListener(mediaQuery => { + toggleDarkTheme(mediaQuery.matches); }); -} +}; -function init() { +const init = () => { if (isCSSVariablesSupported()) { initThemeSelector(); } -} +}; init();