Help on the styles.less (background-color)



I’m trying to change the background-color of the PHP syntax using my styles.less file.
So far I’ve done that :

atom-text-editor::shadow .embedded.php {
  background-color: #535760;

But it’s kinda ugly:

Any ideas to take in all the php and not the lines only ? Like if I am selecting code, it’ll background color everything and don’t let some interlines like I have now.

Thanks !


You should rather use this selector:

atom-text-editor[data-grammar="text html php"] {

Or less specific:

atom-text-editor[data-grammar*="php"] {


I tried both and it didn’t change the colors at all. :confused:


You can use the following:

atom-text-editor::shadow .line .embedded.php:last-child::after {
  content: '';
  position: absolute;
  display: block;
  z-index: -1;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: #535760;

As you can see, it doesn’t do empty lines, but it does work with the highlighted cursor line.


Very good, thanks a lot! If someone manage to find something for empty lines it would be perfect!


Empty lines is currently not possible at all, they don’t have any scope, so catching only empty (embedded) php lines is impossible…


Alright, thanks!