Option to set highlight style per <mark>

[ShahriarKh]

Is your feature request related to a problem? Please describe. It will be really cool to be able to set the highlight style per <mark>, just like how we set the color using class names (<mark class="color-name">).

Describe the solution you'd like Something like <mark class="pths-border"> (pths stands for prism theme highlight style, just a random class name 🙂)

[damiankorcz]

Hi @ShahriarKh, I've considered this feature and have it working locally, although I'm conflicted on the best naming for each style. I personally like verbose naming but that adds to the string length for each and adding options for changing the style individually, further deviates from the fairly transferable naming with just plain colour names. I don't want users to pollute their files with theme specific tags and classes.

I'll give it some more thought and if I feel like adding it, it will probably have to be alongside an updated CSS snippet for Mark Highlights so there is at least a way for users to use them outside of Prism instead of making it a feature that locks them to the theme.

[ShahriarKh]

Hi @damiankorcz Yes, you're right about classes and file pollution and I agree with you.
Recently, I saw a creative approach for something similar (I can't remember what plugin or theme used it): A syntax like ~~ for yellow, ~* for blue, ~# for red, ... Maybe we can do the same with two parameters? One for the color, one for the highlight style.

0: none (just colorize the text), 1: bordered, 2: filled, 3: filled & bordered
r, o, y, g, m, c, b, p, k, g, a: first letter of the color name (except "k" for pink and "a" for accent color)

so

=2c=highlighted text==

should render a filled, cyan mark

[damiankorcz]

Hi @ShahriarKh, I've added Overwrite classes for individual Mark Highlights in version 3.1.0. I've went with fairly verbose class names just to make them readable even though they are longer to type. Kept them fairly generic so there is potential for other themes to use the naming scheme.

This was done mostly since I don't think it will be used that frequently and most users will set one style in Style Settings and either never use overwrites or very infrequently. Using abstract symbols and heavily abbreviated naming didn't feel right so I didn't go that route.

I'm thinking of creating a Wiki thread in the future for Prism specific Espanso triggers which would make using features like Callouts and Mark Highlights easier.

If there are no issues with the implementation, I'll start work on a separate CSS Snippet for Mark Highlights.

Anyway, I've also written a guide on how to use Mark Highlights and the Overwrite classes for the wiki: https://github.com/damiankorcz/Prism-Theme/wiki/Mark-Highlight-System-Guide

[ShahriarKh]

Hi @damiankorcz This is awesome! Also, the wiki looks good, never seen that before. I updated the theme and tested the new functionality; it's working fine. 👍🏽

For names, I understand why you prefer verbose class names. But I still prefer a "shortcut" way. I'm not telling you to refactor this, but an extra option, like Espanso as you suggested, or maybe a plugin for that makes it way easier to highlight text when typing notes.