vue-notibar

Vue 2 Notibar

Description

Customizable notification bar for Vue 2 applications.

Installation

Using npm

$ npm i vue-notibar

or CDN

<script src="https://unpkg.com/vue@2.7.16/dist/vue.min.js"></script>
<script src="https://unpkg.com/vue-notibar/dist/vue-notibar.min.js"></script>

Usage

import Vue from 'vue'
import VueNotibar from 'vue-notibar'

Vue.use(VueNotibar)
// or with options
Vue.use(VueNotibar, options)

this.$notibar.add('message')
// or with options
this.$notibar.add('message', options)

Options

{
    textColor: String,        // default '#FFFFFF'
    backgroundColor: String,  // default '#323232'
    time: Number,             // default 5000. Set null to disable timeout
    position: String,         // default 'center'. Possible values: 'left', 'center', 'right'
    dismiss: {
        show: Boolean,        // default false
        color: String,        // default '#FFFFFF'
    }
}

Live demo

JSFiddle