Automatic theme selection does not work with light themes #10914

Closed
opened 2025-11-02 09:22:01 -06:00 by GiteaMirror · 3 comments
Owner

Originally created by @Fmstrat on GitHub (May 25, 2023).

Description

The current implementation of auto, with gitea vs arc-green does not function fully with custom light themes. In addition, this naming convention can be confusing to new users setting up Gitea.

This was actually identified as a comment in the merged PR that doesn't seem to have been resolved prior to the merge: https://github.com/go-gitea/gitea/pull/17051/files#r716840467

The issue with this implementation is there is no way to have a custom light theme, a custom dark theme, and an automatic switch between the two, because the theme is not 100% css, i.e. the source calls our Arc Green by name: https://github.com/go-gitea/gitea/pull/17051/files#diff-d117c0e438a10ec8f91c84bc56f8c4cb13cb47f40c4bd6c24697d1e8d615da56R32

All automatic theming should be handled in CSS, and handled in a way where users can have an "Auto", "Light", and "Dark" theme. This could be considered as the default instead of "Gitea" vs "Arc Green" to make things clear. The default "Light" theme could simply be an empty CSS that imports ../chroma/base.css to make things easy.

Note: This cannot be reproduced on demo due to custom CSS.

Screenshots

theme

Gitea Version

1.19.3 built with GNU Make 4.3, go1.20.4 : bindata, timetzdata, sqlite, sqlite_unlock_notify

Can you reproduce the bug on the Gitea demo site?

No

Operating System

Linux/Docker

Browser Version

n/a

Originally created by @Fmstrat on GitHub (May 25, 2023). ### Description The current implementation of `auto`, with `gitea` vs `arc-green` does not function fully with custom light themes. In addition, this naming convention can be confusing to new users setting up Gitea. This was actually identified as a comment in the merged PR that doesn't seem to have been resolved prior to the merge: https://github.com/go-gitea/gitea/pull/17051/files#r716840467 The issue with this implementation is there is no way to have a custom light theme, a custom dark theme, and an automatic switch between the two, because the theme is not 100% css, i.e. the source calls our Arc Green by name: https://github.com/go-gitea/gitea/pull/17051/files#diff-d117c0e438a10ec8f91c84bc56f8c4cb13cb47f40c4bd6c24697d1e8d615da56R32 All automatic theming should be handled in CSS, and handled in a way where users can have an "Auto", "Light", and "Dark" theme. This could be considered as the default instead of "Gitea" vs "Arc Green" to make things clear. The default "Light" theme could simply be an empty CSS that imports `../chroma/base.css` to make things easy. Note: This cannot be reproduced on demo due to custom CSS. ### Screenshots ![theme](https://github.com/go-gitea/gitea/assets/971474/8036f884-7abd-441f-9495-113f584e76f2) ### Gitea Version 1.19.3 built with GNU Make 4.3, go1.20.4 : bindata, timetzdata, sqlite, sqlite_unlock_notify ### Can you reproduce the bug on the Gitea demo site? No ### Operating System Linux/Docker ### Browser Version n/a
GiteaMirror added the topic/themetopic/uiissue/workaround labels 2025-11-02 09:22:01 -06:00
Author
Owner

@Fmstrat commented on GitHub (May 25, 2023):

Note: It looks like the code has been updated since the PR above, and I can create a workaround for this it appears by hard-coding an "automatic" CSS:

@import "./theme-dark.css" (prefers-color-scheme: dark);
@import "./theme-light.css" (prefers-color-scheme: light);

And using "automatic" instead of "auto".

@Fmstrat commented on GitHub (May 25, 2023): Note: It looks like the code has been updated since the PR above, and I can create a workaround for this it appears by hard-coding an "automatic" CSS: ``` @import "./theme-dark.css" (prefers-color-scheme: dark); @import "./theme-light.css" (prefers-color-scheme: light); ``` And using "automatic" instead of "auto".
Author
Owner

@silverwind commented on GitHub (May 25, 2023):

I think ultimately we will need a more flexible theme config with the ability for the admin to define a default light and default dark theme which the auto theme would then use.

@silverwind commented on GitHub (May 25, 2023): I think ultimately we will need a more flexible theme config with the ability for the admin to define a default light and default dark theme which the `auto` theme would then use.
Author
Owner

@silverwind commented on GitHub (Mar 28, 2024):

This is a duplicate of https://github.com/go-gitea/gitea/issues/24928, closing.

@silverwind commented on GitHub (Mar 28, 2024): This is a duplicate of https://github.com/go-gitea/gitea/issues/24928, closing.
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: github-starred/gitea#10914