mirror of
https://github.com/go-gitea/gitea.git
synced 2024-12-15 11:38:33 +01:00
36887ed392
1. The previous color contrast calculation function was incorrect at least for the `#84b6eb` where it output low-contrast white instead of black. I've rewritten these functions now to accept hex colors and to match GitHub's calculation and to output pure white/black for maximum contrast. Before and after: <img width="94" alt="Screenshot 2024-04-02 at 01 53 46" src="https://github.com/go-gitea/gitea/assets/115237/00b39e15-a377-4458-95cf-ceec74b78228"><img width="90" alt="Screenshot 2024-04-02 at 01 51 30" src="https://github.com/go-gitea/gitea/assets/115237/1677067a-8d8f-47eb-82c0-76330deeb775"> 2. Fix project-related issues: - Expose the new `ContrastColor` function as template helper and use it for project cards, replacing the previous JS solution which eliminates a flash of wrong color on page load. - Fix a bug where if editing a project title, the counter would get lost. - Move `rgbToHex` function to color utils. @HesterG fyi --------- Co-authored-by: delvh <dev.lh@web.de> Co-authored-by: Giteabot <teabot@gitea.io>
58 lines
1.9 KiB
Go
58 lines
1.9 KiB
Go
// Copyright 2023 The Gitea Authors. All rights reserved.
|
|
// SPDX-License-Identifier: MIT
|
|
package util
|
|
|
|
import (
|
|
"fmt"
|
|
"strconv"
|
|
"strings"
|
|
)
|
|
|
|
// Get color as RGB values in 0..255 range from the hex color string (with or without #)
|
|
func HexToRBGColor(colorString string) (float64, float64, float64) {
|
|
hexString := colorString
|
|
if strings.HasPrefix(colorString, "#") {
|
|
hexString = colorString[1:]
|
|
}
|
|
// only support transfer of rgb, rgba, rrggbb and rrggbbaa
|
|
// if not in these formats, use default values 0, 0, 0
|
|
if len(hexString) != 3 && len(hexString) != 4 && len(hexString) != 6 && len(hexString) != 8 {
|
|
return 0, 0, 0
|
|
}
|
|
if len(hexString) == 3 || len(hexString) == 4 {
|
|
hexString = fmt.Sprintf("%c%c%c%c%c%c", hexString[0], hexString[0], hexString[1], hexString[1], hexString[2], hexString[2])
|
|
}
|
|
if len(hexString) == 8 {
|
|
hexString = hexString[0:6]
|
|
}
|
|
color, err := strconv.ParseUint(hexString, 16, 64)
|
|
if err != nil {
|
|
return 0, 0, 0
|
|
}
|
|
r := float64(uint8(0xFF & (uint32(color) >> 16)))
|
|
g := float64(uint8(0xFF & (uint32(color) >> 8)))
|
|
b := float64(uint8(0xFF & uint32(color)))
|
|
return r, g, b
|
|
}
|
|
|
|
// Returns relative luminance for a SRGB color - https://en.wikipedia.org/wiki/Relative_luminance
|
|
// Keep this in sync with web_src/js/utils/color.js
|
|
func GetRelativeLuminance(color string) float64 {
|
|
r, g, b := HexToRBGColor(color)
|
|
return (0.2126729*r + 0.7151522*g + 0.0721750*b) / 255
|
|
}
|
|
|
|
func UseLightText(backgroundColor string) bool {
|
|
return GetRelativeLuminance(backgroundColor) < 0.453
|
|
}
|
|
|
|
// Given a background color, returns a black or white foreground color that the highest
|
|
// contrast ratio. In the future, the APCA contrast function, or CSS `contrast-color` will be better.
|
|
// https://github.com/color-js/color.js/blob/eb7b53f7a13bb716ec8b28c7a56f052cd599acd9/src/contrast/APCA.js#L42
|
|
func ContrastColor(backgroundColor string) string {
|
|
if UseLightText(backgroundColor) {
|
|
return "#fff"
|
|
}
|
|
return "#000"
|
|
}
|