Make Admin Template Documentation

## Portlets

Portlets are like boxes with various options: colors, header, footer, various controls...

Portlets use default Bootstrap panel. For more information about it, please read documentation here:

Bootstrap Panel Documentation

## Basic Markup

You just have to wrap you content inside a `panel` and `panel-content` class

    <div class="panel">
        <div class="panel-content">
            <h1><strong>Simple</strong> Portlets</h1>
            <p>Example of panel with no header and footer.</p>
        </div>
    </div>

## Portlet with Header

Just add `panel-header` before `panel-content` like this:

    <div class="panel">
        <div class="panel-header">
            <h3>Portlet Header</h3>
        </div>
        <div class="panel-content">
            <p>This is an example of a basic header.</p>
        </div>
    </div>

## Portlet with Footer

As for panel-header, you have to add `panel-footer` after `panel-content` like this:

    <div class="panel">
        <div class="panel-content">
             <h1>Just footer, no header.</h1>
             <p>Portlet content.</p>
        </div>
        <div class="panel-footer">
            <h3>Portlet <strong>Footer</strong></h3>
        </div>
    </div>

## Portlet Controls

Portlets have 6 tools differents. You can add all, or just tools you want.

If you want all tools, you don't have to add each tool; Just add `panel-controls` to panel-header, they will be added automatically.

    <div class="panel">
        <div class="panel-header panel-controls">
            <h3>Portlet with controls</h3>
        </div>
        <div class="panel-content">
            <p>Panel content.</p>
        </div>
    </div>

You just want one or two tools? You can add them manually:

    <div class="control-btn">
        <a href="#" class="panel-toggle"><i class="fa fa-angle-down"></i></a>
        <a href="#" class="panel-close"><i class="icon-trash"></i></a>
    </div>