Skip to content

Commit

Permalink
Fix description of how to use custom icons (Closes #984, 1004)
Browse files Browse the repository at this point in the history
  • Loading branch information
PKief committed Apr 26, 2021
1 parent 80c551b commit a06913f
Showing 1 changed file with 13 additions and 9 deletions.
22 changes: 13 additions & 9 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -89,13 +89,15 @@ If there's no leading `*` it will be automatically configured as filename and no

#### Custom SVG icons

It's possible to add custom icons by adding a path to an SVG file which is located relative to the extension's dist folder. For example a custom SVG file called "sample.svg" can be placed in an icons folder next to VS Code's extensions folder:
It's possible to add custom icons by adding a path to an SVG file which is located relative to the extension's dist folder. However, the restriction applies that the directory in which the custom icons are located must be within the `extensions` directory of the `.vscode` folder in the user directory.

For example a custom SVG file called `sample.svg` can be placed in an `icons` folder inside of VS Code's `extensions` folder:

```
.vscode
extensions
┗ icons
┗ sample.svg
extensions
┗ icons
┗ sample.svg
```

In the settings.json the icon can be associated to a file name or file extension like this:
Expand All @@ -121,14 +123,16 @@ The following configuration can customize the folder icons. It is also possible

#### Custom SVG folder icons

Similar to the files, it is also possible to reference your own SVG icons for folder icons. Here it's important to provide two SVG files: one for the folder if it's closed and another one for the opened state. These two files - let's call them "folder-sample.svg" and "folder-sample-open.svg" - have to be placed into a directory which is relative to the extensions dist folder. In our example we place them into an icons folder inside of the .vscode folder:
Similar to the files, it is also possible to reference your own SVG icons for folder icons. Here it's important to provide two SVG files: one for the folder if it's closed and another one for the opened state. These two files - let's call them "folder-sample.svg" and "folder-sample-open.svg" - have to be placed into a directory which is relative to the extensions dist folder. This directory has to be somewhere inside of the `.vscode/extensions` folder.

In our example we place them into an `icons` folder inside of the `.vscode/extensions` folder:

```
.vscode
extensions
┗ icons
┣ folder-sample.svg
┗ folder-sample-open.svg
extensions
┗ icons
┣ folder-sample.svg
┗ folder-sample-open.svg
```

In the settings.json the folder icons can be associated to a folder name (e.g. "src") like this:
Expand Down

0 comments on commit a06913f

Please sign in to comment.