Can you add Kindle highlight colors as a option?

[Pvazevedo]

Could you make a code block available in the readme for those who want to implement the Kindle highlights color palette in the plugin?
I tried to change the colors but I didn't succeed, I was only able to change the icon color and their order, not the highlights color itself.

Thx, for the plugin!

[sethyuan]

The code for customizing the highlight colors is in the bottom part of the README.

[Pvazevedo]

Thanks, I was able to change the colors using the code by custom.css

But I tried to create another color by modifying an existing one and added the name of brown

The color I chose works but the #colorname doesn't disappear like the other colors.

[sethyuan]

You need to add #brown in here too:

span[data-ref="#red"],
span[data-ref="#green"],
span[data-ref="#blue"],
span[data-ref="#brown"],
span[data-ref="$red"],
span[data-ref="$green"],
span[data-ref="$blue"] {
  display: none;
}

[Pvazevedo]

I added it, but it still didn't work.

[sethyuan]

Well, I think there is two possibilities:

1. You have a theme or another CSS rule somewhere that overrode the CSS rule here.
2. Your custom.css file has invalid syntax somewhere (I just saw one).

What's this separator line and "WRAP PLUGIN"? They are not valid CSS. custom.css is a CSS file, it should follow CSS syntax.

[Pvazevedo]

It was the 1st option, I removed all the customs and only left the block you sent and it worked.
I even did a test with WRAP PLUGIN and separator line, to see if they caused any problems, but there was no change at this point, but thanks for the warning.

Thanks for the answers, I'll take a good look at which of the code blocks in custom.css is causing this.

[Pvazevedo]

I found another thing lol, sorry for the trouble.

When i use remove formatting, the [[#brown]] hashtag is not being erased.

And this i tested with a clean custom.css

[sethyuan]

You need to modify the regex for "remove formatting", add brown to it, something like this:

"repl-clear": {
  "label": "Remove formatting",
  "binding": "mod+shift+x",
  "regex": "\\[\\[(?:#|\\$)(?:red|green|blue|brown)\\]\\]|==([^=]*)==|~~([^~]*)~~|\\^\\^([^\\^]*)\\^\\^|\\*\\*([^\\*]*)\\*\\*|\\*([^\\*]*)\\*|_([^_]*)_|\\$([^\\$]*)\\$",
  "replacement": "$1$2$3$4$5$6$7",
  "icon": "<svg t=\"1643381967522\" viewBox=\"0 0 1024 1024\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" p-id=\"1377\" width=\"200\" height=\"200\"><path d=\"M824.4 438.8c0-37.6-30-67.6-67.6-67.6l-135.2 0L621.6 104.8c0-37.6-30-67.6-67.6-67.6-37.6 0-67.6 30-67.6 67.6l0 266.4L358.8 371.2c-37.6 0-67.6 30-67.6 67.6l0 67.6L828 506.4l0-67.6L824.4 438.8 824.4 438.8zM824.4 574c-11.2 0-536.8 0-536.8 0S250 972 88.4 972L280 972c75.2 0 108.8-217.6 108.8-217.6s33.6 195.2 3.6 217.6l105.2 0c-3.6 0 0 0 11.2 0 52.4-7.6 60-247.6 60-247.6s52.4 244 45.2 244c-26.4 0-78.8 0-105.2 0l0 0 154 0c-7.6 0 0 0 11.2 0 48.8-11.2 52.4-187.6 52.4-187.6s22.4 187.6 15.2 187.6c-18.8 0-48.8 0-67.6 0l-3.6 0 90 0C895.6 972 903.2 784.4 824.4 574L824.4 574z\" p-id=\"1378\" fill=\"#eeeeee\"></path></svg>"
}

[Pvazevedo]

Now it's perfect! Thank you!

I think that a paragraph about this in the readme file would be nice for future users.