0.1.4 • Published 4 years ago

atechnavbar v0.1.4

Weekly downloads
13
License
-
Repository
-
Last release
4 years ago

atechnavbar

Installation

npm install atechnavbar

Usage

You must install atechnavbar via Vue.use() in main.js

import Vue from 'vue';
import AtechNavbar from 'atechnavbar';

Vue.use(AtechNavbar);

Using on a component

<atech-navbar :sticky="stickyNav" :mode="getNavMode" :theme="getNavTheme">

    <router-link slot="logo" class="navbar-brand pl-0 mr-0 pr-1 col-3" aria-label="SafetyNet" to="/">
        <img src="@/assets/icons/sn-horiz.svg" svg-inline alt="SafetyNet logo"
        :class="{
            'logo-brand-light': getNavTheme == 'light'
        }"
        />
    </router-link>

    <atech-navigation slot="navlinks" :data="navlinks" :dashboardUrl="dashboardLink" :sticky="stickyNav"  />

    <transition slot="progress-bar" name="fade">
    <b-progress v-if="appProgress > 0" height="10px" class="navbar-progress" :value="appProgress" variant="success"></b-progress>
    </transition>

</atech-navbar>

Props list

Props listdescription
sticky
mode
theme

Slots list

Slot listdescription
logo
navlinks
progress-bar