| Current Path : /home/rtorresani/www/vendor/magento/theme-adminhtml-backend/web/css/source/ |
| Current File : //home/rtorresani/www/vendor/magento/theme-adminhtml-backend/web/css/source/_grid.less |
// /**
// * Copyright © Magento, Inc. All rights reserved.
// * See COPYING.txt for license details.
// */
//
// Default Grid
// _____________________________________________
//
// Variables
// _____________________________________________
// Number of columns in the grid
@grid-columns: 12;
@grid-gutter-width: 0;
// Form Fields Grid Sketch grid
@temp_gutter: 30px;
@temp_columns: 12;
//
// Row
// ---------------------------------------------
// Rows contain and clear the floats of your columns.
.row {
.make-row();
}
//
// Columns
// ---------------------------------------------
// Common styles for small and large grid columns
.make-grid-columns();
// Extra small grid
// Columns, offsets, pushes, and pulls for extra small devices like smartphones.
.make-grid(xs);
// Small grid
// Columns, offsets, pushes, and pulls for the small device range, from phones to tablets.
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.make-grid(m);
}
// Medium grid
// Columns, offsets, pushes, and pulls for the desktop device range.
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__l) {
.make-grid(l);
}
// Large grid
// Columns, offsets, pushes, and pulls for the large desktop device range.
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__xl) {
.make-grid(xl);
}
//
// Gutter
// ---------------------------------------------
.row-gutter {
margin-left: -(@content__indent / 2);
margin-right: -(@content__indent / 2);
> [class*='col-'] {
padding-left: @content__indent / 2;
padding-right: @content__indent / 2;
}
}
//
// Form Fields Grid Sketch
// _____________________________________________
#mix-grid() {
.row() {
.lib-clearer();
margin-left: ~'-@{temp_gutter}';
}
.return_length(@_columns-min, @_total: @temp_columns, @mathSymbol: '-') {
@_part: @_columns-min/@_total;
@_length: ~'calc( (100%) * @{_part} @{mathSymbol} @{temp_gutter} )';
}
.width(@_columns-min, @_total: @temp_columns) {
#mix-grid .return_length(@_columns-min, @_total);
width: @_length;
}
.column(@_columns-min, @_total: @temp_columns) {
#mix-grid .width(@_columns-min, @_total);
float: left;
margin-left: @temp_gutter;
}
}