search

file-icons / vscode

VSCode file specific icons for improved visual grepping
https://marketplace.visualstudio.com/items?itemName=file-icons.file-icons
MIT License
190 stars 24 forks source link

Enlarge icon size and improve alignment? #14

Open rfgamaral opened 7 years ago

rfgamaral commented 7 years ago

For me this is the best icon theme for VS Code but I find it distracting that the icons are tiny bit too small and don't feel properly aligned. Look at the following animation with a bunch of random icon themes for VS Code:

file-icon-themes

Most of them have the same size (slightly larger than this one) and are better aligned between the item arrow and the item label.

Could this be improved in a future version or it's like this by design?

DanBrooker commented 7 years ago

I agree with you, but the reason the icons aren't aligned is because it's an icon font which can have variable size icons, in atom we have control over the css and can use text alignment, vscode seems to just always align the icons to the top left, rather than the centre. The other themes must have a fixed canvas size for icons and they've centred them inside that.

@Alhadis would be able to speak to this better.

Changing all the icons likely be a lot of work, the only real solution would be to automate it somehow. Am open to suggestions.

Alhadis commented 7 years ago

@DanBrooker When you were bundling this package's icon-fonts, did you include the optimised versions I made (DevOpicons/MFixx), or the older, unmodified fonts? (Devicons/MFizz)

The latter pair are the ones that're buggy and uneven. They were replaced in v2.0.0 with the ones I optimised manually (which was needed because there're no tools I know or trust that can perform automated sizing and alignment of icons).

Which is why I plan to develop one sooner or later.

DanBrooker commented 7 years ago

@Alhadis pretty sure I just grabbed the ones you're bundling into the atom package.

Alhadis commented 7 years ago

Ah, you did too. No idea then... and I'm not sure what VSCode could be doing, because I purposefully stripped margins from every icon. The only metric that differs between icons is advance width. Which might be a factor: File-Icons uses CSS for aligning icons horizontally within a box-sized region (which is more efficient/flexible than simply baking it into the icon itself).

But if VSCode doesn't use CSS for icons, there's not much we can do.

FYI, I wrote a long, rambling explanation on the topic of icon-margins. Anybody who's in a position to be sending it to an icon-font author who's doing their craft wrong is eagerly encouraged to do so.