* detect dark theme via css variable * minor refactor, add documentation If your custom theme is considered a dark theme, set the global css variable `--is-dark-theme` to `true`. This allows gitea to adjust the Monaco code editor's theme accordingly.tags/v1.16.0-rc1
@@ -337,6 +337,9 @@ Community themes are listed in [gitea/awesome-gitea#themes](https://gitea.com/gi | |||
The `arc-green` theme source can be found [here](https://github.com/go-gitea/gitea/blob/main/web_src/less/themes/theme-arc-green.less). | |||
If your custom theme is considered a dark theme, set the global css variable `--is-dark-theme` to `true`. | |||
This allows gitea to adjust the Monaco code editor's theme accordingly. | |||
## Customizing fonts | |||
Fonts can be customized using CSS variables: |
@@ -26,13 +26,8 @@ export function isObject(obj) { | |||
// returns whether a dark theme is enabled | |||
export function isDarkTheme() { | |||
if (document.documentElement.classList.contains('theme-auto')) { | |||
return window.matchMedia('(prefers-color-scheme: dark)').matches; | |||
} | |||
if (document.documentElement.classList.contains('theme-arc-green')) { | |||
return true; | |||
} | |||
return false; | |||
const style = window.getComputedStyle(document.documentElement); | |||
return style.getPropertyValue('--is-dark-theme').trim().toLowerCase() === 'true'; | |||
} | |||
// removes duplicate elements in an array |
@@ -1,6 +1,7 @@ | |||
@import "../chroma/dark.less"; | |||
:root { | |||
--is-dark-theme: true; | |||
--color-primary: #87ab63; | |||
--color-primary-dark-1: #93b373; | |||
--color-primary-dark-2: #9fbc82; |