TheAfriForge/gitforge
1
0
Fork 0
mirror of https://codeberg.org/forgejo/forgejo.git synced 2026-07-18 15:37:48 +00:00
Code Issues Projects Releases Packages Wiki Activity

feat(ui): improve markup attention colors (#13224)

Browse source 
## Refactor styles of attention markdown formatting

* simplify CSS
* simplify generated HTML a bit
* get rid of a few `!important` properties by using higher specificity selectors
* bring everything to one file and out of `base.css`
* apply declarative purpose-built colors introduced in forgejo/forgejo!9643
    * create new colors for `violet` and `blue`
    * move `oklch` declarations out of themes to `base.css`, leave themes with access to all parameters
    * use declarative styles in all themes, not just `forgejo-dark`, remove variable fallbacks from styles
* remove rule overrides from `forgejo-dark`. _it should ideally only contain variables, not rules_

What's improved:
* lightness and saturation are now same for all color variants of different attention types within one theme
* code is more maintainable
* custom themes are easier to make, our example themes are dumping less RGB values at theme authors and allow changing some important colors just by tweaking numeric values (lightness, chroma, hue)
* forgejo and gitea dark themes are now using good contrast

### Preview

#### Forgejo themes

|dark before|dark after|light before|light after|
|-|-|-|-|
|![](https://codeberg.org/attachments/b59e793e-abe7-41ef-9008-368e79325783)|![](https://codeberg.org/attachments/fe4c75bf-4a6c-4aec-9de2-5d1b0af812dd)|![](https://codeberg.org/attachments/13920738-8193-4a9d-82f7-3d93bea6573b)|![](https://codeberg.org/attachments/a4678d87-8b98-4dec-a333-727dc758faa7)|

#### Gitea themes

|dark before|dark after|light before|light after|
|-|-|-|-|
|![](https://codeberg.org/attachments/d20c34f9-90f9-46b0-8d26-fe76d832c896)|![](https://codeberg.org/attachments/88837fc6-a75c-4679-9716-760853e14755)|![](https://codeberg.org/attachments/4830fb41-f29e-46a5-afc1-8edaaa082d78)|![](https://codeberg.org/attachments/e299e186-f581-40c2-8ebf-8e73a339ac7d)|

Some previously (or now) unused color variables were also removed. They have existed for years and were never applied anywhere.

Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/13224
Reviewed-by: Gusted <gusted@noreply.codeberg.org>
This commit is contained in:
0ko 2026-07-07 06:33:16 +02:00
commit 1d72ad088c
17 changed files with 154 additions and 117 deletions
Download patch file Download diff file Expand all files Collapse all files

2
modules/markup/markdown/callout/github.go
View file

@ -125,7 +125,7 @@ func (r *GitHubCalloutHTMLRenderer) renderAttention(w util.BufWriter, source []b
default:
octiconName = "info"
}
_, _ = w.WriteString(string(svg.RenderHTML("octicon-"+octiconName, 16, "attention-icon attention-"+n.AttentionType)))
_, _ = w.WriteString(string(svg.RenderHTML("octicon-"+octiconName, 16)))
}
return ast.WalkContinue, nil
}

2
modules/markup/sanitizer.go
View file

@ -68,7 +68,7 @@ func createDefaultPolicy() *bluemonday.Policy {
policy.AllowAttrs("class").Matching(regexp.MustCompile(`^attention-title$`)).OnElements("p")
policy.AllowAttrs("class").Matching(regexp.MustCompile(`^attention-header attention-\w+$`)).OnElements("blockquote")
policy.AllowAttrs("class").Matching(regexp.MustCompile(`^attention-\w+$`)).OnElements("strong")
policy.AllowAttrs("class").Matching(regexp.MustCompile(`^attention-icon attention-\w+ svg octicon-[\w-]+$`)).OnElements("svg")
policy.AllowAttrs("class").Matching(regexp.MustCompile(`^svg octicon-[\w-]+$`)).OnElements("svg")
policy.AllowAttrs("viewBox", "width", "height", "aria-hidden").OnElements("svg")
policy.AllowAttrs("fill-rule", "d").OnElements("path")