New css snippet/addition I would like to add

[AnasImr]

l. السلام عليكم ورحمة الله وبركاته So using the plugin at first is mind blowing and I love the work that has been put into this plugin/project, جزاك الله خيرا @AmmarCodes 🤝

however one of the things that bothered me is how the output is handled using line 65 of main.js

> [!quote] ${ayah.text}

it looked like this: it didn't look well on my obsidian vault (that could be so with other users), so I made a custom callout from this obsidian help link with this css snippet:

.callout[data-callout="quran"] {
--callout-color: 0, 255, 68;
--callout-radius: 30px;
--callout-icon: book-open;
}

and also changed the output in line 65 of main.js to:

> [!quran]- ${ayah.text}

and now the output is more special and suits the holy quran well, It looks like this:

Now I don't know how obsidian plugins implement custom css without adding them to the snippets folder but I hope someone could help us with that, Or maybe @AmmarCodes knows how, either way, Tell me if you add this addition in the next releases/versions, I think it's a perfect addition to help our brothers and sisters out in their journey to jannah, may Allah grant us the heights of heaven :)

[AmmarCodes]

وعليكم السلام ورحمة الله وبركاته

وإياكم!

I was working on this in the past, I wanted to add a custom callout like what you did but with a custom Quran icon instead of the book-open icon.

Maybe something like this icon.

What do you think?