mirror of
https://github.com/LemmyNet/lemmy-ui.git
synced 2024-12-23 03:11:25 +00:00
Add theme option for compact that respects browser default (#1870)
This commit is contained in:
parent
1bd705d7bc
commit
6350f68579
3 changed files with 32 additions and 1 deletions
|
@ -21,7 +21,10 @@ export class Theme extends Component<Props> {
|
||||||
/>
|
/>
|
||||||
</Helmet>
|
</Helmet>
|
||||||
);
|
);
|
||||||
} else if (this.props.defaultTheme != "browser") {
|
} else if (
|
||||||
|
this.props.defaultTheme != "browser" &&
|
||||||
|
this.props.defaultTheme != "browser-compact"
|
||||||
|
) {
|
||||||
return (
|
return (
|
||||||
<Helmet>
|
<Helmet>
|
||||||
<link
|
<link
|
||||||
|
@ -31,6 +34,25 @@ export class Theme extends Component<Props> {
|
||||||
/>
|
/>
|
||||||
</Helmet>
|
</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 {
|
} else {
|
||||||
return (
|
return (
|
||||||
<Helmet>
|
<Helmet>
|
||||||
|
|
|
@ -411,6 +411,9 @@ export class SiteForm extends Component<SiteFormProps, SiteFormState> {
|
||||||
<option value="browser">
|
<option value="browser">
|
||||||
{I18NextService.i18n.t("browser_default")}
|
{I18NextService.i18n.t("browser_default")}
|
||||||
</option>
|
</option>
|
||||||
|
<option value="browser-compact">
|
||||||
|
{I18NextService.i18n.t("browser_default_compact")}
|
||||||
|
</option>
|
||||||
{this.props.themeList?.map(theme => (
|
{this.props.themeList?.map(theme => (
|
||||||
<option key={theme} value={theme}>
|
<option key={theme} value={theme}>
|
||||||
{theme}
|
{theme}
|
||||||
|
|
|
@ -596,6 +596,9 @@ export class Settings extends Component<any, SettingsState> {
|
||||||
<option value="browser">
|
<option value="browser">
|
||||||
{I18NextService.i18n.t("browser_default")}
|
{I18NextService.i18n.t("browser_default")}
|
||||||
</option>
|
</option>
|
||||||
|
<option value="browser-compact">
|
||||||
|
{I18NextService.i18n.t("browser_default_compact")}
|
||||||
|
</option>
|
||||||
<option disabled aria-hidden="true">
|
<option disabled aria-hidden="true">
|
||||||
──
|
──
|
||||||
</option>
|
</option>
|
||||||
|
@ -635,6 +638,9 @@ export class Settings extends Component<any, SettingsState> {
|
||||||
<option value="browser">
|
<option value="browser">
|
||||||
{I18NextService.i18n.t("browser_default")}
|
{I18NextService.i18n.t("browser_default")}
|
||||||
</option>
|
</option>
|
||||||
|
<option value="browser-compact">
|
||||||
|
{I18NextService.i18n.t("browser_default_compact")}
|
||||||
|
</option>
|
||||||
{this.state.themeList.map(theme => (
|
{this.state.themeList.map(theme => (
|
||||||
<option key={theme} value={theme}>
|
<option key={theme} value={theme}>
|
||||||
{theme}
|
{theme}
|
||||||
|
|
Loading…
Reference in a new issue