Folding icons are too big and the grey frame looks uneven/blurry

[weinand]

On testing #2994

The four lines of the icon frame look uneven/blurry.

Why aren't we using the same triangles as in the navigator? The '+' and '-' icons look a bit out of place.

[egamma]

The new folding icons are distracting. The previous twistie icons were subtle, pls see the example below, when I using folding to work on the vscode.d.ts file.

I agree with @weinand that we should look consistent with the explorer.

[joaomoreno]

I got scared when I saw them just now.

👍 for bringing back the triangles.

[bgashler1]

Thanks for everyone's feedback. I just spoke with @chrisdias. After we reviewed responses from users who have seen the proposed (+/-) icons on issue #2948, we believe users actually like the idea of a (+/-) icon, but that the way we have icon represented is flawed; it's too heavy-weight, strong in contrast and it is aliased strangely.

I'm going to tone down the weight and contrast of these icons and fix the aliasing so they are very light and out of the way. If we still aren't satisfied with how the icons look by the end of the day today, then let's revert all my changes back to the twisties and we can decide if we want to continue iterating on this later or just keep the twisties. Thanks again for the feedback.

[weinand]

@bgashler1 for GA we should consider to achieve consistency with the explorer, that is if users prefer +/-we should use them in the navigator too. Having two sets of icons for the same purpose doesn't make sense to me.

[Tyriar]

@weinand I think the reasoning is because Visual Studio uses +/- for folding and arrows in the explorer.

[weinand]

@Tyriar I understand but that does not mean that we should not strive for some additional simplicity and elegance. IIRC the +/– icons made their first appearance in Windows 95 and they never existed on OS X.

[Tyriar]

@weinand I agree, I prefer the triangles personally as +/- look so busy.

[chrisdias]

@weinand completely agree on simplicity. Feedback in #2948 was favorable to +/- for expand/collapse so Brad is time boxing the effort to see if we can achieve awesomeness. If not, we will revert back to same as in explorer.

[bgashler1]

@weinand, very good point about these icons not being a paradigm used in OSX.

As @Tyriar was pointing out, I was merely trying ensure we are similar enough to feel part of the same brand family as Visual Studio. If we don't like it by the end of the day, then I won't lose any sleep over it. Being different isn't bad, as long as we are justifiably better.

[bgashler1]

Let me know what you all think of the updates I pushed. Smaller icons, lower contrast and perfect aliasing. Hopefully this resolves some concerns.

Another reason why we should use the (+/-) icon is that when we eventually add vertical braces to indicate what chunk of code expand and collapse, the icon will stand better next to the brace because it's encapsulated by a square outline Since twisties are not contained in a shape like a square, it will be hard to associate each with its paired vertical brace.

[chrisdias]

@bgashler1 thanks, these look much better. Can folks who were against +- please take a look and see what you think? Here's my take:

• The arrows are more consistent with the Explorer tree. However, we don't indent the arrows in the code as we do in the tree, so it doesn't look consistent.
• While the hit area for the arrows is larger than the arrow itself, I still find myself feeling the need to get the mouse right over the arrow before I click. I don't have this feeling with the +- glyph because it is larger. I feel like i have to concentrate more with the arrows.
• and contrary to the above arguments :) the arrows are cleaner.

[joaomoreno]

Adding screenshot for reference

They look much much better. I no longer feel the rush to disable this feature.

[weinand]

@bgashler1 yes, the icons look better now.

[aeschli]

@bgashler1 Looks good! But, the icons need to scale with bigger and smaller fonts. I created #3390

[Tyriar]

Looks good!

@bgashler1 any reason for the + background not being transparent like -?

[bgashler1]

@Tyriar, yes. This is to differentiate it further from non-collapsed icons. It also helps it stand out as a visual landmark and it matches how VS does it.