Highlight comment in Python


#1

I am new to Atom, but when I make comments in python code using Vim, if I want to highlight those comments so next time I will immediately notice them when I review the code, I can do something like
#TODO: comments
or
#FIXME: comments
or
#BUG: comments
or
#XXX: comments
Vim will put some bright yellow color around TODO and FIXME. Although in Atom, the color of characters for that that two words will change too, but there is no such color apply on those two words. In my view, they are still too vague and hard to distinguish from other codes(I am using One Light Theme). In addition, I even want Atom to highlight the entire lines of comments with those keywords, not just change the font color. So is there a way I can do/ a package I can install to make Atom behaves like Vim in the way I describe above?
Thanks


#2

Glad to see your forum posting issue was resolved. As for your question, it’s a little tricky to do a simple fix.

To get custom colours around the statements, you can try the following style

.syntax--todo,
.syntax--fixme,
.syntax--bug,
.syntax--changed,
.syntax--idea,
.syntax--hack,
.syntax--note,
.syntax--review,
.syntax--nb,
.syntax--question,
.syntax--combak,
.syntax--temp,
.syntax--debug,
.syntax--optimize,
.syntax--warning,
.syntax--xxx {
  color: limeGreen;
  background-color: lighten(purple, 20);
}

Naturally, you can replace the colour and background colour with anything you like. Pasting this into your stylesheet will automatically apply it to the keywords observed by language-todo (note: WARNING is not released yet).

However, getting the style on the whole comment is not so straightforward. The problem is that the language-todo package (which is responsible for recognising the listed keywords) doesn’t know when the comment ends. For example, it would not be able to handle the following JavaScript

let x = /* TODO: this would break */ 15;

However, an issue on that package has provided the following workaround you can just copy and paste into your style sheet, if you are willing to risk potentially incorrect highlighting

.syntax--todo, .syntax--fixme {
  background: rgba(0,255,0,.05);
  display: inline-block;
  position: relative;
  color:  rgba(0,255,0,.5);
  font-weight: bold;
  &:before, &:after {
    position: absolute;
    display: block;
    content: '';
    top: 0;
    z-index: 999;
    height: 100%;
    width: 1024px;
    background: inherit;
    pointer-events: none;
    z-index: 9999;
  }
  &:before {
    right: 100%;
    content: '';
    text-align: right;
  }
  &:after {
    left: 100%;
  }
}

.syntax--fixme {
  color: rgba(255,0,0,1);
  background: rgba(255,0,0,.1);
}

I don’t know much about what that one is doing though, so I can’t help with any incorrect highlighting you might get.


#3

Thanks for your help Aerijo