search

atom / language-todo

TODO highlighting package for Atom
Other
81 stars 66 forks source link

Line Highlighting #64

Open round opened 6 years ago

round commented 6 years ago

(Reference from: https://github.com/mrodalgaard/atom-todo-show/issues/173)

Just a thought, but perhaps each type could highlight the entire line. I've done a very hacky stylesheet-only implementation of this together using only pseudoclasses:

.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);
}

Ends up looking like this: screen shot 2017-09-13 at 1 59 35 am

This is, of course, an enhancement, and not a bug :)

inoas commented 6 years ago

For me the font color changes do not work. And 1024px may not be enough.

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