Add theme option for compact that respects browser default (#1870)

This commit is contained in:
Lemmus.org 2023-07-10 07:33:58 -07:00 committed by GitHub
parent 1bd705d7bc
commit 6350f68579
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 32 additions and 1 deletions

View file

@ -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>

View file

@ -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}

View file

@ -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}