Hi,
I’m in the process of migrating UI from Connect to Forge for my Jira app and found this issue:
The top link is defined using a Forge module, and the lower link is from Connect.
The top icon has this html
<div class="css-14f2q7m">
<svg viewBox="0 0 20 20">
<defs>
<filter id="changeFillColor"><feColorMatrix type="matrix" values="0.08, 0, 0, 0, 0, 0, 0.1, 0, 0, 0, 0, 0,0.2, 0, 0, 0, 0, 0, 1, 0"></feColorMatrix></filter>
</defs>
<image xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="https://icon.cdn.prod.atlassian-dev.net/5d1cd93f-15e6-4f9d-8c7f-04734008ba53/69e2b473-9ca6-4312-946e-95e9b4aa2528/a27dbe46-811b-42ed-b0f2-925aef444039/kit-assets/images/app-logo.svg" width="20" height="20" x="0" y="0" filter="url(#changeFillColor)"></image>
</svg>
</div>
Where as the lower has this:
<div class="css-14f2q7m">
<svg viewBox="0 0 20 20">
<defs>
<filter id="changeFillColor"><feColorMatrix type="matrix" values="0.08, 0, 0, 0, 0, 0, 0.1, 0, 0, 0, 0, 0,0.2, 0, 0, 0, 0, 0, 1, 0"></feColorMatrix></filter>
</defs>
<image xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="https://jjc-staging.marvelution.com/images/icon_144.png" width="20" height="20" x="0" y="0" filter=""></image>
</svg>
</div>
Why is the changeFillColor filter applied? If I remove this then the icon shows as expected.
Any tips?