How to turn off purple highlighting for html color names in sublime text 3?

I am using the "Color Highlighter" plugin which allows me to directly view the color being used, but the default purple highlighting interferes with it, so I would like to disable this feature.

screenshot:

screenshot

+3


source to share


1 answer


So the problem you are having is not a Color Highlighter bug, it is a CSS language definition problem. This is easy to fix, but requires a little tweaking first.

In ST3, packages are stored in zipped files .sublime-package

, so we need to extract the CSS package to edit the language definition. It's easy to do with a plugin PackageResourceViewer

. Install it via Control Package, then open the Command Palette and enter to get the options . Select , scroll down the list to , then open the file . You can now edit this file and save it, which will create a new file (where is the folder opened by the menu item ) that you can open directly from the file menu if you need to change it again. If you want to extract the entire package, just select the option . prv

Package Resource Viewer:

Package Resource Viewer: Open Resource

CSS

CSS.tmLanguage

Packages/CSS/CSS.tmLanguage

Packages

Preferences -> Browse Packages...

Package Resource Viewer: Extract Package

Now that you've opened CSS.tmLanguage

(set the XML syntax if it wasn't already), scroll down to line 291 which should read

<string>invalid.deprecated.color.w3c-non-standard-color-name.css</string>

      

Change it to

<string>support.constant.color.color-name.css</string>

      

then save the file and everything should be installed. If the changes are not immediately visible, try restarting Sublime - you may also need to close and reopen the file.



If everything worked (and should), your CSS file should now look something like this (with the cursor at darkred

:

underlined_solid

If you want all colors to be filled instead of underline, open and, if empty, add the following: Preferences -> Package Settings -> Color Highlighter -> Settings-User

{
    "ha_style": "filled"
}

      

If the file already has some content, just add "ha_style": "filled"

as the last line (make sure you put a comma ,

after the previous line). Save the file, go back to your CSS file and it should now look like this:

filled

Good luck!

+6


source







All Articles