alangrainger / share-note

Instantly share an Obsidian note with the full theme exactly like you see in your vault. Data is shared encrypted by default, and only you and the person you send it to have the key.
MIT License
326 stars 17 forks source link

(Some) Icons in note titles are not rendered. #118

Open pedramamini opened 3 months ago

pedramamini commented 3 months ago

Leveraging a plugin like iconify allow for addition of SVG icons which then fail to render in shared notes, example:

Retrieving frontmatter from a hierarchy of files and rendering information dynamically: <span class="iconize-icon-in-link" title="RaSpearHead" aria-label="RaSpearHead" data-icon="RaSpearHead" aria-hidden="true" style="color: rgb(255, 0, 0); transform: translateY(20%);"><svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="16px" height="16px" viewBox="0 0 612 612" enable-background="new 0 0 612 612" xml:space="preserve" fill="currentColor"><path d="M466.796,284.883c-45.369,32.554-89.506,35.115-137.114,15.78c0.046-0.82,0.075-1.644,0.075-2.475 c0-23.903-19.379-43.281-43.281-43.281c-4.194,0-8.243,0.608-12.078,1.721L40.901,23.721l-14.826,0.134l-0.009-0.001l0.067,35.862 l221.006,220.425c-2.525,5.495-3.944,11.604-3.944,18.047c0,23.902,19.378,43.281,43.281,43.281c2.348,0,4.65-0.193,6.896-0.553 c16.088,47.031,12.197,91.335-15.06,132.45c76.586,52.09,195.432,100.151,294.609,106.127 C577.242,477.597,522.323,363.111,466.796,284.883z"></path></svg></span>Ritualism

Perhaps best to add a plugin option with a list of classes that are allowed to pass through as direct HTML to support this (via "iconize-icon-in-link") and future needs?

alangrainger commented 3 months ago

Sorry, I don't understand. Iconize works fine in both note and title:

https://share.note.sx/fx9o5mt6#g5Lqk27DRYjca5+iBywOfc4Pbt/mJZksYWCL5TFOyos

Did you follow the troubleshooting steps that were shown when you went to create this issue?

pedramamini commented 3 months ago

Here's an example:

https://share.note.sx/zasaru7u#JHlvkSLYoLRiS+N8xKU0FrT9Es3jnBJJT/SxCbo40Z8

image image
alangrainger commented 3 months ago

Yes, but did you follow the troubleshooting steps? I assume the issue is that you need to force the CSS to upload. If not, can you also try in a Sandbox vault?

I can confirm that Iconize icons work fine in a link also:

https://share.note.sx/kugy229r#FtP3DPh0AGq/Fbz2gqA4kW+XZXfb3tB8uFvsOXsyDdk

pedramamini commented 3 months ago

Yes, I've done the force re-upload and can confirm the CSS step is happening:

image

However, it's still rendering the HTML as plain-text instead of being interpreted to produce the SVG icon. Here's reproduction in a fresh sandbox environment with both Iconize and ShareNote installed and force re-uploaded as well:

https://share.note.sx/srdtnx35#Mqh7lV5JcsSv7JksDj5s8jRRX9ceKll94IZBTy2tJPI

alangrainger commented 3 months ago

I can see that some icons work and some do not:

https://share.note.sx/kugy229r

Not sure what the issue is, but I will leave this issue open in the meantime.

pedramamini commented 3 months ago

Ah how interesting. Thanks for confirming, look forward to the eventual fix. I tried a few more icons from differing packs to see if it was based on that, haven't found a dividing line yet, maybe some additional details for you here to aid in debugging:

https://share.note.sx/srdtnx35#Mqh7lV5JcsSv7JksDj5s8jRRX9ceKll94IZBTy2tJPI

Side note, great extension, love!

borthwick commented 3 months ago

Im having a similar issue with icon -- screen shots attached. I tried all the troubleshooting steps CleanShot 2024-08-14 at
![CleanShot 2024-08-14 at 20 59 49@2x](https://github.com/user-attachments/assets/0225efd9-3754-40
![CleanShot 2024-08-14 at 21 00 04@2x](https://github.com/user-attachments/assets/2c01e876-d5c1-4779-b167-5b9eabba15a4)
d8-9efe-f86e995ed215)
20 59 33@2x