Bourbon Neat Cheat Sheet by claysmith

fill­-pa­ren­t()

Forces the element to fill its parent container.

span­-co­lum­ns( $columns [of $conta­ine­r-c­olu­mns], [$display] )

Sets the width of an element to that of the number of columns it spans.

omega( [$pseu­do-­target $display] )

Removes block and table elements' gutter.

rese­t-d­isp­lay()

Resets the active display property to block.

rese­t-a­ll()

Resets both the active layout direction and the active display property.

shift( $columns )

Translates an element horizo­ntally positively or negati­vely.

$bor­der­-bo­x-s­izing

[Boolean] When true, it sets the box-sizing property of all elements to borde­r-box. Default: true

$def­aul­t-f­eat­ure

[String] Sets the default media feature that media() and new-b­rea­kpo­int() revert to when only a breakpoint value is passed. Default: min-width

$gri­ds-­col­umns

[Number (positive, unitless)] Sets the total number of columns in the grid. Default: 12

$max­-wi­dth

[Number (positive, unit)] Sets the max-width property of the element that includes outer­-co­nta­ine­r(). Default: em(1088)

new-­bre­akp­oint( $first­-fe­ature $first­-value [$seco­nd-­fea­ture, $secon­d-v­alue] [$tota­l-c­olumns] )

Returns a media context (media query / grid context) that can be stored in a variable and passed to media() as a single­-ke­yword argument. Media contexts defined using new-br­eak­point are used by the visual grid, as long as they are defined before importing Neat.

$vis­ual­-grid

[Boolean] When true, it displays the visual grid. Default: false

$vis­ual­-gr­id-­index

[String (back|­front)] Sets the z-index of the visual grid. Default: back