Fold gutter gaps.

[whaaaley]

These might be related to the other issue I posted #111, about the temporary extra space next to the active line highlight.

When the window is inactive I get this gap in the fold gutter:

When the window is inactive and the active line is on the fold gutter I get this:

The first thing that comes to mind would be making the fold gutter background transparent. I haven't had time to look at the code in depth, but it looks like that might be possible. If that fixed the problem it might be possible to reverse the change made in #111 to update the line cache.

[thehogfather]

What theme are you using? I can't seem to reproduce on the default brackets dark theme.

[whaaaley]

I'm using Neon, a theme of mine, but I tested a few others and I see the same issue in Atom Light / Atom Dark.

I've also went and removed all the custom CSS relating to Code Folding and but it doesn't seem to have any effect.

[thehogfather]

Not 100% sure what the cause is. Does the issue go away if you explicitly style the height of .CodeMirror-foldgutter-blank, .CodeMirror-foldgutter-open etc ..?

So styling those classes fixes the issues for your theme and I think they need to be updated and adjusted on a per-theme basis. So in the case of your neon theme this edit in your css:

.CodeMirror-foldgutter-open,
.CodeMirror-foldgutter-folded,
.CodeMirror-foldgutter-blank {
    height: 1.25em;
}

[whaaaley]

I tried your fix but it was off by 1px for me and it was really bugging me, so I spent some time in the debugger and found out that this class, the class wrapping .CodeMirror-foldgutter-open, height wasn't defined, so I changed it to this:

.CodeMirror-gutter-elt {
  height: 1.375rem;
}

The font size gets weird in this area too, for some reason, so I had to specify rems, to prevent it from scaling incorrectly.

I'm not sure how it should be handled though. Whether it should be a theme fix or a Code Folding fix, or even a Bracket's bug, because I think .CodeMirror-gutter-elt is a Brackets class, right?

But at least there's an issue now for other theme authors to discover.

EDIT: I spoke a little too soon. It doesn't scale right. This number is closer, but it'd be nice if I could find the font-size property that's messing this up.

height: 1.21875em;

EDIT 2: Oh, a pretty simple:

height: 100%;

Works instead.

[thehogfather]

Good shout. I will add the height property for .CodeMirror-gutter-elt to the code-folding css. It is a CodeMirror library class.

Out of interest did you manage to find out why the issue was only present when the editor was inactive?

[whaaaley]

I went back and poked around more and found this:

This CSS goes away when not in focus, but I can't imagine why.