CM6: Fix spacing between editors

[HaudinFlorence]

This PR fixes ##720

The gap between the different editors that was put to 10 px has been removed.

CM5 version

CM6 version

[fcollonval]

Bot please update playwright snapshots

[github-actions]

Playwright ubuntu-22.04 snapshots updated.

[github-actions]

Playwright windows-latest snapshots updated.

[vidartf]

In the CM6 screenshot there is still a gap (white) between the local and remote editor and the merged result view. We should get rid of that too before closing #720.

[vidartf]

(Happy to merge this as it currently is, as it is a good improvement though!)

[HaudinFlorence]

@vidartf I did not see the white remainig spaces. I am proposing a fix for this in commit c285455 (not sure that it is the best solution) : it consists in adding the cell background color style to the left and right editors (as well as in the central one since I guess it may happen that this white gap occurs in this editor as well). Note that there is still a gap in the gutter.

CM6 version

[vidartf]

I think the underlying problem is that the central editor is higher for some reason. You can see this even with the old spacing. Inspecting this closer in CSS, it seems to be from some remaining border styles being applied:

/* merge.css */
.jp-Notebook-merge .cm-merge-m-chunk-end-either, .jp-Notebook-merge .cm-merge-m-chunk-end-mixed:not(.cm-merge-m-chunk-custom) {
    border-bottom: 1px solid var(--jp-merge-either-color1);
}

This one should be switched to whatever (non-space taking) style we are using for the other chunk starts/ends.

[HaudinFlorence]

There seems to be a discrepancy between the height of the local and remote editors and the height of the central one. This is due to the fact that adding or not chunk-start and chunk-end decorations makes that lines don't all have the same height. There is a cumulative effect. At some point we proposed a logics adding systematically a transparent border but it has been removed during the review. I don't remember why.
Note there were also some borders surrounding the editors in the CM5 version that are not present in the current CM6 version.

[vidartf]

Bot please update playwright snapshots

[HaudinFlorence]

I think the underlying problem is that the central editor is higher for some reason. You can see this even with the old spacing. Inspecting this closer in CSS, it seems to be from some remaining border styles being applied:

/* merge.css */
.jp-Notebook-merge .cm-merge-m-chunk-end-either, .jp-Notebook-merge .cm-merge-m-chunk-end-mixed:not(.cm-merge-m-chunk-custom) {
    border-bottom: 1px solid var(--jp-merge-either-color1);
}

This one should be switched to whatever (non-space taking) style we are using for the other chunk starts/ends.

This is normally fixed in commit 90bb3ce

[HaudinFlorence]

bot please update snapshots

[HaudinFlorence]

There seems to be a discrepancy between the height of the local and remote editors and the height of the central one. This is due to the fact that the adding or not chunk-start and chunk-end decorations makes that lines don't all have the same height. There is a cumulative effect. At some point we proposed a logics adding systematically a transparent border but it has been removed during the review. I don't remember why.

After having a look at the css, I have been updated on the changes. But I don't understand where the style of the decoration for the start / end of the chunks is defined now... without using the border-bottom / bottom-top properties. There are maybe some other leftovers of the old logics remaining (everywhere border properties is used). The cyan color has been lost in commit 90bb3ce for the chunk-start-mixedand chunk-start-enddecorations.

[HaudinFlorence]

bot please update snapshots.

[HaudinFlorence]

There seems to be a discrepancy between the height of the local and remote editors and the height of the central one. This is due to the fact that the adding or not chunk-start and chunk-end decorations makes that lines don't all have the same height. There is a cumulative effect. At some point we proposed a logics adding systematically a transparent border but it has been removed during the review. I don't remember why.

After having a look at the css, I have been updated on the changes. But I don't understand where the style of the decoration for the start / end of the chunks is defined now... without using the border-bottom / bottom-top properties. There are maybe some other leftovers of the old logics remaining (everywhere border properties is used). The cyan color has been lost in commit 90bb3ce for the chunk-start-mixedand chunk-start-enddecorations.

I am now ok with this and this should be fixed with c2d47fd. The result is now looking like this for version CM6:

[HaudinFlorence]

bot please update snapshots

[HaudinFlorence]

bot please update snapshots

[krassowski]

I think you are missing "playwright". We can change the trigger phase (which we did recently elsewhere) to simplify it, but in this repo it is still:

bot please update playwright snapshots

[HaudinFlorence]

I think you are missing "playwright". We can change the trigger phase (which we did recently elsewhere) to simplify it, but in this repo it is still:

bot please update playwright snapshots

My bad... Thanks Mike

[github-actions]

Playwright windows-latest snapshots updated.

[github-actions]

Playwright ubuntu-22.04 snapshots updated.

[krassowski]

Looks good to me, thank you @HaudinFlorence!