diff --git a/CHANGELOG.md b/CHANGELOG.md index a854fcf..989e460 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -16,12 +16,12 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - Storing Discord-provided snowflake ID's in a postgresql database. Now using 'PositiveLargeIntegerField' to support this - Sidebar server "placeholder" elements running offscreen on desktop - fixed by reducing them by 2 +- Theme button missing icon on page load. Created an init function for properly setting up the theme on page load. ### Changed - Keep the hover state of sidebar buttons while their respective dropdown's are showing - ## [Unreleased] [0.4.0] - xxxx-xx-xx [BREAKING] ### Added diff --git a/static/js/base.js b/static/js/base.js index 4ee6e17..2cda09c 100644 --- a/static/js/base.js +++ b/static/js/base.js @@ -9,6 +9,13 @@ $('input[name="themeToggle"]').on("change", function() { applyTheme(selectedTheme); }); +// on page load +function initThemeChoice() { + const theme = getStoredTheme() || "auto"; // If the user is new, they won't have a set theme, so default to auto + setThemeIcon(theme); + applyTheme(theme); +} + function setThemeIcon(theme) { const iconOptions = { light: "bi-sun", @@ -16,6 +23,10 @@ function setThemeIcon(theme) { auto: "bi-circle-half" } + if (!Object.keys(iconOptions).includes(theme)) { + throw new Error(`No icon for theme: ${theme}`); + } + $(".js-themeMenuBtn > i").removeClass(Object.values(iconOptions).join(" ")); $(".js-themeMenuBtn > i").addClass(iconOptions[theme]); } @@ -90,7 +101,5 @@ $(document).ready(function() { // $(".input-group.date").datepicker({format: "yyyy-mm-dd"}); // Load theme - const theme = getStoredTheme(); - setThemeIcon(theme); - applyTheme(theme); + initThemeChoice(); }); \ No newline at end of file