Conflict header overlay positioning bug

[simonlayfield]

The conflict headers overlay the list of conflicts when scrolling.

Using Atom v1.0.19 Merge Conflicts v1.3.6

[smashwilson]

Hmm, it isn't doing this for me:

What themes were you using?

The version of Atom may effect this as well, if the z-index of overlay decorations was changed in core somehow. Once I publish 1.3.7, can you confirm that this is still happening on 1.1.0?

[hughker]

@smashwilson this just happened to me too… atom v1.1.0 merge-conflicts v1.3.7 Theme: Atom Light Syntax: Solarized Light

If you need any other info, just let me know.

[simonlayfield]

Hey @smashwilson - sure.

This is still happening for me. I'm using:

Atom v1.1.0 Merge Conflicts v1.3.7 Theme: One Dark Syntax: One Dark

[maxkazar]

Add into atom styles.less file:

atom-text-editor {
  overflow: hidden;
}

It helps me.

[thibauds]

I've the same issue with : Atom v1.2.4 Merge Conflicts v1.3.7 Theme: One Dark Syntax: One Dark

[bhtruong93]

Thanks @maxkazar. In case anybody can't get to styles.less, it's in preferences -> config folder -> styles.less, and add the snippet that he posted.

[andersryanc]

same thing is happening for me, it's overlapping everything

Atom v1.3.2 Merge Conflicts v1.3.7 Theme: One Dark Syntax: One Dark

[andersryanc]

The overflow trick helps, but still looks a little odd when only parts of the UI overlap the line numbers

[bhtruong93]

@andersryanc can you post your styles.less file?

[andersryanc]

I had to add "atom-text-editor" to line 15 (probably could have just replaced the class really - my styles file must be outdated)

/*
 * Your Stylesheet
 *
 * This stylesheet is loaded when Atom starts up and is reloaded automatically
 * when it is changed.
 *
 * If you are unfamiliar with LESS, you can read more about it here:
 * http://www.lesscss.org
 */

.tree-view {

}

atom-text-editor, .atom-text-editor {
  overflow: hidden;
}

.atom-text-editor::shadow .cursor {

}

/* !- Taken from Seti-UI */
.icons(@icons) when (@icons = true) {
  @import "styles/icons";
}
/*
 * Set below to false to not import Seti-UI icons.
 * Requries View -> Reload after changing value.
 * Mainly to use with file-icons package.
*/
.icons(false);

[bhtruong93]

I don't think there's anything wrong with your stylesheet. What's also odd is that your issue is a bit different from the previous ones. Yours is off in the x-direction, but the 'fix' seemed to have remedied the y-direction. :\

/*
 * Your Stylesheet
 *
 * This stylesheet is loaded when Atom starts up and is reloaded automatically
 * when it is changed and saved.
 *
 * Add your own CSS or Less to fully customize Atom.
 * If you are unfamiliar with Less, you can read more about it here:
 * http://lesscss.org
 */


/*
 * Examples
 * (To see them, uncomment and save)
 */

// style the background color of the tree view
.tree-view {
  // background-color: whitesmoke;
}

// style the background and foreground colors on the atom-text-editor-element itself
atom-text-editor {
  // color: white;
  // background-color: hsl(180, 24%, 12%);
}

// To style other content in the text editor's shadow DOM, use the ::shadow expression
atom-text-editor::shadow .cursor {
  // border-color: red;
}

atom-text-editor {
  overflow: hidden;
}

[andersryanc]

My guess would be that the other posts just didn't try scrolling left/right or had soft-wrap on or something so they couldn't.

[bhtruong93]

You're absolutely correct. I have the same issue haha. Note: At a small enough width, it snaps back into place (it's too small a width though).

[rajashekar007]

https://github.com/smashwilson/merge-conflicts/issues/188#issuecomment-159723232 worked :+1:

[rajashekar007]

Yes, on scrolling left it's overlay is on top of number line.

[henrebotha]

+1.

Atom 1.7.0 merge-conflicts 1.4.1 One Dark UI theme Oceanic Next syntax theme OSX 10.11.3

EDIT: Actually, it's worse. If the window loses focus, the UI here starts flickering like crazy. https://gyazo.com/8dfe2579a181366af614b1721f99785b

[aimuzov]

Same issue.

Atom 1.7.3 Merge-conflicts 1.4.2 One dark (UI theme) Oceanic next (Syntax theme)