Installation
Breakpoint is a first-of-its-kind media query engine built to harness the power of Sass and Compass. Below are instructions for setting up Breakpoint
Breakpoint is a Compass extension, so you're going to need both Sass and Compass installed. If you do not already have them installed, please read Installing Sass and Compass Across All Platforms.
If you are using CodeKit, you are going to need to both follow the above linked instructions to install the actual Sass and Compass gems, as well as tell CodeKit to use those gems. To do so, open up CodeKit's preferences, go to Languages, and click on Compass. There will be an "Advanced Compiler Settings" section. Under that section, switch to "Use the Compass executable at this path:" option; a popup should open inside of /usr/bin. From there, look for compass and select that. You will now be able to use Compass extensions with CodeKit. Your CodeKit Compass settings should now look like this:
Once you have Sass and Compass installed, installing Breakpoint is easy, however it has to be done from the command line. If you're new to the terminal, here's a nice introduction. Simply open up your Terminal if you're on a Mac or Unix computer, or Command Prompt with Ruby if you're on a Windows computer, and type in the following:
gem install breakpoint
If you are on an Mac or Unix computer, you may need to append that command with sudo , and then type in your password to continue.
If you already have a project made and you'd like to use Breakpoint with it, add the following to your config.rb file:
require 'breakpoint'
Then, add the following to your Sass file towards the top:
@import "breakpoint";
If you are currently using Breakpoint 1.x, upgrading to Breakpoint 2.x is easy. Simply update your gem, and then before you start using Breakpoint, set $breakpoint-legacy-syntax: true;. In addition to this, we have removed the $media and $no-query options from the breakpoint mixin in favor of including them in the variables with the mixin instead. See the No Query section for more details.
If, for some reason, you'd like to stay on Breakpoint 1.x, you are going to need to install and configure Bundler. If you are going to be using Bundler, be sure to include all Compass Extensions and the versions you'd like to stay at in order to have them all available. Your Gemfile including Breakpoint could look something like the following:
gem 'breakpoint', '~>1.3'Once you've set up your Gemfile, run bundle install to install the Gem versions and lock in the dependencies. Then, to compile your Sass, instead of running compass watch, you'd run bundle exec compass watch, which will run Compass Watch using only the gems that are locked in.