Sublime Forum

Sidebar icons in themes

#25

{ "class": "icon_file_type", "attributes": "plugin-induced-foo"], layer0.tint": [49, 52, 55] }
would make my week (eg with hg-modified)

0 Likes

#26

Could someone please post their .sublime-theme file they use in their *‘Packages/Theme - Default’ * folder? Maybe, someone could just package up their entire *‘Packages/Theme - Default’ * folder (including their respective .sublime-theme file), that would be great.

0 Likes

#27

Jon, another suggestion would be to allow sidebar icons to be specified by extension as well as scope. Scope is fine, but there are a number of file extensions that aren’t included by default in tmLanguage files. For this reason, plugins like ApplySyntax have popped up to analyze file extension and set the correct syntax for such files. It is a pain to have to update different tmLanguages to automatically get the correct syntax to open, so defining rules in one place with ApplySyntax, this becomes much less painful. But these file, (files whose syntax is set by an external plugin) don’t get the correct icon due to the post processing and setting of the file via an external plugin. Being able to just specify extensions would make this much easier.

For instance. I see you included a binary icon, but currently when a binary view loads, it loads hex data, but the syntax is plain text. Basically, it is impossible to detect binary files with the current system, which I am sure is why no files icons show up as binary. I am pretty sure you plan on using the binary list in the settings file to eventually target binary files, but it would be nice to have a similar functionality for all file type icons.

0 Likes

#28

I like the specified by extension idea!

I’ve modified the Soda Light theme to support sidebar icons, and also created some custom icons based on Fugue and the Espresso icons.

Normal size:

Retina size:

0 Likes

#29

Thank you for the Sublime Theme mod! However my folders are still ugly and I get the spinner until they get expanded:

Ideas?

Does this forum still doesn’t support email notifications?

0 Likes

#30

Sublime Text has a nice built in way to override theme features, which allows you to easily customise a theme locally but keep the benefit of upstream theme changes. This helps avoid the need to create and maintain a separate theme for tweaks.

For example, to use your own icons instead of the default:

  • Add a folder called “Theme - Default” (or “Theme - Soda” for customising Soda) to your Sublime Text “Packages/User” folder (eg. {sublime text app folder}/Packages/User/Theme - Soda)

  • Add an empty theme file, which is just a plain text file (eg. “Default.sublime-theme” / “Soda Light 3.sublime-theme”) to that folder

  • Drop your icons folder in there

When a theme loads, it overrides the base configuration with any additional assets and settings in this folder, so the cascading technique can be used for all aspects of a theme.

More info here: github.com/buymeasoda/soda-them … tomisation

Hope that helps.

0 Likes

#31

Thanks @buymeasoda!

I’ve changed it to be used as a child theme.
Instructions are in the latest commit comments.

0 Likes

#32

Thanks for the theme update @buymeasoda and the child theme @pryley !

Is it possible to only have the folder icon without the arrow ?

0 Likes

#33

How to show 3232 icons in sidebar? 1616 is too small to see clearly.

0 Likes

#34

I hope I’m not pestering everyone by asking one more time (in case my previous post was overlooked in this thread).

Is anyone using one of the the existing older customized sidebar themes based on:
gist.github.com/olivierlacan/1857652

There are several forks based on this. My customized sidebar is also based off those sidebar sub-themes as well.

I’m simply looking for a single updated example Dark.sublime-theme file I can use that also overrides filetype icons.

I downloaded “soda-theme-master.zip” from the link provided in the below post; but, it looks like it’s not set up like the downloadable sidebar theme packages mentioned above. Hopefully, someone who has something similar to what I have will share their dark sidebar-override.sublime-theme file (or whatever they call it).

[quote=“pryley”]I like the specified by extension idea!

I’ve modified the Soda Light theme to support sidebar icons, and also created some custom icons based on Fugue and the Espresso icons.

Normal size:

Retina size:

http://i.imgur.com/jYD1M53.png[/quote]

0 Likes

#35

[quote=“facelessuser”]Jon, another suggestion would be to allow sidebar icons to be specified by extension as well as scope. Scope is fine, but there are a number of file extensions that aren’t included by default in tmLanguage files. For this reason, plugins like ApplySyntax have popped up to analyze file extension and set the correct syntax for such files. It is a pain to have to update different tmLanguages to automatically get the correct syntax to open, so defining rules in one place with ApplySyntax, this becomes much less painful. But these file, (files whose syntax is set by an external plugin) don’t get the correct icon due to the post processing and setting of the file via an external plugin. Being able to just specify extensions would make this much easier.

For instance. I see you included a binary icon, but currently when a binary view loads, it loads hex data, but the syntax is plain text. Basically, it is impossible to detect binary files with the current system, which I am sure is why no files icons show up as binary. I am pretty sure you plan on using the binary list in the settings file to eventually target binary files, but it would be nice to have a similar functionality for all file type icons.[/quote]

I think so . BTW, a zip file is show up as binary which use the binary icon. Unexpectly, an exe file is not show up as binary.

0 Likes

#36

[quote=“buymeasoda”]I’m a bit stuck with leveraging the new file icon functionality for Soda Theme. Is it possible to allow themes to define the folder where icons are loaded from within the theme context?

With Soda Theme, the light and dark versions of the theme are together, and normally this is fine for assets because their paths are specified in the theme files and kept in separate sub-directories.
[/quote]

