deblan/gridstack.js
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

extra CSS

Browse source
This commit is contained in:
Pavel Reznikov 2015-06-19 22:02:42 -07:00
commit b5cdcb2496
6 changed files with 2095 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

22
README.md
View file

@ -49,6 +49,8 @@ Inspired by [gridster.js](http://gridster.net). Built with love.
- [Touch devices support](#touch-devices-support)
- [Use with knockout.js](#use-with-knockoutjs)
- [Change grid width](#change-grid-width)
- [Extra CSS](#extra-css)
- [Different grid widths](#different-grid-widths)
- [Save grid to array](#save-grid-to-array)
- [Load grid from array](#load-grid-from-array)
- [Override resizable/draggable options](#override-resizabledraggable-options)
@ -519,6 +521,25 @@ Here is a SASS code snipped which can make life easier (Thanks to @ascendantofra
}
```
Or you can include `gridstack-extra.css`. See below for more details.
## Extra CSS
There are few extra CSS batteries in `gridstack-extra.css` (`gridstack-extra.min.css`).
### Different grid widths
You can use other than 12 grid width:
```html
<div class="grid-stack grid-stack-N">...</div>
```
```javascript
$('.grid-stack').gridstack({width: N});
```
See example: [2 grids demo](http://troolee.github.io/gridstack.js/demo/two.html)
## Save grid to array
Because gridstack doesn't track any kind of user-defined widget id there is no reason to make serialization to be part
@ -646,6 +667,7 @@ Changes
#### v0.2.3 (development version)
- gridstack-extra.css
- add support of lodash.js
- add `is_area_empty` method
- nested grids

85
demo/two.html Normal file
View file

@ -0,0 +1,85 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Float grid demo</title>
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.2.0/css/font-awesome.min.css"/>
<link rel="stylesheet" href="../dist/gridstack.css"/>
<link rel="stylesheet" href="../dist/gridstack-extra.css"/>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.0/jquery-ui.js"></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/lodash.js/3.5.0/lodash.min.js"></script>
<script src="../dist/gridstack.js"></script>
<style type="text/css">
#grid1 {
background: lightgoldenrodyellow;
}
#grid2 {
background: lightcyan;
}
.grid-stack-item-content {
color: #2c3e50;
text-align: center;
background-color: #18bc9c;
}
</style>
</head>
<body>
<div class="container-fluid">
<h1>Two grids demo</h1>
<div class="row">
<div class="col-md-6">
<div class="grid-stack grid-stack-6" id="grid1">
</div>
</div>
<div class="col-md-6">
<div class="grid-stack grid-stack-6" id="grid2">
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function () {
var options = {
width: 6,
float: true
};
$('#grid1').gridstack(options);
$('#grid2').gridstack(options);
var items = [
{x: 0, y: 0, width: 2, height: 2},
{x: 3, y: 1, width: 1, height: 2},
{x: 4, y: 1, width: 1, height: 1},
{x: 2, y: 3, width: 3, height: 1},
{x: 2, y: 5, width: 1, height: 1}
];
$('.grid-stack').each(function () {
var grid = $(this).data('gridstack');
_.each(items, function (node) {
grid.add_widget($('<div><div class="grid-stack-item-content" /><div/>'),
node.x, node.y, node.width, node.height);
}, this);
});
});
</script>
</body>
</html>

983
dist/gridstack-extra.css vendored Normal file
View file

@ -0,0 +1,983 @@
.grid-stack.grid-stack-1 > .grid-stack-item {
min-width: 100%;
}
.grid-stack.grid-stack-1 > .grid-stack-item[data-gs-width='1'] {
width: 100%;
}
.grid-stack.grid-stack-1 > .grid-stack-item[data-gs-x='1'] {
left: 100%;
}
.grid-stack.grid-stack-1 > .grid-stack-item[data-gs-min-width='1'] {
min-width: 100%;
}
.grid-stack.grid-stack-1 > .grid-stack-item[data-gs-max-width='1'] {
max-width: 100%;
}
.grid-stack.grid-stack-2 > .grid-stack-item {
min-width: 50%;
}
.grid-stack.grid-stack-2 > .grid-stack-item[data-gs-width='1'] {
width: 50%;
}
.grid-stack.grid-stack-2 > .grid-stack-item[data-gs-x='1'] {
left: 50%;
}
.grid-stack.grid-stack-2 > .grid-stack-item[data-gs-min-width='1'] {
min-width: 50%;
}
.grid-stack.grid-stack-2 > .grid-stack-item[data-gs-max-width='1'] {
max-width: 50%;
}
.grid-stack.grid-stack-2 > .grid-stack-item[data-gs-width='2'] {
width: 100%;
}
.grid-stack.grid-stack-2 > .grid-stack-item[data-gs-x='2'] {
left: 100%;
}
.grid-stack.grid-stack-2 > .grid-stack-item[data-gs-min-width='2'] {
min-width: 100%;
}
.grid-stack.grid-stack-2 > .grid-stack-item[data-gs-max-width='2'] {
max-width: 100%;
}
.grid-stack.grid-stack-3 > .grid-stack-item {
min-width: 33.33333333%;
}
.grid-stack.grid-stack-3 > .grid-stack-item[data-gs-width='1'] {
width: 33.33333333%;
}
.grid-stack.grid-stack-3 > .grid-stack-item[data-gs-x='1'] {
left: 33.33333333%;
}
.grid-stack.grid-stack-3 > .grid-stack-item[data-gs-min-width='1'] {
min-width: 33.33333333%;
}
.grid-stack.grid-stack-3 > .grid-stack-item[data-gs-max-width='1'] {
max-width: 33.33333333%;
}
.grid-stack.grid-stack-3 > .grid-stack-item[data-gs-width='2'] {
width: 66.66666667%;
}
.grid-stack.grid-stack-3 > .grid-stack-item[data-gs-x='2'] {
left: 66.66666667%;
}
.grid-stack.grid-stack-3 > .grid-stack-item[data-gs-min-width='2'] {
min-width: 66.66666667%;
}
.grid-stack.grid-stack-3 > .grid-stack-item[data-gs-max-width='2'] {
max-width: 66.66666667%;
}
.grid-stack.grid-stack-3 > .grid-stack-item[data-gs-width='3'] {
width: 100%;
}
.grid-stack.grid-stack-3 > .grid-stack-item[data-gs-x='3'] {
left: 100%;
}
.grid-stack.grid-stack-3 > .grid-stack-item[data-gs-min-width='3'] {
min-width: 100%;
}
.grid-stack.grid-stack-3 > .grid-stack-item[data-gs-max-width='3'] {
max-width: 100%;
}
.grid-stack.grid-stack-4 > .grid-stack-item {
min-width: 25%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-width='1'] {
width: 25%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-x='1'] {
left: 25%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-min-width='1'] {
min-width: 25%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-max-width='1'] {
max-width: 25%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-width='2'] {
width: 50%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-x='2'] {
left: 50%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-min-width='2'] {
min-width: 50%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-max-width='2'] {
max-width: 50%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-width='3'] {
width: 75%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-x='3'] {
left: 75%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-min-width='3'] {
min-width: 75%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-max-width='3'] {
max-width: 75%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-width='4'] {
width: 100%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-x='4'] {
left: 100%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-min-width='4'] {
min-width: 100%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-max-width='4'] {
max-width: 100%;
}
.grid-stack.grid-stack-5 > .grid-stack-item {
min-width: 20%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-width='1'] {
width: 20%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-x='1'] {
left: 20%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-min-width='1'] {
min-width: 20%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-max-width='1'] {
max-width: 20%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-width='2'] {
width: 40%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-x='2'] {
left: 40%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-min-width='2'] {
min-width: 40%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-max-width='2'] {
max-width: 40%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-width='3'] {
width: 60%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-x='3'] {
left: 60%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-min-width='3'] {
min-width: 60%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-max-width='3'] {
max-width: 60%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-width='4'] {
width: 80%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-x='4'] {
left: 80%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-min-width='4'] {
min-width: 80%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-max-width='4'] {
max-width: 80%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-width='5'] {
width: 100%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-x='5'] {
left: 100%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-min-width='5'] {
min-width: 100%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-max-width='5'] {
max-width: 100%;
}
.grid-stack.grid-stack-6 > .grid-stack-item {
min-width: 16.66666667%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-width='1'] {
width: 16.66666667%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-x='1'] {
left: 16.66666667%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-min-width='1'] {
min-width: 16.66666667%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-max-width='1'] {
max-width: 16.66666667%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-width='2'] {
width: 33.33333333%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-x='2'] {
left: 33.33333333%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-min-width='2'] {
min-width: 33.33333333%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-max-width='2'] {
max-width: 33.33333333%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-width='3'] {
width: 50%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-x='3'] {
left: 50%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-min-width='3'] {
min-width: 50%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-max-width='3'] {
max-width: 50%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-width='4'] {
width: 66.66666667%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-x='4'] {
left: 66.66666667%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-min-width='4'] {
min-width: 66.66666667%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-max-width='4'] {
max-width: 66.66666667%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-width='5'] {
width: 83.33333333%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-x='5'] {
left: 83.33333333%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-min-width='5'] {
min-width: 83.33333333%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-max-width='5'] {
max-width: 83.33333333%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-width='6'] {
width: 100%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-x='6'] {
left: 100%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-min-width='6'] {
min-width: 100%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-max-width='6'] {
max-width: 100%;
}
.grid-stack.grid-stack-7 > .grid-stack-item {
min-width: 14.28571429%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-width='1'] {
width: 14.28571429%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-x='1'] {
left: 14.28571429%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-min-width='1'] {
min-width: 14.28571429%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-max-width='1'] {
max-width: 14.28571429%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-width='2'] {
width: 28.57142857%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-x='2'] {
left: 28.57142857%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-min-width='2'] {
min-width: 28.57142857%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-max-width='2'] {
max-width: 28.57142857%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-width='3'] {
width: 42.85714286%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-x='3'] {
left: 42.85714286%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-min-width='3'] {
min-width: 42.85714286%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-max-width='3'] {
max-width: 42.85714286%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-width='4'] {
width: 57.14285714%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-x='4'] {
left: 57.14285714%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-min-width='4'] {
min-width: 57.14285714%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-max-width='4'] {
max-width: 57.14285714%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-width='5'] {
width: 71.42857143%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-x='5'] {
left: 71.42857143%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-min-width='5'] {
min-width: 71.42857143%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-max-width='5'] {
max-width: 71.42857143%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-width='6'] {
width: 85.71428571%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-x='6'] {
left: 85.71428571%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-min-width='6'] {
min-width: 85.71428571%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-max-width='6'] {
max-width: 85.71428571%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-width='7'] {
width: 100%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-x='7'] {
left: 100%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-min-width='7'] {
min-width: 100%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-max-width='7'] {
max-width: 100%;
}
.grid-stack.grid-stack-8 > .grid-stack-item {
min-width: 12.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-width='1'] {
width: 12.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-x='1'] {
left: 12.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-min-width='1'] {
min-width: 12.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-max-width='1'] {
max-width: 12.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-width='2'] {
width: 25%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-x='2'] {
left: 25%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-min-width='2'] {
min-width: 25%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-max-width='2'] {
max-width: 25%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-width='3'] {
width: 37.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-x='3'] {
left: 37.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-min-width='3'] {
min-width: 37.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-max-width='3'] {
max-width: 37.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-width='4'] {
width: 50%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-x='4'] {
left: 50%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-min-width='4'] {
min-width: 50%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-max-width='4'] {
max-width: 50%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-width='5'] {
width: 62.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-x='5'] {
left: 62.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-min-width='5'] {
min-width: 62.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-max-width='5'] {
max-width: 62.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-width='6'] {
width: 75%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-x='6'] {
left: 75%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-min-width='6'] {
min-width: 75%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-max-width='6'] {
max-width: 75%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-width='7'] {
width: 87.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-x='7'] {
left: 87.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-min-width='7'] {
min-width: 87.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-max-width='7'] {
max-width: 87.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-width='8'] {
width: 100%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-x='8'] {
left: 100%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-min-width='8'] {
min-width: 100%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-max-width='8'] {
max-width: 100%;
}
.grid-stack.grid-stack-9 > .grid-stack-item {
min-width: 11.11111111%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-width='1'] {
width: 11.11111111%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-x='1'] {
left: 11.11111111%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-min-width='1'] {
min-width: 11.11111111%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-max-width='1'] {
max-width: 11.11111111%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-width='2'] {
width: 22.22222222%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-x='2'] {
left: 22.22222222%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-min-width='2'] {
min-width: 22.22222222%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-max-width='2'] {
max-width: 22.22222222%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-width='3'] {
width: 33.33333333%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-x='3'] {
left: 33.33333333%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-min-width='3'] {
min-width: 33.33333333%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-max-width='3'] {
max-width: 33.33333333%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-width='4'] {
width: 44.44444444%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-x='4'] {
left: 44.44444444%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-min-width='4'] {
min-width: 44.44444444%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-max-width='4'] {
max-width: 44.44444444%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-width='5'] {
width: 55.55555556%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-x='5'] {
left: 55.55555556%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-min-width='5'] {
min-width: 55.55555556%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-max-width='5'] {
max-width: 55.55555556%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-width='6'] {
width: 66.66666667%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-x='6'] {
left: 66.66666667%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-min-width='6'] {
min-width: 66.66666667%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-max-width='6'] {
max-width: 66.66666667%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-width='7'] {
width: 77.77777778%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-x='7'] {
left: 77.77777778%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-min-width='7'] {
min-width: 77.77777778%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-max-width='7'] {
max-width: 77.77777778%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-width='8'] {
width: 88.88888889%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-x='8'] {
left: 88.88888889%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-min-width='8'] {
min-width: 88.88888889%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-max-width='8'] {
max-width: 88.88888889%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-width='9'] {
width: 100%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-x='9'] {
left: 100%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-min-width='9'] {
min-width: 100%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-max-width='9'] {
max-width: 100%;
}
.grid-stack.grid-stack-10 > .grid-stack-item {
min-width: 10%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-width='1'] {
width: 10%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-x='1'] {
left: 10%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-min-width='1'] {
min-width: 10%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-max-width='1'] {
max-width: 10%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-width='2'] {
width: 20%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-x='2'] {
left: 20%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-min-width='2'] {
min-width: 20%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-max-width='2'] {
max-width: 20%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-width='3'] {
width: 30%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-x='3'] {
left: 30%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-min-width='3'] {
min-width: 30%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-max-width='3'] {
max-width: 30%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-width='4'] {
width: 40%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-x='4'] {
left: 40%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-min-width='4'] {
min-width: 40%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-max-width='4'] {
max-width: 40%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-width='5'] {
width: 50%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-x='5'] {
left: 50%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-min-width='5'] {
min-width: 50%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-max-width='5'] {
max-width: 50%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-width='6'] {
width: 60%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-x='6'] {
left: 60%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-min-width='6'] {
min-width: 60%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-max-width='6'] {
max-width: 60%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-width='7'] {
width: 70%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-x='7'] {
left: 70%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-min-width='7'] {
min-width: 70%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-max-width='7'] {
max-width: 70%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-width='8'] {
width: 80%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-x='8'] {
left: 80%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-min-width='8'] {
min-width: 80%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-max-width='8'] {
max-width: 80%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-width='9'] {
width: 90%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-x='9'] {
left: 90%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-min-width='9'] {
min-width: 90%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-max-width='9'] {
max-width: 90%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-width='10'] {
width: 100%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-x='10'] {
left: 100%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-min-width='10'] {
min-width: 100%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-max-width='10'] {
max-width: 100%;
}
.grid-stack.grid-stack-11 > .grid-stack-item {
min-width: 9.09090909%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-width='1'] {
width: 9.09090909%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-x='1'] {
left: 9.09090909%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-min-width='1'] {
min-width: 9.09090909%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-max-width='1'] {
max-width: 9.09090909%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-width='2'] {
width: 18.18181818%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-x='2'] {
left: 18.18181818%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-min-width='2'] {
min-width: 18.18181818%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-max-width='2'] {
max-width: 18.18181818%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-width='3'] {
width: 27.27272727%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-x='3'] {
left: 27.27272727%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-min-width='3'] {
min-width: 27.27272727%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-max-width='3'] {
max-width: 27.27272727%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-width='4'] {
width: 36.36363636%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-x='4'] {
left: 36.36363636%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-min-width='4'] {
min-width: 36.36363636%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-max-width='4'] {
max-width: 36.36363636%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-width='5'] {
width: 45.45454545%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-x='5'] {
left: 45.45454545%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-min-width='5'] {
min-width: 45.45454545%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-max-width='5'] {
max-width: 45.45454545%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-width='6'] {
width: 54.54545455%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-x='6'] {
left: 54.54545455%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-min-width='6'] {
min-width: 54.54545455%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-max-width='6'] {
max-width: 54.54545455%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-width='7'] {
width: 63.63636364%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-x='7'] {
left: 63.63636364%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-min-width='7'] {
min-width: 63.63636364%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-max-width='7'] {
max-width: 63.63636364%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-width='8'] {
width: 72.72727273%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-x='8'] {
left: 72.72727273%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-min-width='8'] {
min-width: 72.72727273%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-max-width='8'] {
max-width: 72.72727273%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-width='9'] {
width: 81.81818182%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-x='9'] {
left: 81.81818182%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-min-width='9'] {
min-width: 81.81818182%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-max-width='9'] {
max-width: 81.81818182%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-width='10'] {
width: 90.90909091%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-x='10'] {
left: 90.90909091%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-min-width='10'] {
min-width: 90.90909091%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-max-width='10'] {
max-width: 90.90909091%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-width='11'] {
width: 100.0%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-x='11'] {
left: 100.0%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-min-width='11'] {
min-width: 100.0%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-max-width='11'] {
max-width: 100.0%;
}
.grid-stack.grid-stack-12 > .grid-stack-item {
min-width: 8.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-width='1'] {
width: 8.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-x='1'] {
left: 8.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-min-width='1'] {
min-width: 8.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-max-width='1'] {
max-width: 8.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-width='2'] {
width: 16.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-x='2'] {
left: 16.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-min-width='2'] {
min-width: 16.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-max-width='2'] {
max-width: 16.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-width='3'] {
width: 25%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-x='3'] {
left: 25%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-min-width='3'] {
min-width: 25%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-max-width='3'] {
max-width: 25%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-width='4'] {
width: 33.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-x='4'] {
left: 33.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-min-width='4'] {
min-width: 33.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-max-width='4'] {
max-width: 33.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-width='5'] {
width: 41.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-x='5'] {
left: 41.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-min-width='5'] {
min-width: 41.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-max-width='5'] {
max-width: 41.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-width='6'] {
width: 50%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-x='6'] {
left: 50%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-min-width='6'] {
min-width: 50%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-max-width='6'] {
max-width: 50%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-width='7'] {
width: 58.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-x='7'] {
left: 58.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-min-width='7'] {
min-width: 58.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-max-width='7'] {
max-width: 58.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-width='8'] {
width: 66.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-x='8'] {
left: 66.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-min-width='8'] {
min-width: 66.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-max-width='8'] {
max-width: 66.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-width='9'] {
width: 75%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-x='9'] {
left: 75%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-min-width='9'] {
min-width: 75%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-max-width='9'] {
max-width: 75%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-width='10'] {
width: 83.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-x='10'] {
left: 83.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-min-width='10'] {
min-width: 83.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-max-width='10'] {
max-width: 83.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-width='11'] {
width: 91.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-x='11'] {
left: 91.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-min-width='11'] {
min-width: 91.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-max-width='11'] {
max-width: 91.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-width='12'] {
width: 100%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-x='12'] {
left: 100%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-min-width='12'] {
min-width: 100%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-max-width='12'] {
max-width: 100%;
}

1
dist/gridstack-extra.min.css vendored Normal file
View file

File diff suppressed because one or more lines are too long

983
src/gridstack-extra.css Normal file
View file

@ -0,0 +1,983 @@
.grid-stack.grid-stack-1 > .grid-stack-item {
min-width: 100%;
}
.grid-stack.grid-stack-1 > .grid-stack-item[data-gs-width='1'] {
width: 100%;
}
.grid-stack.grid-stack-1 > .grid-stack-item[data-gs-x='1'] {
left: 100%;
}
.grid-stack.grid-stack-1 > .grid-stack-item[data-gs-min-width='1'] {
min-width: 100%;
}
.grid-stack.grid-stack-1 > .grid-stack-item[data-gs-max-width='1'] {
max-width: 100%;
}
.grid-stack.grid-stack-2 > .grid-stack-item {
min-width: 50%;
}
.grid-stack.grid-stack-2 > .grid-stack-item[data-gs-width='1'] {
width: 50%;
}
.grid-stack.grid-stack-2 > .grid-stack-item[data-gs-x='1'] {
left: 50%;
}
.grid-stack.grid-stack-2 > .grid-stack-item[data-gs-min-width='1'] {
min-width: 50%;
}
.grid-stack.grid-stack-2 > .grid-stack-item[data-gs-max-width='1'] {
max-width: 50%;
}
.grid-stack.grid-stack-2 > .grid-stack-item[data-gs-width='2'] {
width: 100%;
}
.grid-stack.grid-stack-2 > .grid-stack-item[data-gs-x='2'] {
left: 100%;
}
.grid-stack.grid-stack-2 > .grid-stack-item[data-gs-min-width='2'] {
min-width: 100%;
}
.grid-stack.grid-stack-2 > .grid-stack-item[data-gs-max-width='2'] {
max-width: 100%;
}
.grid-stack.grid-stack-3 > .grid-stack-item {
min-width: 33.33333333%;
}
.grid-stack.grid-stack-3 > .grid-stack-item[data-gs-width='1'] {
width: 33.33333333%;
}
.grid-stack.grid-stack-3 > .grid-stack-item[data-gs-x='1'] {
left: 33.33333333%;
}
.grid-stack.grid-stack-3 > .grid-stack-item[data-gs-min-width='1'] {
min-width: 33.33333333%;
}
.grid-stack.grid-stack-3 > .grid-stack-item[data-gs-max-width='1'] {
max-width: 33.33333333%;
}
.grid-stack.grid-stack-3 > .grid-stack-item[data-gs-width='2'] {
width: 66.66666667%;
}
.grid-stack.grid-stack-3 > .grid-stack-item[data-gs-x='2'] {
left: 66.66666667%;
}
.grid-stack.grid-stack-3 > .grid-stack-item[data-gs-min-width='2'] {
min-width: 66.66666667%;
}
.grid-stack.grid-stack-3 > .grid-stack-item[data-gs-max-width='2'] {
max-width: 66.66666667%;
}
.grid-stack.grid-stack-3 > .grid-stack-item[data-gs-width='3'] {
width: 100%;
}
.grid-stack.grid-stack-3 > .grid-stack-item[data-gs-x='3'] {
left: 100%;
}
.grid-stack.grid-stack-3 > .grid-stack-item[data-gs-min-width='3'] {
min-width: 100%;
}
.grid-stack.grid-stack-3 > .grid-stack-item[data-gs-max-width='3'] {
max-width: 100%;
}
.grid-stack.grid-stack-4 > .grid-stack-item {
min-width: 25%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-width='1'] {
width: 25%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-x='1'] {
left: 25%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-min-width='1'] {
min-width: 25%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-max-width='1'] {
max-width: 25%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-width='2'] {
width: 50%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-x='2'] {
left: 50%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-min-width='2'] {
min-width: 50%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-max-width='2'] {
max-width: 50%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-width='3'] {
width: 75%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-x='3'] {
left: 75%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-min-width='3'] {
min-width: 75%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-max-width='3'] {
max-width: 75%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-width='4'] {
width: 100%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-x='4'] {
left: 100%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-min-width='4'] {
min-width: 100%;
}
.grid-stack.grid-stack-4 > .grid-stack-item[data-gs-max-width='4'] {
max-width: 100%;
}
.grid-stack.grid-stack-5 > .grid-stack-item {
min-width: 20%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-width='1'] {
width: 20%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-x='1'] {
left: 20%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-min-width='1'] {
min-width: 20%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-max-width='1'] {
max-width: 20%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-width='2'] {
width: 40%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-x='2'] {
left: 40%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-min-width='2'] {
min-width: 40%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-max-width='2'] {
max-width: 40%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-width='3'] {
width: 60%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-x='3'] {
left: 60%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-min-width='3'] {
min-width: 60%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-max-width='3'] {
max-width: 60%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-width='4'] {
width: 80%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-x='4'] {
left: 80%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-min-width='4'] {
min-width: 80%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-max-width='4'] {
max-width: 80%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-width='5'] {
width: 100%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-x='5'] {
left: 100%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-min-width='5'] {
min-width: 100%;
}
.grid-stack.grid-stack-5 > .grid-stack-item[data-gs-max-width='5'] {
max-width: 100%;
}
.grid-stack.grid-stack-6 > .grid-stack-item {
min-width: 16.66666667%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-width='1'] {
width: 16.66666667%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-x='1'] {
left: 16.66666667%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-min-width='1'] {
min-width: 16.66666667%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-max-width='1'] {
max-width: 16.66666667%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-width='2'] {
width: 33.33333333%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-x='2'] {
left: 33.33333333%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-min-width='2'] {
min-width: 33.33333333%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-max-width='2'] {
max-width: 33.33333333%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-width='3'] {
width: 50%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-x='3'] {
left: 50%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-min-width='3'] {
min-width: 50%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-max-width='3'] {
max-width: 50%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-width='4'] {
width: 66.66666667%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-x='4'] {
left: 66.66666667%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-min-width='4'] {
min-width: 66.66666667%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-max-width='4'] {
max-width: 66.66666667%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-width='5'] {
width: 83.33333333%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-x='5'] {
left: 83.33333333%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-min-width='5'] {
min-width: 83.33333333%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-max-width='5'] {
max-width: 83.33333333%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-width='6'] {
width: 100%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-x='6'] {
left: 100%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-min-width='6'] {
min-width: 100%;
}
.grid-stack.grid-stack-6 > .grid-stack-item[data-gs-max-width='6'] {
max-width: 100%;
}
.grid-stack.grid-stack-7 > .grid-stack-item {
min-width: 14.28571429%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-width='1'] {
width: 14.28571429%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-x='1'] {
left: 14.28571429%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-min-width='1'] {
min-width: 14.28571429%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-max-width='1'] {
max-width: 14.28571429%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-width='2'] {
width: 28.57142857%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-x='2'] {
left: 28.57142857%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-min-width='2'] {
min-width: 28.57142857%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-max-width='2'] {
max-width: 28.57142857%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-width='3'] {
width: 42.85714286%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-x='3'] {
left: 42.85714286%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-min-width='3'] {
min-width: 42.85714286%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-max-width='3'] {
max-width: 42.85714286%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-width='4'] {
width: 57.14285714%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-x='4'] {
left: 57.14285714%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-min-width='4'] {
min-width: 57.14285714%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-max-width='4'] {
max-width: 57.14285714%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-width='5'] {
width: 71.42857143%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-x='5'] {
left: 71.42857143%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-min-width='5'] {
min-width: 71.42857143%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-max-width='5'] {
max-width: 71.42857143%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-width='6'] {
width: 85.71428571%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-x='6'] {
left: 85.71428571%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-min-width='6'] {
min-width: 85.71428571%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-max-width='6'] {
max-width: 85.71428571%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-width='7'] {
width: 100%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-x='7'] {
left: 100%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-min-width='7'] {
min-width: 100%;
}
.grid-stack.grid-stack-7 > .grid-stack-item[data-gs-max-width='7'] {
max-width: 100%;
}
.grid-stack.grid-stack-8 > .grid-stack-item {
min-width: 12.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-width='1'] {
width: 12.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-x='1'] {
left: 12.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-min-width='1'] {
min-width: 12.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-max-width='1'] {
max-width: 12.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-width='2'] {
width: 25%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-x='2'] {
left: 25%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-min-width='2'] {
min-width: 25%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-max-width='2'] {
max-width: 25%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-width='3'] {
width: 37.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-x='3'] {
left: 37.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-min-width='3'] {
min-width: 37.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-max-width='3'] {
max-width: 37.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-width='4'] {
width: 50%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-x='4'] {
left: 50%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-min-width='4'] {
min-width: 50%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-max-width='4'] {
max-width: 50%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-width='5'] {
width: 62.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-x='5'] {
left: 62.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-min-width='5'] {
min-width: 62.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-max-width='5'] {
max-width: 62.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-width='6'] {
width: 75%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-x='6'] {
left: 75%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-min-width='6'] {
min-width: 75%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-max-width='6'] {
max-width: 75%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-width='7'] {
width: 87.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-x='7'] {
left: 87.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-min-width='7'] {
min-width: 87.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-max-width='7'] {
max-width: 87.5%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-width='8'] {
width: 100%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-x='8'] {
left: 100%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-min-width='8'] {
min-width: 100%;
}
.grid-stack.grid-stack-8 > .grid-stack-item[data-gs-max-width='8'] {
max-width: 100%;
}
.grid-stack.grid-stack-9 > .grid-stack-item {
min-width: 11.11111111%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-width='1'] {
width: 11.11111111%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-x='1'] {
left: 11.11111111%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-min-width='1'] {
min-width: 11.11111111%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-max-width='1'] {
max-width: 11.11111111%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-width='2'] {
width: 22.22222222%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-x='2'] {
left: 22.22222222%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-min-width='2'] {
min-width: 22.22222222%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-max-width='2'] {
max-width: 22.22222222%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-width='3'] {
width: 33.33333333%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-x='3'] {
left: 33.33333333%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-min-width='3'] {
min-width: 33.33333333%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-max-width='3'] {
max-width: 33.33333333%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-width='4'] {
width: 44.44444444%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-x='4'] {
left: 44.44444444%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-min-width='4'] {
min-width: 44.44444444%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-max-width='4'] {
max-width: 44.44444444%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-width='5'] {
width: 55.55555556%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-x='5'] {
left: 55.55555556%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-min-width='5'] {
min-width: 55.55555556%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-max-width='5'] {
max-width: 55.55555556%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-width='6'] {
width: 66.66666667%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-x='6'] {
left: 66.66666667%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-min-width='6'] {
min-width: 66.66666667%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-max-width='6'] {
max-width: 66.66666667%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-width='7'] {
width: 77.77777778%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-x='7'] {
left: 77.77777778%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-min-width='7'] {
min-width: 77.77777778%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-max-width='7'] {
max-width: 77.77777778%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-width='8'] {
width: 88.88888889%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-x='8'] {
left: 88.88888889%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-min-width='8'] {
min-width: 88.88888889%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-max-width='8'] {
max-width: 88.88888889%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-width='9'] {
width: 100%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-x='9'] {
left: 100%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-min-width='9'] {
min-width: 100%;
}
.grid-stack.grid-stack-9 > .grid-stack-item[data-gs-max-width='9'] {
max-width: 100%;
}
.grid-stack.grid-stack-10 > .grid-stack-item {
min-width: 10%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-width='1'] {
width: 10%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-x='1'] {
left: 10%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-min-width='1'] {
min-width: 10%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-max-width='1'] {
max-width: 10%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-width='2'] {
width: 20%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-x='2'] {
left: 20%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-min-width='2'] {
min-width: 20%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-max-width='2'] {
max-width: 20%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-width='3'] {
width: 30%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-x='3'] {
left: 30%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-min-width='3'] {
min-width: 30%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-max-width='3'] {
max-width: 30%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-width='4'] {
width: 40%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-x='4'] {
left: 40%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-min-width='4'] {
min-width: 40%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-max-width='4'] {
max-width: 40%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-width='5'] {
width: 50%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-x='5'] {
left: 50%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-min-width='5'] {
min-width: 50%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-max-width='5'] {
max-width: 50%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-width='6'] {
width: 60%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-x='6'] {
left: 60%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-min-width='6'] {
min-width: 60%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-max-width='6'] {
max-width: 60%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-width='7'] {
width: 70%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-x='7'] {
left: 70%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-min-width='7'] {
min-width: 70%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-max-width='7'] {
max-width: 70%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-width='8'] {
width: 80%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-x='8'] {
left: 80%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-min-width='8'] {
min-width: 80%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-max-width='8'] {
max-width: 80%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-width='9'] {
width: 90%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-x='9'] {
left: 90%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-min-width='9'] {
min-width: 90%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-max-width='9'] {
max-width: 90%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-width='10'] {
width: 100%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-x='10'] {
left: 100%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-min-width='10'] {
min-width: 100%;
}
.grid-stack.grid-stack-10 > .grid-stack-item[data-gs-max-width='10'] {
max-width: 100%;
}
.grid-stack.grid-stack-11 > .grid-stack-item {
min-width: 9.09090909%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-width='1'] {
width: 9.09090909%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-x='1'] {
left: 9.09090909%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-min-width='1'] {
min-width: 9.09090909%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-max-width='1'] {
max-width: 9.09090909%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-width='2'] {
width: 18.18181818%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-x='2'] {
left: 18.18181818%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-min-width='2'] {
min-width: 18.18181818%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-max-width='2'] {
max-width: 18.18181818%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-width='3'] {
width: 27.27272727%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-x='3'] {
left: 27.27272727%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-min-width='3'] {
min-width: 27.27272727%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-max-width='3'] {
max-width: 27.27272727%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-width='4'] {
width: 36.36363636%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-x='4'] {
left: 36.36363636%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-min-width='4'] {
min-width: 36.36363636%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-max-width='4'] {
max-width: 36.36363636%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-width='5'] {
width: 45.45454545%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-x='5'] {
left: 45.45454545%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-min-width='5'] {
min-width: 45.45454545%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-max-width='5'] {
max-width: 45.45454545%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-width='6'] {
width: 54.54545455%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-x='6'] {
left: 54.54545455%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-min-width='6'] {
min-width: 54.54545455%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-max-width='6'] {
max-width: 54.54545455%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-width='7'] {
width: 63.63636364%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-x='7'] {
left: 63.63636364%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-min-width='7'] {
min-width: 63.63636364%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-max-width='7'] {
max-width: 63.63636364%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-width='8'] {
width: 72.72727273%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-x='8'] {
left: 72.72727273%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-min-width='8'] {
min-width: 72.72727273%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-max-width='8'] {
max-width: 72.72727273%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-width='9'] {
width: 81.81818182%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-x='9'] {
left: 81.81818182%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-min-width='9'] {
min-width: 81.81818182%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-max-width='9'] {
max-width: 81.81818182%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-width='10'] {
width: 90.90909091%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-x='10'] {
left: 90.90909091%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-min-width='10'] {
min-width: 90.90909091%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-max-width='10'] {
max-width: 90.90909091%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-width='11'] {
width: 100.0%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-x='11'] {
left: 100.0%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-min-width='11'] {
min-width: 100.0%;
}
.grid-stack.grid-stack-11 > .grid-stack-item[data-gs-max-width='11'] {
max-width: 100.0%;
}
.grid-stack.grid-stack-12 > .grid-stack-item {
min-width: 8.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-width='1'] {
width: 8.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-x='1'] {
left: 8.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-min-width='1'] {
min-width: 8.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-max-width='1'] {
max-width: 8.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-width='2'] {
width: 16.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-x='2'] {
left: 16.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-min-width='2'] {
min-width: 16.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-max-width='2'] {
max-width: 16.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-width='3'] {
width: 25%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-x='3'] {
left: 25%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-min-width='3'] {
min-width: 25%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-max-width='3'] {
max-width: 25%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-width='4'] {
width: 33.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-x='4'] {
left: 33.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-min-width='4'] {
min-width: 33.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-max-width='4'] {
max-width: 33.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-width='5'] {
width: 41.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-x='5'] {
left: 41.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-min-width='5'] {
min-width: 41.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-max-width='5'] {
max-width: 41.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-width='6'] {
width: 50%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-x='6'] {
left: 50%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-min-width='6'] {
min-width: 50%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-max-width='6'] {
max-width: 50%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-width='7'] {
width: 58.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-x='7'] {
left: 58.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-min-width='7'] {
min-width: 58.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-max-width='7'] {
max-width: 58.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-width='8'] {
width: 66.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-x='8'] {
left: 66.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-min-width='8'] {
min-width: 66.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-max-width='8'] {
max-width: 66.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-width='9'] {
width: 75%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-x='9'] {
left: 75%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-min-width='9'] {
min-width: 75%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-max-width='9'] {
max-width: 75%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-width='10'] {
width: 83.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-x='10'] {
left: 83.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-min-width='10'] {
min-width: 83.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-max-width='10'] {
max-width: 83.33333333%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-width='11'] {
width: 91.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-x='11'] {
left: 91.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-min-width='11'] {
min-width: 91.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-max-width='11'] {
max-width: 91.66666667%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-width='12'] {
width: 100%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-x='12'] {
left: 100%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-min-width='12'] {
min-width: 100%;
}
.grid-stack.grid-stack-12 > .grid-stack-item[data-gs-max-width='12'] {
max-width: 100%;
}

21
src/gridstack-extra.scss Normal file
View file

@ -0,0 +1,21 @@
$gridstack-columns: 12;
@mixin grid-stack-items($gridstack-columns) {
.grid-stack.grid-stack-#{$gridstack-columns} {
> .grid-stack-item {
min-width: 100% / $gridstack-columns;
@for $i from 1 through $gridstack-columns {
&[data-gs-width='#{$i}'] { width: (100% / $gridstack-columns) * $i; }
&[data-gs-x='#{$i}'] { left: (100% / $gridstack-columns) * $i; }
&[data-gs-min-width='#{$i}'] { min-width: (100% / $gridstack-columns) * $i; }
&[data-gs-max-width='#{$i}'] { max-width: (100% / $gridstack-columns) * $i; }
}
}
}
}
@for $j from 1 through $gridstack-columns {
@include grid-stack-items($j)
}