8

Summary: I want 2 things:

  • (1) I want my folding symbols in VS Code to be [+][-] (similar to Visual Studio) instead of the default [>][v] one
  • (2) I want my Extensions section can have downloads and rating preview

Story: I randomly saw those features (1) on an answer on Stackoverflow and (2) in the site Extension Gallery of VSCode. I don't have enough reputation to comment below the Stackoverflow answer to ask him how to get those (1) [+][-] symbol features. I tried to put a question on Software Recommendation Stack Exchange but didn't get an answer.

The question I put on Softwarerecs site is more detailed with images so you guys can visit it to see the images and more detailed question.

First time I asked, thank you in advance.

Edit:
(1): It seems the [+][-] icons were replaced with [>][v] recently. I don't know if there's a workaround to get it back? I think this discussion will be a bit helpful to this problem.

(2) solved: Because I resized the sidebar window to too small so the downloads and rating part didn't show up. As I expand the sidebar bigger the downloads and rating shows up again.

Loi Nguyen Huynh
  • 8,492
  • 2
  • 29
  • 52
  • https://stackoverflow.com/q/43476212/ maybe this can help – Saharsh Sep 24 '19 at 05:07
  • Hmm can I ask what version of visual studio code you use? – Francis G Sep 24 '19 at 05:14
  • @Saharsh That question you posted says **It only shows them if you hover over the gutter**. My case it doesn't show the [+] and [-] icons at all. And what I want is to show the [+][-], not "to show the folding icon when not hovering" (because even when hovering they ([+][-]) don't show up anyway) – Loi Nguyen Huynh Sep 24 '19 at 05:21
  • 1
    @Francisaskquestion I type `code -v` and what I get is: `1.38.1 b37e54c98e1a74ba89e03073e5a3761284e3ffb0 x64`. Does it mean my version is 1.38.1? – Loi Nguyen Huynh Sep 24 '19 at 05:23
  • @HuỳnhLợiNguyễn I don't personally use VS code but (https://github.com/Microsoft/vscode/issues/2948#issuecomment-183540068) this github issue led me there. Although this issue was where your requirement was introduced and not actually put to use. – Saharsh Sep 24 '19 at 05:30
  • yes it is. Can you show a image of your extensions tab? It should have a downloads and rating in default – Francis G Sep 24 '19 at 05:32
  • @Francisaskquestion Oh shit. Yes It's defaulted. Because I resized the sidebar window to too small so the downloads and rating didn't show up. I'll mark (2) solved. – Loi Nguyen Huynh Sep 24 '19 at 05:37

3 Answers3

5

you can add custom folding controls icons with the help of this extension: Minimalist Product Icon Theme

its override the product icons that ship with VS Code, Activity bar icons, Status Bar, Code collapse/expand

tokochi
  • 308
  • 3
  • 7
3

In the first problem, I can confirm that in the latest version of VSCode the [+] and [-] was no longer used. And what I searched about basic editing of folding, changing the icons was not included. Also the thread you mentioned was back from 2016 and many changes was made to VSCode UI. So I think it is not possible to simple make the folding icon [+] and [-].

If you want to read more about the update logs of VSCode follow this link.

Francis G
  • 1,040
  • 1
  • 7
  • 21
  • 1
    Oh I can't believe that it used to be the [+][-] and be replaced with the confused [>][v] recently :(( There're [better proposed design](https://github.com/Microsoft/vscode/issues/2948#issuecomment-183540068), why did they just choose the [>][v] – Loi Nguyen Huynh Sep 24 '19 at 06:49
  • 1
    you can change the svg icons used, but you need to overwrite them at every VSC update. You can find the previous +/- icons at github. – rioV8 Sep 24 '19 at 11:35
  • @rioV8 about the svg icons you mentioned. Can you please tell me where did you find it? I'm having a problem locating the svg of the collapsed and expand for the code – Francis G Sep 25 '19 at 08:04
2

You will be able to change the code folding icons with via a theme in vscode v1.45. From https://github.com/microsoft/vscode-docs/blob/vnext/release-notes/v1_45.md#product-icon-themes

Product icon themes

Visual Studio Code contains a set of built-in icons that are used in views and the editor, but can also be used in hovers, the status bar, and by extensions. These icons are product icons as opposed to file icons, which are used next to file names throughout the UI.

The product icons that ship with VS Code are contained in the Codicon icon font and form the default product icon theme. Extensions can provide new product icon themes to redefine these icons and give VS Code a new appearance.

See the Product Icon Themes documentation for more details and there is a Product Color Theme Sample

I'm pretty sure someone will make a theme soon that includes the folding icons you prefer. The ones involved that should be changed:

.codicon-fold-down:before { content: "\eaf3" }
.codicon-fold-up:before { content: "\eaf4" }
.codicon-fold:before { content: "\eaf5" }
.codicon-folder-active:before { content: "\eaf6" }
.codicon-folder-opened:before { content: "\eaf7" }

Possibly using these:

content:"\ea5e";  // plus

content:"\ea33";  // minus

or similar.

Mark
  • 143,421
  • 24
  • 428
  • 436