Use case or problem
Sometimes I want my internal links to be displayed in a different way depending on the category of the note it relates to.
For example I would like internal links linking to the note related to someone to be displayed like this
while internal links to other kind of notes would have other kind of appearance.
Proposed solution
Include the values of front-matter tags and cssclass keys of a note in the <a.internal-link> element in preview mode so that we can make a dedicated css-snippet for it.
Example:
Say i have a note about “Julien” with the following front-matter:
---
tags: Business, France
cssclass: people
---
the <a.internal-link>
could be supercharged with those attributes like this:
'<a class="internal-link people" fm-tags="Business France" ...>
Therefore i could create a css-snippet like this:
a.people {
color: white;
background-color: #1d4aa5;
padding: 3px 8px 3px 8px;
text-decoration: none;
border-radius: 14px;
}
a[fm-tags*="France"]:before {
content: "🇫🇷"
}
and my internal link to “Julien” would be renderer in a different manner than other internal-link like that