Spacing

The spacing module is a small collection of helper classes for spacings like margin and padding.

Dependencies

The spacing module depends on two other modules:

• settings.defaults
• tools.functions

If you install the spacing module using Bower or npm, you will get these dependencies at the same time. If not using Bower or npm, please be sure to install and @import these dependencies in the relevant way.

Installation

You can install spacing module via Bower, npm, Git Submodule, or copy and paste.

Install using Bower:

$ bower install tree-spacing --save

Once installed, @import into your project in its Trump layer:

@import "bower_components/tree-spacing/trump.spacing";

Install using npm:

$ npm install tree-spacing --save

Install as a Git Submodule:

$ git submodule add [email protected]:treeframework/trump.spacing.git

Once installed, @import into your project in its Trump layer:

@import "trump.spacing/trump.spacing";

Install via file download

The least recommended option for installation is to simply download _trump.spacing.scss into your project and @import it into your project in its Trump layer.

Usage

The classes take the following form: .u-[negative][type][direction][size]

Negative

-

Types

m — margin

p — padding

Direction

t — top

r — right

b — bottom

l — left

h — horizontal

v — vertical

Sizes

0 — none

-- — tiny

- — small

+ — large

++ — huge

Example

<blockquote>
    <p class="u-mb0">Margin bottom none</p>
</blockquote>

<header class="u-mb+">
    Margin bottom large
</header>

Credits

• inuitcss Powerful, Sass-based, OOCSS framework designed with scalability and performance in mind.