[Middleman 3] Middleman で Susy2 と Breakpoint をつかう

gem install 後、設定なしで利用することができました。

% middleman version
Middleman 3.3.6

インストール

Gemfile に追記して、bundle install します。

Gemfile
# For Compass
gem 'susy', '~> 2.1.3'
gem 'breakpoint', '~> 2.5.0'

config.rb の設定は不要でした。

つかいかた

利用したい .scss ファイル内で、compass の後に @import します。

main.scss
@import "compass";
@import "compass/reset";
@import "susy";
@import "breakpoint";

このあたりで Susy2 まわりをさわったので、下記投稿のソースを流用して機能していることを簡単に確認しました。

Susy2 によるレスポンシブレイアウトと Breakpoint | deadwood