# v-bar

> The virtual responsive crossbrowser scrollbar component for VueJS 2x

Latest version **3.0.0** (published 2017-06-29) · 0 weekly downloads

## Install

```sh
npm install v-bar
pnpm add v-bar
yarn add v-bar
bun add v-bar
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 3.0.0 |
| Published | 2017-06-29 |
| First published | 2017-03-22 |
| Weekly downloads | 0 |
| TypeScript types | none |
| Module format | CommonJS |
| Node | >= 4.0.0 |
| Dependencies | 13 |
| Known vulnerabilities | 0 (+4 in 3 direct dependencies) |
| Install scripts | no |
| Author | Luigui Delyer |
| Maintainers | luiguild |

## Links

- npm: https://www.npmjs.com/package/v-bar
- npm.io page: https://npm.io/package/v-bar

## Dependencies (13)

- [pug](https://npm.io/package/pug.md) ^2.0.0-beta11
- [vue](https://npm.io/package/vue.md) ^2.2.2
- [node-sass](https://npm.io/package/node-sass.md) ^4.5.1
- [babel-core](https://npm.io/package/babel-core.md) ^6.22.1
- [sass-loader](https://npm.io/package/sass-loader.md) ^6.0.3
- [babel-eslint](https://npm.io/package/babel-eslint.md) ^7.1.1
- [babel-loader](https://npm.io/package/babel-loader.md) ^6.2.10
- [detect-resize](https://npm.io/package/detect-resize.md) ^0.1.5
- [babel-register](https://npm.io/package/babel-register.md) ^6.22.0
- [babel-preset-env](https://npm.io/package/babel-preset-env.md) ^1.2.1
- [babel-preset-es2015](https://npm.io/package/babel-preset-es2015.md) ^6.0.0
- [babel-preset-stage-2](https://npm.io/package/babel-preset-stage-2.md) ^6.22.0
- [babel-plugin-transform-runtime](https://npm.io/package/babel-plugin-transform-runtime.md) ^6.22.0

## Recent versions

- 3.0.0 (latest) — 2017-06-29
- 2.0.0 — 2017-04-08
- 1.0.8 — 2017-03-24
- 1.0.7 — 2017-03-24
- 1.0.6 — 2017-03-24
- 1.0.5 — 2017-03-24
- 1.0.4 — 2017-03-23
- 1.0.3 — 2017-03-22
- 1.0.2 — 2017-03-22
- 1.0.1 — 2017-03-22

## README

<p align="center"><img src="https://raw.githubusercontent.com/luiguild/v-bar/master/readme-image.png"></p>

# VBar

The virtual responsive crossbrowser scrollbar component for VueJS 2x

<a href="https://luiguild.github.io/v-bar/">DEMO</a>

## Usage
#### Install
###### Using NPM
``` bash
npm i v-bar
```
###### Using yarn
``` bash
yarn add v-bar
```

#### In your `.vue` component create a class to your wrapper
###### Using SASS
``` vue
<style lang="sass">
    .wrapper
        height: 300px
        width: 300px
</style>
```
###### Simple CSS
``` vue
<style>
    .wrapper {
        height: 300px;
        width: 300px;
    }
</style>
```

#### Include the component in your template
###### Using Pug
``` pug
<template lang="pug">
    v-bar(wrapper="wrapper",
        vBar="",
        vBarInternal="",
        hBar="",
        hBarInternal="")
        //- your content
</template>
```

###### Using Simple HTML
``` vue
<template>
    <v-bar wrapper="wrapper"
        vBar=""
        vBarInternal=""
        hBar=""
        hBarInternal="">
        <!-- your content -->
    </v-bar>
</template>
```

#### Import component
``` vue
<script>
    import VBar from 'v-bar'

    # Declare
    export default {
        components: { VBar }
    }
</script>
```

#### Options
VBar is fully customizable. You can use your CSS classes to make it even more beautiful :)
``` javascript
*required* wrapper=""
*optional* vBar=""
*optional* vBarInternal=""
*optional* hBar=""
*optional* hBarInternal=""
```

## To contribute and make it better
Clone the repo, change what you want and send PR

###### Contributions are always welcome!

## Build Setup
``` bash
# install dependencies
# using NPM
npm install

# using yarn
yarn

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

# build for production with minification
npm run build

# build for production and view the bundle analyzer report
npm run build --report
```

## Contributors
#### Luigui Delyer
https://github.com/luiguild

#### Carlo Fragni
https://github.com/carlofragni

#### SoullessWaffle
https://github.com/SoullessWaffle

#### Robbe Clerckx
https://github.com/robbeman

#### antshil
https://github.com/antshil

---
_Source: https://npm.io/package/v-bar · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._