通过 CSS 更改 d-icon 图标

开发
1

大家好！

我正在为 Discourse Follow 设置样式，随后我开始考虑针对以下内容的修改：

button[aria-label="Follow"] 或 button[aria-label="Following"]

请问是否可以通过 CSS 更改图标？如果是这样，就能实现从“关注”（user-plus）到“已关注”（user-check）的图标切换。

Screen Shot 2020-11-13 at 11.56.36
Screen Shot 2020-11-13 at 11.56.36138×108 726 Bytes

Screen Shot 2020-11-13 at 11.54.03
Screen Shot 2020-11-13 at 11.54.03934×336 16.2 KB

希望大家能帮帮我！

此致，
Felipe

编辑（解决方案）：
耶！我通过用户对象引用进行了调整：

{{follow-toggle icon=(if user.following 'user-check' 'user-plus') user=user}}

Screen Shot 2020-11-13 at 12.07.31
Screen Shot 2020-11-13 at 12.07.31696×248 11.8 KB

谢谢大家！

4

@feabila，这个主意太棒了。

确实非常出色，我已经将其中一部分内容提交到了仓库：

https://github.com/paviliondev/discourse-follow/commit/2609657fc4e155ea1d1f6ddb74ac2600a46eeaa0

干得漂亮！: +1: :tada:

实际上，我会保持你提出的功能逻辑不变，但会进行简化，并依赖现有的计算属性：

https://github.com/paviliondev/discourse-follow/commit/6bcdebb40fea0233ac4b46548ccc720bc263c08c

如果你有兴趣了解这个替代实现方案，欢迎查看。

祝好！