One option is to place a do nothing ‘Soda Dark 3.sublime-theme’ file (i.e., only content should be an empty array: “]”) within the ‘Soda Dark’ folder, so the Soda Dark folder is considered as a candidate for the icon lookup locations, enabling you to place the file_type_default.png and friends there.

1 Like

#37

I managed to theme the folders too, with:

// Sidebar folder closed { "class": "icon_folder", "layer0.texture": "User/Theme - Default/icons/folder.png", "layer0.opacity": 1.0, "content_margin": [8, 8] }, // Sidebar folder open { "class": "icon_folder", "parents": {"class": "tree_row", "attributes": "expanded"]}], "layer0.texture": "User/Theme - Default/icons/folder_open.png", }, ]

How can I target .erb files so I can add a icon too them ? I tried “source.rails”, “text.html.rails” but it’s not working.

0 Likes

#38

So I have installed a vanilla “Soda - Theme”
I took facelessuser icons (thanks again), and create a dummy folder “Packages/Soda - Theme/icons/” and dropped the icons there. It works, Great! :smile:

0 Likes

#39

If you want to add specif icons for specific filetypes you need to:

  1. add the respective file_type_%desired file type here%.png and file_type_%desired file type%@2x.png (for retina) it in /package/Theme - %current theme name here%/icons/ folder (if Theme - themename folder does not exist create it yourself)
  2. create a new “Icon (%new file type here%).tmPreference” file and put it in either /package/user/ or /package/Theme - %current theme name here%/ forlder.
  3. in the newly created “Icon (%new file type here%)” file insert the following:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
    <key>scope</key>
    <string>%right scope for file type here%</string>
    <key>settings</key>
    <dict>
        <key>icon</key>
        <string>file_type_%new file type here%</string>
    </dict>
</dict>
</plist>

For the scope of .erb fyles, it should be html.body.ruby, but you can find it both by:

  1. looking in the color scheme or language definition files to see which scopes are used for highlight
  2. add { "keys": "ctrl+alt+shift+o"], "command": "show_scope_name" } to you user’s keybindings, create a new .erb fyle and trigger the command to display current scope in the bottom statusbar

hope it helps

0 Likes

#40

[quote=“tito”]So I have installed a vanilla “Soda - Theme”
I took facelessuser icons (thanks again), and create a dummy folder “Packages/Soda - Theme/icons/” and dropped the icons there. It works, Great! :smile:[/quote]

No problem. The original post link is out dated, here is the updated link github.com/facelessuser/Aprosop … ster/icons for any one else who is desperate to replace the stock icons. They look much better now than they did at the time of the original post.

0 Likes

#41

[quote=“Orlmente”]

If you want to add specif icons for specific filetypes you need to:

  1. add the respective file_type_%desired file type here%.png and file_type_%desired file type%@2x.png (for retina) it in /package/Theme - %current theme name here%/icons/ folder (if Theme - themename folder does not exist create it yourself)
  2. create a new “Icon (%new file type here%).tmPreference” file and put it in either /package/user/ or /package/Theme - %current theme name here%/ forlder.
  3. in the newly created “Icon (%new file type here%)” file insert the following:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
    <key>scope</key>
    <string>%right scope for file type here%</string>
    <key>settings</key>
    <dict>
        <key>icon</key>
        <string>file_type_%new file type here%</string>
    </dict>
</dict>
</plist>

For the scope of .erb fyles, it should be html.body.ruby, but you can find it both by:

  1. looking in the color scheme or language definition files to see which scopes are used for highlight
  2. add { "keys": "ctrl+alt+shift+o"], "command": "show_scope_name" } to you user’s keybindings, create a new .erb fyle and trigger the command to display current scope in the bottom statusbar

hope it helps[/quote]

Thanks man, i added the scope too my ruby icon file string text.haml,source.rails,source.ruby,text.html.ruby

Worked like a boss!

0 Likes

#42

to apply the new side bar icons i found 2 easy ways to do so

1-go to (Packages folder) make a folder call (Theme - Default) “you can name that folder to anything as ST use the empty sublime-theme file as a reference not the folder that contains it” ,drop your icons folder in there ,then create an empty file with the name of your currently applied theme.

|Packages |Theme - Default |icons |???.sublime-theme
*now everytime you apply a new theme just change the (???) to the theme name.

2-drop the icons folder in your theme folder ,right next to your (???.sublime-theme) file and the icons will be applied automatically.

.in both ways i found that i don’t need to change or add any lines to the theme files.
.if you want to use the default icons that came with the latest rev ,do the same as the first step & delete or rename the icons folder to something else.

.for specific type of language (css , less ,etc…) use the instructions made by facelessuser in p.2 ,and put the (???).tmPreferences file right next to the icons folder.

0 Likes

#43

I’m using ST3 and can’t get this to work with the Default theme, or the Nexus theme. My user folder looks like this:

Packages/User
    |- Theme - Default
        |- icons (contains a py.png icon)
        |- py.tmPreferences (as described by facelessuser)
        |- Nexus.sublime-theme (blank)

Is this only workable for ST2 or am I missing something?

Edit: Ignore me, I see this is for dev builds!

0 Likes

#44

This is so cool, I had no idea that we could do this for our rails application. Thanks!

0 Likes