"vue-grid-layout": "^3.0.0-beta1",
.droppable-element { width: 150px; text-align: center; background: #fdd; border: 1px solid black; margin: 10px 0; padding: 10px; } .vue-grid-layout { background: #eee; } .vue-grid-item:not(.vue-grid-placeholder) { background: #ccc; border: 1px solid black; } .vue-grid-item .resizing { opacity: 0.9; } .vue-grid-item .static { background: #cce; } .vue-grid-item .text { font-size: 24px; text-align: center; position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; height: 100%; width: 100%; } .vue-grid-item .no-drag { height: 100%; width: 100%; } .vue-grid-item .minMax { font-size: 12px; } .vue-grid-item .add { cursor: pointer; } .vue-draggable-handle { position: absolute; width: 20px; height: 20px; top: 0; left: 0; background-position: bottom right; padding: 0 8px 8px 0; background-repeat: no-repeat; background-origin: content-box; box-sizing: border-box; cursor: pointer; } .layoutJSON { background: #ddd; border: 1px solid black; margin-top: 10px; padding: 10px; } .layoutJSON { background: #ddd; border: 1px solid black; margin-top: 10px; padding: 10px; } .columns { -moz-columns: 120px; -webkit-columns: 120px; columns: 120px; }
