- #Compass codekit install#
- #Compass codekit Pc#
- #Compass codekit mac#
Assuming your file structure looks like this. Navigate to your assets folder and open the newly created file called config.rb.
Now comes the cool part…customizing your compass file to allow you to pull your framework files as well as your custom sass files. 
#Compass codekit install#
The default compass install adds files we won't need for our framework so you can now delete the folder called "stylesheets" and remove all the files in the newly-generated "sass" folder. Because we prefer to keep our assets (css/js/images/sass) all contained in one folder called "assets", this is a good location to create your new compass project. At the terminal command, navigate to the web root folder (ex: "public_html") and then create/setup your compass project. Create a Compass project in your web folder. Install your framework (Bootstrap 3 for this example). Open your command-line application (Terminal on a Mac) and navigate to your just-cloned folder on your local machine. Setup/clone the git repository for your new project to your local machine. 
The GRAYBOX Process (Compass/SASS/Bootstrap)
#Compass codekit Pc#
If you are on a PC or LINUX, the steps should be similar but the actual implementation may differ. Visit their website for instructions on setup.įor the instructions below, I'll be working with Apple OS X.
Compass ( ) - Compass requires a ruby environment. Bower ( ) - a package manager for the web. Here is our method for starting a new SASS/Compass project and one that we've found to work well for our team.įirst of all, before I start with our step-by-step setup, you'll need to make sure you have the following installed to follow my steps. (Note: CodeKit does offer Compass configuration but I've found it easier to setup via command-line as explained below.) Compass gives you one config file that, if setup correctly, will make it easy to collaborate on without breaking things. It's great for one user to customize the target/source files but problems arise when trying to share access amongst developers to make minor changes to a site's stylesheets.Įnter Compass ( ), our preferred method to configure our SASS compiling. In the case of CodeKit, the application (and many like it) create a unique configuration file that manages the compiler. Do they have a Mac? Do they want to invest in my preferred application for a rare update? In the case of CodeKit, it's a Mac-only application so when I'm working with a contractor, I have to make some assumptions that aren't always true. #Compass codekit mac#
The challenge comes when you work in a team via a git repo and not everyone has a Mac or PC and/or your favorite GUI app. The challenge with GUIs and working solo is that it works great when you are coding by yourself. I've worked with a few GUI's but my favorite (as referred to in my past blog post) is CodeKit which is far and away my go-to GUI compiler for all things SASS. Working solo is easy and there are many SASS compilers whether you prefer command line use or a GUI solution. Sass helps keep large stylesheets well-organized, and get small stylesheets up and running quickly, particularly with the help of the Compass style library.". It allows you to use variables, nested rules, mixins, inline imports, and more, all with a fully CSS-compatible syntax.
"Sass is an extension of CSS that adds power and elegance to the basic language. Here's the most succinct definition of what SASS is and this comes directly from the makers of this magical compiler. Yes, you read that right…there's an "Awesome" in the acronym and it's entirely appropriate. What is SASS?įirst of all, SASS stands for "Syntactically Awesome StyleSheets". This post will be diving into a setup of SASS for a team of developers so I'll do a quick overview on what SASS is before I get into the more advanced setup of the SASS solution for teams that we here at GRAYBOX are incorporating into our workflows. Easily my favorite and most valuable tool is SASS. As a front-end developer, there are many go-to applications and workflows that have become common in our digital tool chests.
0 kommentar(er)
