wovue-off-canvas

OffCanvas vue component.

Showing:

Popularity

Downloads/wk

5

GitHub Stars

24

Maintenance

Last Commit

5yrs ago

Contributors

1

Package

Dependencies

1

Size (min+gzip)

8.2KB

License

MIT

Type Definitions

Tree-Shakeable

No?

Categories

Readme

OffCanvas

OffCanvas (Sidenav/Drawer) component for Vue.js

Create a smooth off-canvas sidebar that slides in and out of the page.

Live examples & Docs

https://wovue.github.io/off-canvas

Features

  • a11y friendly.
  • Support multiples OffCanvas.
  • You can optionallity push your content when the OffCanvas is open.

Getting Started

Install the package using npm

$ npm install wovue-off-canvas --save

Install the plugin

require('wovue-off-canvas/dist/off-canvas.css')

import Vue from 'vue'
import OffCanvas from 'wovue-off-canvas'

Vue.use(OffCanvas)

Note only with webpack you can import CSS in javascript.

Basic Usage

<wv-off-canvas ref="menu">
  <!-- off-canvas content -->
</wv-off-canvas>
<wv-off-cannvas-wrap>
  <!-- content to push -->
  <button v-off-canvas:toggle="menu" type="button">Toggle menu</button>
</wv-off-cannvas-wrap>

Development

# install dependencies
npm install

# serve with hot reload src-docs at localhost:8080
npm run dev

# build for production with minification src-docs and src
npm run build

# copy docs folder to gh-pages branch and push
npm run deploy-docs

Rate & Review

Great Documentation0
Easy to Use0
Performant0
Highly Customizable0
Bleeding Edge0
Responsive Maintainers0
Poor Documentation0
Hard to Use0
Slow0
Buggy0
Abandoned0
Unwelcoming Community0
100