grid.scss

A very tiny simple grid framework for sass. (Work in progress) The included baseline mixin is based on a fabulous gist by Razvan Onofrei: https://gist.github.com/razwan/10662500 See also https://medium.com/@razvanonofrei/aligning-type-to-baseline-the-right-way-using-sass-e258fce47a9b

Install

$ bower install grid.scss

Setup

Import the grid framework:

@import "grid.scss/grid.scss";

Set the right cap height, depending on your font:

$base-cap-height: 0.53;

Usage

Example:

html {
  @include set-base-font-size(18px);
}
h1 {
  @include align-to-baseline(40px);
}
p {
  @include align-to-baseline();
}