Sublime Text 3 - how do I make the sidebar black? - sublimetext

Question

I can't seem to turn the sidebar black in Sublime 3. I have downloaded a few themes but the sidebar always stays the standard grey. How do you do it?

Answer 1

Open the .sublime-theme file for the theme you are interested in changing. It's likely wrapped up in a .sublime-package zip file in Installed Packages, so first install PackageResourceViewer from Package Control, which is an indispensable tool to have if you want to do any kind of hacking on Sublime's packages, either built-in or installed via Package Control. Once the plugin has been installed, open the Command Palette and type prv to bring up the PackageResourceViewer options. Select Extract Package, then scroll down the list until you find the name of the theme you installed. If you're simply using the default theme, it's called Theme - Default (easy enough to remember). Finally, go to Preferences -> Browse Packages... to bring up your Packages folder in your operating system's file browser - its location will vary by OS and installation type. Open the folder of your newly-extracted theme, and start editing the appropriate .sublime-theme file in Sublime, using JSON syntax for highlighting, if you prefer.
Now that we've got the actual file open, search for "class": "sidebar_container" (or just sidebar_container, it should be unique), and take a look at it. This is the Default.sublime-theme one:
{
"class": "sidebar_container",
"layer0.tint": [80, 80, 80],
"layer0.opacity": 1.0,
"layer0.draw_center": false,
"layer0.inner_margin": [0, 0, 1, 0],
"content_margin": [0, 0, 1, 0]
},
while this is the one in the Soda - Dark theme (my personal favorite):
{
"class": "sidebar_container",
"layer0.texture": "Theme - Soda/Soda Dark/sidebar-bg.png",
"layer0.opacity": 1.0,
"layer0.inner_margin": [1, 1, 2, 1],
"content_margin": [0, 0, 1, 0]
},
The key lines we're looking for are "layer0.tint" in Default, and "layer0.texture" in Soda Dark. The Default theme sets the "tint" (or color) of layer0 (the very bottom layer, or background) at [80, 80, 80], which is a list of RGB color values in decimal, with possible values ranging from 0 to 255 (00 to FF in hex), and producing a dark-ish gray. On the other hand, Soda Dark uses "layer0.texture" and a .png file (you can find it and the Retina #2X version in the Soda Dark subdirectory of Theme - Soda) to set the background to a certain color, which happens to be just a bit lighter than [80, 80, 80].
OK, that's all very interesting, but how do I change the background of my sidebar to black? The answer is simple: look in the sidebar_container class, and see if layer0.tint or layer0.texture is being used (hopefully they're not in there together). The easiest way to change the color is to comment out any lines defining layer0.texture by adding // as the first two characters of the line, and either add (if it's not present) or change (if it is present) the layer0.tint line to the following:
"layer0.tint": [0, 0, 0],
then save the file. Now, Sublime is weird about changing themes (and sometimes color schemes). Sometimes I can make a change like this and as soon as I save the file (assuming the theme is already active in my user preferences), Sublime immediately updates all open windows, and I'm happy. Other times, it doesn't seem to do anything immediately, and I have to completely shut down Sublime and restart it to see anything. In either case, though, once you've made this simple change, the background of your sidebar should be nice and black.