50 lines
1.3 KiB
Markdown
50 lines
1.3 KiB
Markdown
<p align="center">
|
|
<a href="https://grid-layout-plus.netlify.app/" target="_blank" rel="noopener noreferrer">
|
|
<img src="./docs/public/grid-layout-plus.svg" width="180" style="width: 120px;" />
|
|
</a>
|
|
</p>
|
|
|
|
<h1 align="center">Grid Layout Plus</h1>
|
|
|
|
<p align="center">
|
|
<a href="https://www.npmjs.com/package/grid-layout-plus" target="_blank">
|
|
<img src="https://img.shields.io/github/package-json/v/qmhc/grid-layout-plus" alt="npm version"/>
|
|
</a>
|
|
</p>
|
|
|
|
## What is Grid Layout Plus?
|
|
|
|
Grid Layout Plus comes from [Vue Grid Layout](https://github.com/jbaysolutions/vue-grid-layout) and is migrated to Vue 3.
|
|
|
|
> It is constructed with `<script setup>` and normalized TypeScript.
|
|
|
|
<details>
|
|
<summary>About Vue Grid Layout</summary>
|
|
|
|
## What is Vue Grid Layout?
|
|
|
|
Vue Grid Layout is a grid layout system for Vue 2, like [Gridster](http://dsmorse.github.io/gridster.js/).
|
|
|
|
**Heavily inspired by [React Grid Layout](https://github.com/STRML/react-grid-layout).**
|
|
|
|
</details>
|
|
|
|
## Features
|
|
|
|
- Draggable widgets
|
|
- Resizable widgets
|
|
- Static widgets
|
|
- Bounds checking for dragging and resizing
|
|
- Widgets may be added or removed without rebuilding grid
|
|
- Layout can be serialized and restored
|
|
- Automatic RTL support
|
|
- Responsive
|
|
|
|
## Documentation
|
|
|
|
Check out the online documentation [here](https://grid-layout-plus.netlify.app/).
|
|
|
|
## License
|
|
|
|
All in [MIT](./LICENSE.md) license.
|