@import 'variables';

/*
  _   _               __  __
 | \ | | ____        |  \/  |
 |  \| | __ _  ___   | \  / | _____  _____ _ __
 | . ` |/ _` |/ _ \  | |\/| |/ _ \ \/ / _ \ '__|
 | |\  | (_| | (_) | | |  | |  __/>  <  __/ |
 |_| \_|\__,_|\___/  |_|  |_|\___/_/\_\___|_|

*/

// variavel colunas em %
@larguraColuna: (100%/@columns);

// mix colunas grid
.column(@totalColunas, @margin-left: @gutter-width, @margin-right: @margin-left, @float: left, @resume: false) {
    width: @larguraColuna*@totalColunas;

    .full-cont() when (@resume = false) {
        float: @float;

        .pad-l() when not(@margin-left = 0) {
            padding-left: @margin-left * 1px;
        }

        .pad-l();

        .pad-r() when not(@margin-right = 0) {
            padding-right: @margin-right* 1px;
        }

        .pad-r();
    }

    .full-cont();
}

// mix grid flex
.flex(@totalColunas, @shrink: false, @grow: false) {
    width: @larguraColuna*@totalColunas;
    flex-basis: @larguraColuna*@totalColunas;

    .grow() when not(@grow = false) {
        flex-grow: @grow;
    }

    .grow();

    .shrink() when not(@shrink = false) {
        flex-shrink: @shrink;
    }

    .shrink();
}

// mix espaço esquerda grid
.prefix(@totalColunas) {
    margin-left: @larguraColuna*@totalColunas;
}

// mix espaço direita grid
.sufix(@totalColunas) {
    margin-right: @larguraColuna*@totalColunas;
}