Highlighted selection on code chunk with background


#1

Hello everybody!
I would like to have python code chunks automatically highlighted, and I found several (succesful) ways to obtain that here. Currently the option that I have in the styles.less file is:

atom-text-editor {
	.line {
		position: relative;

		.syntax--python::before {
			background-color: #e0ebeb;
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			content: '';
			display: block;
			z-index: -1;
		}
	}
}

However there is a problem: if I select some code in the highlighted text, it does not really get highlighted.
It would be really great if somebody could help me with this.

Thank you in advance!


#2

I found out. Here it is, in case any of you need:

atom-text-editor::shadow {
  .line {
    position: relative;

    .embedded {
      &::before {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        content: '';
        display: block;
        z-index: -1;
      }

      &.python::before {
        background-color: fade(#e0ebeb, 50%);
      }
    }
  }
}