Problem: The GPU layer added to the .gutter .tiles cause the surounding UI to also composite layers, like the tas or the status-bar. This disables subpixel anti-aliasing and text doesn't look that sharp.
Eventough the `.gutter` has `overflow: hidden`, it seems Chrome still thinks there is a chance of overlapping and thus creates the extra layers.
Solution: Creating an own stacking context for the `.gutter` seems to fix it.
Issue #7904
The goal is to allow the editor’s styling to be overridden as follows:
atom-text-editor {
background: black;
color: white;
}
If we retain these classes, themes will continue to style the root
element of the editor and destroy the ability to style the editor in
this way. You would instead have to do the following:
atom-text-editor::shadow .editor {
background: black;
color: white;
}
This is way less intuitive and confusing for people.
This prevents the need for a :host pseudo-class in the editor CSS which
breaks linting. It also fits selectors targeting the host element in a
more intuitive spot in the cascade.