diff --git a/static/scripts/theme-switch-post.js b/static/scripts/theme-switch-post.js new file mode 100644 index 000000000..1516fd44f --- /dev/null +++ b/static/scripts/theme-switch-post.js @@ -0,0 +1,11 @@ +"use strict"; + +// The regular theme-switch.js script runs in the header and blocks the initial +// page render to prevent flickering. The following code cannot run as part of +// that, because the page must have been rendered first. + +// close the theme dropdown if clicking somewhere else +document.querySelector('.theme-icon').onblur = handleBlur; + +// show the theme selector only if JavaScript is enabled/available +document.querySelector('.theme-icon').style.display = 'block'; diff --git a/static/scripts/theme-switch.js b/static/scripts/theme-switch.js index b8ffcd7a7..65c6a539e 100644 --- a/static/scripts/theme-switch.js +++ b/static/scripts/theme-switch.js @@ -60,9 +60,6 @@ function setThemeToSystemPref() { } } -// close the theme dropdown if clicking somewhere else -document.querySelector('.theme-icon').onblur = handleBlur; - // Check for saved user preference on load, else check and save user agent prefs let savedTheme = null; if (storageAvailable("localStorage")) { @@ -73,6 +70,3 @@ if (savedTheme) { } else { setThemeToSystemPref(); } - -// show the theme selector only if JavaScript is enabled/available -document.querySelector('.theme-icon').style.display = 'block'; diff --git a/templates/headers.hbs b/templates/headers.hbs index fb4b824ae..11ce5c927 100644 --- a/templates/headers.hbs +++ b/templates/headers.hbs @@ -36,3 +36,6 @@ + + + diff --git a/templates/nav.hbs b/templates/nav.hbs index 2ce3c2101..317c1fa41 100644 --- a/templates/nav.hbs +++ b/templates/nav.hbs @@ -20,6 +20,6 @@
  • System
  • - +