// {loading}
//
// Display an animated loader.
//
// It use [loading animation](section-animations.html#kssref-animations-loading).
//
// Live demo with [loading element](section-elements.html#kssref-elements-loading)
//
// Advice: use it in a pseudo element (`:before` or `:after`)
//
// **Usage**
// ```stylus
// /* my_file.styl */
// .foo
//     {loading}
// ```
// will compile to
// ```css
// /* my_file.css */
// .foo::before {
//     content: '';
//     display: block;
//     position: absolute;
//     top: 50%;
//     left: 50%;
//     background: transparent;
//     width: 1.2em;
//     height: 1.2em;
//     margin: -2.6em 0 0 -.6em;
//     border-radius: 10em;
//     box-shadow: -2em 2em 0 0 currentColor, 0 2em 0 0 currentColor, 2em 2em 0 0 currentColor;
//     animation: loadingAnimate 1.4s infinite linear;
// }
// ```
//
// Styleguide: @blocks.Block.Loading
loading = @block
    &:before
        content ''
        display block
        position absolute
        top 50%
        left 50%
        background transparent
        width 1.2em
        height 1.2em
        margin -2.6em 0 0 -.6em
        border-radius 10em
        box-shadow -2em 2em 0 0 currentColor, 0 2em 0 0 currentColor, 2em 2em 0 0 currentColor
        animation loadingAnimation 1.4s infinite linear
