FlorianWoelki / obsidian-iconize

Simply add icons to anything you want in Obsidian.
https://florianwoelki.github.io/obsidian-iconize/
MIT License
823 stars 55 forks source link

A few custom icons are the same, even though they are not #244

Open Pukimaa opened 11 months ago

Pukimaa commented 11 months ago

Describe the bug If you have a data image inside the svg the plugin renders every data image as the same iamge

To Reproduce Steps to reproduce the behavior:

  1. Create multiple icons with an image inside of it (I did it with Figma and then exported it as SVG)
  2. Import them into a custom pack
  3. Use different Icons

Expected behavior The correct icon will be shown

Screenshots If applicable, add screenshots to help explain your problem. The first folder icon should be different image image

Additional context At first I thought it's an issue with the naming of the file, but it's not. The icon is also always the top most visible image icon!

FlorianWoelki commented 11 months ago

Thank you for the bug report!

Could you also please attach your SVGs to this issue? So that I can reproduce this issue easily.

Pukimaa commented 11 months ago

Sure! Som Omen

Pukimaa commented 11 months ago

Any updates @FlorianWoelki?

Jonas-Krahn commented 1 month ago

In my case in turned out that my SVGs made use of the "use" and the "symbol" tag. Furthermore, all SVGs used the same value for the id attribute of the symbol tag (A) and also referenced this id in the use tag. This leads to errors when embedding multiple SVGs into your application. As the ids are the same other SVGs will use the symbol tag of the "highest" SVG inside the DOM. The following screenshot shows this.

screenshot_svgs

So the solution is to change the ids of the symbol tags inside your SVGs to unique values and to adapt the corresponding use tags.