Home
Head's Up: I'm in the middle of upgrading my site. Most things are in place, but there are something missing and/or broken including image alt text. Please bear with me while I'm getting things fixed.

Turn Off Highlights In Ace Editor For Specific Lines

This isn't a full set, but this is how you can override syntax highlighting for certain lines in the Ace Editor.

The method makes a new style sheet that's appended to the document and updates it that way. The CSS does [TODO: Code shorthand span ] with [TODO: Code shorthand span ] to select all the lines other than the one you're after.

TBD if there's a way to do that to not highlight two lines

css
const removeHighlights = () => {
  console.log('removeHighlights')
  s.styleOverride = document.createElement('style')
  s.styleOverride.innerHTML = `
.ace-monokai .ace_line:not(:nth-child(2)) .ace_keyword,
.ace-monokai .ace_line:not(:nth-child(2)) .ace_lparen,
.ace-monokai .ace_line:not(:nth-child(2)) .ace_rparen,
.ace-monokai .ace_line:not(:nth-child(2)) .ace_entity,
.ace-monokai .ace_line:not(:nth-child(2)) .ace_name,
.ace-monokai .ace_line:not(:nth-child(2)) .ace_function,
.ace-monokai .ace_line:not(:nth-child(2)) .ace_source,
.ace-monokai .ace_line:not(:nth-child(2)) .ace_rust
{
  color: #777;
}
`
  document.body.appendChild(s.styleOverride)
}

NOTE, to do it for multiple lines

css
.ace-monokai .ace_line:not(:nth-child(2)):not(:nth-child(3)) .ace_keyword { color: green; }

That will do all lines except 2 and 3