kezhenxu94 / mini-github

GitHub WeChat Mini Program
Apache License 2.0
1.2k stars 88 forks source link

Bugfix: Label tags text can't distinguish #39

Closed ZengyiMa closed 5 years ago

ZengyiMa commented 5 years ago

Fixes #31

背景

如31问题所示,在Label tags白色背景的情况下,文本颜色也是白色,所以导致无法看出tag内容是什么。 我通过修复 tag 组件内部方法,在外部没有指定Label tag 的 TextColor 的情况下,通过自动算法,来设置 TextColor 修复此问题。

实现原理

通过观察Github网页版的 Tags 标签样式,猜测文本颜色算法大致为:R大于等于153,G大于等于110,B大于10的情况下)文本的 TextColor 为黑色,反之为白色。

效果对比

修改后与 Github 官网效果对比(并且随机添加3个 Label 测试)

Mini-Github: image

Github: image

测试

目前我们 Label Tag #的使用场景目前我们有一下几个场景,一一验证确认修复此问题。

issues首页: image

issues 详情页: image

repo详情页: image

PR 页面: image

Label 设置页面: image

多主题测试(Light 主题测试) image

多主题测试(Dark 主题测试) image