MingCute icon indicating copy to clipboard operation
MingCute copied to clipboard

Suggestions on the initial color of icon library

Open Barry-Flynn opened this issue 1 year ago • 3 comments

Hello friend, I really like this icon library, but during use, I found that you have set an initial value of '# 09244b' for all CSS icons, which may cause confusion for developers. Even though colors can be style overridden during development, I think icon fonts without initial color settings (inheriting parent elements) are more suitable, right?

你好朋友,非常喜欢这个图标库,但是在使用过程中发现你们为所有的CSS图标设置了初始值 '#09244b',这可能会为开发者带来困扰,即便开发过程中可以对颜色进行样式覆盖,但我觉得没有设置初始颜色的图标字体(继承父元素)更合适,不是吗?

Barry-Flynn avatar Aug 19 '24 10:08 Barry-Flynn

目前在项目中,我使用下方 CSS 对图标颜色进行了强制覆盖:

// 强制覆盖 mingcute_icon 图标库的初始字体颜色
// 匹配所有以 mgc_ 开头的类名和包含 mgc_ 的类名的::before 伪元素
[class^='mgc_']::before,
[class*=' mgc_']::before {
  // 继承父元素的字体颜色
  color: inherit !important;
}

Barry-Flynn avatar Sep 20 '24 11:09 Barry-Flynn

填充色的问题有几个用户在提,应该是要去掉颜色,使用currentColor。身为设计师,对代码的研究有欠缺,未找到有效批量调整的方法。SVG格式的图标是通过Figma导出的会自动带上颜色信息,然后用SVGO进行了压缩和格式化。如果你有批量调整的方法欢迎指导,另外图标也有想增加VUE、React和Flutter的格式包更方便大家使用,仍在探索代码中。

Richard9394 avatar Sep 20 '24 12:09 Richard9394

在项目的 Readme 中补充了相关代码,已提交 PR,您可以合并到主分支 https://github.com/Richard9394/MingCute/pull/55

Barry-Flynn avatar Sep 20 '24 15:09 Barry-Flynn