[THEME] Add colorblind theme variants
This PR adds colorblind theme variants of the forgejo themes. I duplicated the forjego light and dark themes and only changed the lines related to diff colors for added and removed rows/words. I am not a designer, and I am also colorblind, so better suggestions of colors are most welcome. However, this is a good start as I can at least personally see the colors now. I got the colors for the dark theme from the GitHub diff colors, the light ones I couldn't get from GitHub as they use white as a plain background, which Forgejo's theme doesn't, so they were decided on after a bit of random testing. Resolves #986
This commit is contained in:
parent
c87903a0cc
commit
dcdb4a372d
8 changed files with 50 additions and 2 deletions
|
@ -82,7 +82,7 @@ var UI = struct {
|
|||
ReactionMaxUserNum: 10,
|
||||
MaxDisplayFileSize: 8388608,
|
||||
DefaultTheme: `forgejo-auto`,
|
||||
Themes: []string{`forgejo-auto`, `forgejo-light`, `forgejo-dark`, `gitea-auto`, `gitea-light`, `gitea-dark`},
|
||||
Themes: []string{`forgejo-auto`, `forgejo-light`, `forgejo-dark`, `gitea-auto`, `gitea-light`, `gitea-dark`, `forgejo-auto-deuteranopia-protanopia`, `forgejo-light-deuteranopia-protanopia`, `forgejo-dark-deuteranopia-protanopia`, `forgejo-auto-tritanopia`, `forgejo-light-tritanopia`, `forgejo-dark-tritanopia`},
|
||||
Reactions: []string{`+1`, `-1`, `laugh`, `hooray`, `confused`, `heart`, `rocket`, `eyes`},
|
||||
CustomEmojis: []string{`git`, `gitea`, `codeberg`, `gitlab`, `github`, `gogs`, `forgejo`},
|
||||
CustomEmojisMap: map[string]string{"git": ":git:", "gitea": ":gitea:", "codeberg": ":codeberg:", "gitlab": ":gitlab:", "github": ":github:", "gogs": ":gogs:", "forgejo": ":forgejo:"},
|
||||
|
|
|
@ -277,7 +277,7 @@ func (f *AddEmailForm) Validate(req *http.Request, errs binding.Errors) binding.
|
|||
|
||||
// UpdateThemeForm form for updating a users' theme
|
||||
type UpdateThemeForm struct {
|
||||
Theme string `binding:"Required;MaxSize(30)"`
|
||||
Theme string `binding:"Required;MaxSize(64)"`
|
||||
}
|
||||
|
||||
// Validate validates the field
|
||||
|
|
|
@ -0,0 +1,2 @@
|
|||
@import "theme-forgejo-light-deuteranopia-protanopia.css";
|
||||
@import "theme-forgejo-dark-deuteranopia-protanopia.css" (prefers-color-scheme: dark);
|
2
web_src/css/themes/theme-forgejo-auto-tritanopia.css
Normal file
2
web_src/css/themes/theme-forgejo-auto-tritanopia.css
Normal file
|
@ -0,0 +1,2 @@
|
|||
@import "theme-forgejo-light-tritanopia.css";
|
||||
@import "theme-forgejo-dark-tritanopia.css" (prefers-color-scheme: dark);
|
|
@ -0,0 +1,11 @@
|
|||
@import "./theme-forgejo-dark.css";
|
||||
|
||||
:root {
|
||||
--color-diff-removed-word-bg: #693F17;
|
||||
--color-diff-removed-row-border: #693F17;
|
||||
--color-diff-removed-row-bg: #221B17;
|
||||
--color-diff-added-word-bg: #214D88;
|
||||
--color-diff-added-row-border: #214D88;
|
||||
--color-diff-added-row-bg: #13233A;
|
||||
--color-code-bg: #0D1117;
|
||||
}
|
11
web_src/css/themes/theme-forgejo-dark-tritanopia.css
Normal file
11
web_src/css/themes/theme-forgejo-dark-tritanopia.css
Normal file
|
@ -0,0 +1,11 @@
|
|||
@import "./theme-forgejo-dark.css";
|
||||
|
||||
:root {
|
||||
--color-diff-removed-word-bg: #792E2E;
|
||||
--color-diff-removed-row-border: #792E2E;
|
||||
--color-diff-removed-row-bg: #25171C;
|
||||
--color-diff-added-word-bg: #214D88;
|
||||
--color-diff-added-row-border: #214D88;
|
||||
--color-diff-added-row-bg: #13233A;
|
||||
--color-code-bg: #0D1117;
|
||||
}
|
|
@ -0,0 +1,11 @@
|
|||
@import "./theme-forgejo-light.css";
|
||||
|
||||
:root {
|
||||
--color-diff-removed-word-bg: #FFDBB0;
|
||||
--color-diff-removed-row-border: #FFDBB0;
|
||||
--color-diff-removed-row-bg: #FFFAF3;
|
||||
--color-diff-added-word-bg: #B1DBFF;
|
||||
--color-diff-added-row-border: #B1DBFF;
|
||||
--color-diff-added-row-bg: #EEF9FF;
|
||||
--color-code-bg: #FFFFFF;
|
||||
}
|
11
web_src/css/themes/theme-forgejo-light-tritanopia.css
Normal file
11
web_src/css/themes/theme-forgejo-light-tritanopia.css
Normal file
|
@ -0,0 +1,11 @@
|
|||
@import "./theme-forgejo-light.css";
|
||||
|
||||
:root {
|
||||
--color-diff-removed-word-bg: #FFD0CE;
|
||||
--color-diff-removed-row-border: #FFD0CE;
|
||||
--color-diff-removed-row-bg: #FFF5F4;
|
||||
--color-diff-added-word-bg: #B1DBFF;
|
||||
--color-diff-added-row-border: #EEF9FF;
|
||||
--color-diff-added-row-bg: #EEF9FF;
|
||||
--color-code-bg: #FFFFFF;
|
||||
}
|
Loading…
Reference in a new issue