Closed itmanyong closed 1 year ago
目前插件会替换fill与stroke主要属性为currentColor,在面对多色图标时显得不是那么完美,例如两个path的fill本身颜色不一样才能体现视觉效果,但是优化后将会根据currentColor使用相同颜色,就呈现不出预期的效果。是否能针对这个场景提供一些优化呢
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="37.07" height="36" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 198"> <path fill="#41B883" d="M204.8 0H256L128 220.8L0 0h97.92L128 51.2L157.44 0h47.36Z"></path> <path fill="#41B883" d="m0 0l128 220.8L256 0h-51.2L128 132.48L50.56 0H0Z"></path> <path fill="#35495E" d="M50.56 0L128 133.12L204.8 0h-47.36L128 51.2L97.92 0H50.56Z"></path> </svg>
<symbol aria-hidden="true" class="iconify iconify--logos" viewBox="0 0 256 198" id="vue"> <path fill="currentColor" d="M204.8 0H256L128 220.8 0 0h97.92L128 51.2 157.44 0h47.36Z"></path> <path fill="currentColor" d="m0 0 128 220.8L256 0h-51.2L128 132.48 50.56 0H0Z"></path> <path fill="currentColor" d="M50.56 0 128 133.12 204.8 0h-47.36L128 51.2 97.92 0H50.56Z"></path></symbol>
如上所示:第三个path与前两个path的fill不一样才能达到预期效果,但是目前貌似不够友好
想法: 1.暴露处理currentColor的配置函数,全权交给开发者自定义 2.通过配置开启差异化css变量填充,如:第一个currentColor->var(--fill-1),第二个currentColor->car(--fill-2)
@itmanyong 增加配置函数这个想法觉得意义不大, preserveColor就可以解决多色图标的问题, 如果是要修改多色图标, 那直接去修改源文件即可.
目前插件会替换fill与stroke主要属性为currentColor,在面对多色图标时显得不是那么完美,例如两个path的fill本身颜色不一样才能体现视觉效果,但是优化后将会根据currentColor使用相同颜色,就呈现不出预期的效果。是否能针对这个场景提供一些优化呢
如上所示:第三个path与前两个path的fill不一样才能达到预期效果,但是目前貌似不够友好
想法: 1.暴露处理currentColor的配置函数,全权交给开发者自定义 2.通过配置开启差异化css变量填充,如:第一个currentColor->var(--fill-1),第二个currentColor->car(--fill-2)