sass variables inside local directory codekit

#SASS VARIABLES INSIDE LOCAL DIRECTORY CODEKIT HOW TO#
#SASS VARIABLES INSIDE LOCAL DIRECTORY CODEKIT FOR MAC#

I’ll make the assumption that all of your files are contained within a main project folder. The one important side note about this whole process is that you must be working locally. Restart Sublime once more and you’re done with this step! Now type FTPSync and hit enter to install. Now that we have Package Control installed, open Sublime, use the keyboard shortcut CTRL + SHIFT + P to open the package control prompt and type install so that “Package Control: Install Package” is selected and hit enter. Once this is done installing, restart sublime to complete the installation. Paste the package control code and hit enter. Use the keyboard shortcut CTRL + ` to open Sublime’s internal command prompt. Copy the code from the Package Control website for your respective version of Sublime Text and then open Sublime. The easiest way to do this is to use Package Control to help install the plugin. Once ruby is installed, open up the command prompt and run the following two commands: gem update –system gem install compass Install FTPSync

If Ruby is not installed, click here to download a ruby installer. If ruby is installed it will return your current ruby version number. If you’re not familiar with it, this is the command prompt that we’ll be using throughout the rest of this example. To check if you have ruby installed, click Start > search “cmd” and open. Install Ruby and compassĬompass is our preprocessor that will compile your Sass into CSS and it requires ruby to be installed.

#SASS VARIABLES INSIDE LOCAL DIRECTORY CODEKIT FOR MAC#

Furthermore, the same steps can be taken for Mac users by substituting the Terminal for the command prompt and using “Command” based keyboard shortcuts. Side note: This article will talk primarily about SASS but the same procedure can be used for LESS.

#SASS VARIABLES INSIDE LOCAL DIRECTORY CODEKIT HOW TO#

There are a few programs that can preprocess SASS or LESS such as Prepros for windows and CodeKit for Mac.īut if you’re not quite ready to pay for a preprocessor and love using Sublime Text, in this article we’ll take a look at how to use the command line to get everything up and running fairly easily, and most importantly, for free. It allows the use of variables, mixing functions, and much more in order to take full advantage of CSS3 without worrying about vendor prefixes and trying to remember that HEX color you used 300 lines ago. For many developers looking to save time and ultimately take their coding to the next level, CSS preprocessing is a great step.

Sass variables inside local directory codekit