0.1.4 • Published 4 years ago
atechnavbar v0.1.4
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 list | description |
---|---|
sticky | |
mode | |
theme |
Slots list
Slot list | description |
---|---|
logo | |
navlinks | |
progress-bar |