objects.box

          		# Box

The Box object simply boxes off content.

Install using npm:

    $ npm install --save-dev aleut.objects.box

Usage

Basic usage of the Box object uses the required classes:

<div class="o-box">
    Foo Bar Baz
</div>

Example of o-box

Options

Other, optional classes can supplement the required base classes:

.o-box--flush: remove all padding from boxes.
.o-box--[tiny|small|large|huge]: alter the padding on boxes.

For example:

<div class="o-box  o-box--large">
    Foo Bar Baz
</div>

Example of o-box options

Enable options

To enable the optional classes set the variables to true before you import the _objects.box.scss-file.

$o-box--flush:   false;
$o-box--tiny:    false;
$o-box--small:   false;
$o-box--large:   false;
$o-box--huge:    false;

Dependencies

aleutcss’ Box object depends on three other aleutcss modules: