Application layout component

Creates a customizable component that would render the main application layout in any of our internal apps.

Unless `$include-html-application-layout` is set to `false`, application classes are __automatically__ created.
There is a set of defaults to customize the component (usually you add those to `paint-settings.scss`).

To specify a custom set of blocks for the main layout, below are the defaults:
```scss
$layout-application-block: '.application' !default;
$layout-container-block: 'main' !default;
$layout-content-block: '.content' !default;
$layout-sidebar-block: '.sidebar' !default;
```

To specify a custom set of colours / properties for the sidebar:
```scss
$layout-sidebar-nav-width: rem-calc(260px) !default;
$layout-sidebar-nav-width-collapsed: $layout-sidebar-nav-width * 0.25 !default;
$layout-sidebar-nav-background-color: #191c1f !default;
$layout-sidebar-nav-text-color: #f2f2f2 !default;

$layout-sidebar-nav-title-background-color: lighten($layout-sidebar-nav-background-color, 5%) !default;
$layout-sidebar-nav-title-text-color: darken($layout-sidebar-nav-text-color, 50%) !default;
$layout-sidebar-nav-title-height: rem-calc(60px) !default;

$layout-sidebar-nav-link-height: rem-calc(80px) !default;
$layout-sidebar-nav-link-icon-padding: rem-calc(10px) !default;
$layout-sidebar-nav-link-icon-roundness: rem-calc(10px) !default;
$layout-sidebar-nav-link-text-color: darken($layout-sidebar-nav-text-color, 30%) !default;

$layout-sidebar-heading-height: rem-calc(80px) !default;
$layout-sidebar-footer-height: rem-calc(60px) !default;
```

To specify default sidebar icons:
```scss
$layout-sidebar-nav-classes: dashboard, paint, settings !default;
$layout-sidebar-nav-icons: dashboard, paint-brush, cog !default;
```

The structure of the default application is
```
<default_application_block>
  <sidebar_block>
  <main_block>
    <content>
```
The structure of the application sidebar is
```
  <sidebar_block>
    <sidebar_header>
    <nav>
    <sidebar_footer>
```

If for example you want __a header-less and footer-less sidebar_, you can set `$include-html-layout: false` and call:
```scss
    @include layout();
    @include layout-sidebar($include-header: false, $include-footer: false);
```

This component also provides a separate navigation icons generator that you could call like this:
```scss
$classes_list: first, second, third;
$icons_list: cog, newspaper, scissors;

.awesome-third-sidebar {
   @include navigation-icon-classes($classes_list, $icons_list);
}
```

And use it with a markup like this (_or bind whatever element you want with the classes_):
```
      <ul>
        <li class="first"><a href="#"><i></i><span>Menu item</span></a></li>
        <li class="second"><a href="#"><i></i><span>Menu item</span></a></li>
        <li class="third"><a href="#"><i></i><span>Menu item</span></a></li>
      </ul>

```

All of these settings are going to be featured in _Canvas_ too.
I agree, a bit confusing. I'll use `heading` for text-related elements and `header` for block related ones. (In this case it's going to be header).