aztack
aztack

Reputation: 4604

Is it possible to change background color of some code in Sublime Text 3?

I want change background color of calls __$sa__login and gtag, so I can quickly find all the 'analytic' code in a .js file.

this.__$sa__login(user.id)._____
....
gtag( { 'Country': user.zoneId } )

Something like this: enter image description here

Upvotes: 0

Views: 338

Answers (1)

aztack
aztack

Reputation: 4604

I found a solution with this great Sublime Text plugin HighlightWords

enter image description here

Here is my config:

{
  // The colors to highlight texts are specified by a list of theme scope names,
  // and HighlightWords uses this list in circular order.
  "colors_by_scope": [
    "string",
    "entity.name.class",
    "variable.parameter",
    "invalid.deprecated",
    "invalid",
    "support.function"
  ],
  "whole_word": false,
  "use_regex": true,
  "ignore_case": false,

  // Keywords to be always highlighted, clear the list to disable it.
  // "keyword" are literally matched, and "color" refers to theme scope names.
  // "flag": 0 - regex, 1 - literal (default), 2 - regex and ignore case, 3 - literal and ignore case
  // Note that json has some special characters like '\' should be escaped.
  "permanent_highlight_keyword_color_mappings": [
    {"keyword": "TODO", "color": "support.function"},
    {"keyword": "FIXIT .*", "color": "support.function", "flag": 2},
    {
      "flag": 0,
      "keyword": "this\\.__\\$sa__\\w+\\(.*?\\)\\._+",
      "color": "text.html.vue source.js.embedded.html meta.export.js meta.object-literal.js meta.object-literal.js meta.block.js meta.function-call.method.js meta.group.js string.quoted.single.js"
    },
    {
      "flag": 0,
      "keyword": "gtag\\(.*?\\)",
      "color": "text.html.vue source.js.embedded.html meta.export.js meta.object-literal.js meta.object-literal.js meta.block.js meta.function-call.method.js meta.group.js string.quoted.single.js"
    }
  ]

}

Upvotes: 1

Related Questions