Using Codekit 2 with Susy and Breakpoint

Question

I like to use Codekit for a Compass-Poject with Susy and Breakpoint.

@import "compass";
@import "compass/reset";
@import "susy";
@import "breakpoint";

But there is an error message "File to import not found or unreadable: breakpoint."

Can i use Breakpoint with Codekit2?

Thanks!

Answer 1

Yes, however as Codekit 2 doesn't come bundled with Breakpoint like it does Susy and Compass, it's not as easy as @import "breakpoint";. What you will need to do is, using Codekit 2's Bower integration, download the breakpoint-sass bower package and change your import to @import "../bower_components/breakpoint-sass/stylesheets/breakpoint";.

Answer 2

Why not use @include susy-breakpoint(setting, layout);? It allows you to add settings once instead of using @include breakpoint(your setting); and then @include layout(your layout); on the next line.

Answer 3

I no longer see breakpoint-sass in the Codekit listing of bower packages. I will keep checking.

Answer 4

For those cannot find breakpoint-sass in the CodeKit listing of bower packages, you can do the following.

npm install -g bower
bower install at-import/breakpoint

And then

@import "../bower_components/compass-breakpoint/stylesheets/breakpoint"

inside your main .scss file.