From: Lemmus.org <137361180+lemmus-org@users.noreply.github.com> Date: Mon, 10 Jul 2023 14:33:58 +0000 (-0700) Subject: Add theme option for compact that respects browser default (#1870) X-Git-Url: http://these/git/%7B%60%24%7BarchiveTodayUrl%7D/%24%7B%60data:application/static/git-favicon.png?a=commitdiff_plain;h=6350f6857912aceb143882804d043ca40ca086a2;p=lemmy-ui.git Add theme option for compact that respects browser default (#1870) --- diff --git a/src/shared/components/app/theme.tsx b/src/shared/components/app/theme.tsx index 941eea2..93f6aed 100644 --- a/src/shared/components/app/theme.tsx +++ b/src/shared/components/app/theme.tsx @@ -21,7 +21,10 @@ export class Theme extends Component<Props> { /> </Helmet> ); - } else if (this.props.defaultTheme != "browser") { + } else if ( + this.props.defaultTheme != "browser" && + this.props.defaultTheme != "browser-compact" + ) { return ( <Helmet> <link @@ -31,6 +34,25 @@ export class Theme extends Component<Props> { /> </Helmet> ); + } else if (this.props.defaultTheme == "browser-compact") { + return ( + <Helmet> + <link + rel="stylesheet" + type="text/css" + href="/css/themes/litely-compact.css" + id="default-light" + media="(prefers-color-scheme: light)" + /> + <link + rel="stylesheet" + type="text/css" + href="/css/themes/darkly-compact.css" + id="default-dark" + media="(prefers-color-scheme: no-preference), (prefers-color-scheme: dark)" + /> + </Helmet> + ); } else { return ( <Helmet> diff --git a/src/shared/components/home/site-form.tsx b/src/shared/components/home/site-form.tsx index f5d2568..25e02c8 100644 --- a/src/shared/components/home/site-form.tsx +++ b/src/shared/components/home/site-form.tsx @@ -411,6 +411,9 @@ export class SiteForm extends Component<SiteFormProps, SiteFormState> { <option value="browser"> {I18NextService.i18n.t("browser_default")} </option> + <option value="browser-compact"> + {I18NextService.i18n.t("browser_default_compact")} + </option> {this.props.themeList?.map(theme => ( <option key={theme} value={theme}> {theme} diff --git a/src/shared/components/person/settings.tsx b/src/shared/components/person/settings.tsx index 4caef45..905469a 100644 --- a/src/shared/components/person/settings.tsx +++ b/src/shared/components/person/settings.tsx @@ -596,6 +596,9 @@ export class Settings extends Component<any, SettingsState> { <option value="browser"> {I18NextService.i18n.t("browser_default")} </option> + <option value="browser-compact"> + {I18NextService.i18n.t("browser_default_compact")} + </option> <option disabled aria-hidden="true"> ââ </option> @@ -635,6 +638,9 @@ export class Settings extends Component<any, SettingsState> { <option value="browser"> {I18NextService.i18n.t("browser_default")} </option> + <option value="browser-compact"> + {I18NextService.i18n.t("browser_default_compact")} + </option> {this.state.themeList.map(theme => ( <option key={theme} value={theme}> {theme}