[Obsidian Publish] Add note title and tag classes to each note wrapper

Use case or problem

I’d like to write CSS styles that target particular notes that I publish using Obsidian Publish. For example, I’d like to specify a different background color or width for some notes.

Proposed solution

Add a unique class name to every .publish-renderer element.

The class name should be a CSS compatible transform of the note title. So if the note title was Derek Parfit the class might be .note--derek-parfit.

This would make it easy to target styles to a particular note using publish.css.

I’d suggest the same thing for tag and folder information too. So if the tag name was “philosophy”, the class might be tag--philosophy.

WordPress does something like this on the <body> element.

Current workaround (optional)

I could write some JavaScript to achieve this.

If there’s a “note opened” event I can attach a listener to, it’d be great if someone could tell me about that. Otherwise I’ll try a MutationObserver.