如何解决react-icons-无法更改颜色索环图标
我正在使用react-icons和Font Awesome图标,我设法通过两种方法轻松更改了颜色:
与彩色道具配合使用:
<FaUserTimes /* color="#023373" */ className="icone icone-40" />
使用CSS:
.icone {
color: #023373;
}
现在,使用“扣眼”图标似乎无济于事,图标始终为黑色
<GrFormAdd color="#023373" className="icones" />
.icones {
font-size: 30px; **Font size works!?**
color: #023373;
}
解决方法
完整代码:https://codesandbox.io/s/pensive-rgb-r8g1t?file=/src/App.js
对于颜色,传递一个像这样的道具(我称之为蓝色)。
<Apple color="blue" size="xlarge" />
因此在另一端设置您的图标的样式。
const customColorTheme = deepMerge(base,{
icon: {
extend: css`
${(props) =>
props.color === "blue" &&
`
fill: #023373;
`}
`
}
});
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。