From 4ef7b10116d5165e3b4568d8185bc608f900aeb5 Mon Sep 17 00:00:00 2001 From: Dessalines <tyhou13@gmx.com> Date: Thu, 24 Sep 2020 17:03:03 -0500 Subject: [PATCH] Adding a browser default theme option. Fixes #35 --- src/server/index.tsx | 2 +- src/shared/components/user.tsx | 3 ++- src/shared/utils.ts | 8 +++++++- 3 files changed, 10 insertions(+), 3 deletions(-) diff --git a/src/server/index.tsx b/src/server/index.tsx index e7278d6..ef6ce08 100644 --- a/src/server/index.tsx +++ b/src/server/index.tsx @@ -107,7 +107,7 @@ server.get('/*', async (req, res) => { </noscript> <div id='root'>${root}</div> - <script src='/static/js/client.js'></script> + <script defer src='/static/js/client.js'></script> </body> </html> `); diff --git a/src/shared/components/user.tsx b/src/shared/components/user.tsx index 665b035..109e71c 100644 --- a/src/shared/components/user.tsx +++ b/src/shared/components/user.tsx @@ -535,6 +535,7 @@ export class User extends Component<any, UserState> { class="ml-2 custom-select w-auto" > <option disabled>{i18n.t('theme')}</option> + <option value="browser">{i18n.t('browser_default')}</option> {themes.map(theme => ( <option value={theme}>{theme}</option> ))} @@ -1050,7 +1051,7 @@ export class User extends Component<any, UserState> { 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 775be28..b5d7dd0 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); -- 2.44.1