diff --git a/src/server/index.tsx b/src/server/index.tsx index e7278d6b..ef6ce08d 100644 --- a/src/server/index.tsx +++ b/src/server/index.tsx @@ -107,7 +107,7 @@ server.get('/*', async (req, res) => {
${root}
- + `); diff --git a/src/shared/components/user.tsx b/src/shared/components/user.tsx index 665b035c..109e71c9 100644 --- a/src/shared/components/user.tsx +++ b/src/shared/components/user.tsx @@ -535,6 +535,7 @@ export class User extends Component { class="ml-2 custom-select w-auto" > + {themes.map(theme => ( ))} @@ -1050,7 +1051,7 @@ export class User extends Component { UserService.Instance.user.show_nsfw; this.state.userSettingsForm.theme = UserService.Instance.user.theme ? UserService.Instance.user.theme - : 'darkly'; + : 'browser'; this.state.userSettingsForm.default_sort_type = UserService.Instance.user.default_sort_type; this.state.userSettingsForm.default_listing_type = diff --git a/src/shared/utils.ts b/src/shared/utils.ts index 775be287..b5d7dd0a 100644 --- a/src/shared/utils.ts +++ b/src/shared/utils.ts @@ -437,7 +437,12 @@ export function getMomentLanguage(): string { } export function setTheme(theme: string, forceReload: boolean = false) { - if (isBrowser() && (theme !== 'darkly' || forceReload)) { + if (isBrowser() && (theme !== 'browser' || forceReload)) { + // This is only run on a force reload + if (theme == 'browser') { + theme = 'darkly'; + } + // Unload all the other themes for (var i = 0; i < themes.length; i++) { let styleSheet = document.getElementById(themes[i]); @@ -452,6 +457,7 @@ export function setTheme(theme: string, forceReload: boolean = false) { document .getElementById('default-dark') .setAttribute('disabled', 'disabled'); + // Load the theme dynamically let cssLoc = `/static/assets/css/themes/${theme}.min.css`; loadCss(theme, cssLoc);