libj-vue-comp-sidenav
v1.1.0
Published
This contains a `j-sidenav` hamburger vue component and a `j-sidenav-button` to show in top menu to toggle sidenav. Uses bootstrap 4 for styling
Downloads
4
Readme
libj-vue-comp-sidenav
Part of libj tools
This contains a j-sidenav
hamburger vue component and a j-sidenav-button
to show in top menu to toggle sidenav.
Uses bootstrap 4 for styling
Needs jQuery to be available globally
Usage (npm)
npm install libj-vue-comp-sidenav
With default theme
import 'libj-vue-comp-sidenav/dist/libj-vue-comp-sidenav.default.min.css'
import 'libj-vue-comp-sidenav'
// Now, j-sidenav and j-sidenav-button are available globally
Customize theme
You'll need a separate .scss file like (showcase/showcase.scss):
// Set variables here
.
.
.
@import 'libj-vue-comp-sidenav/index.scss';
// Now override classes
.
.
.
SCSS Variables:
//side nav
$j-sidenav-background: black !default;
//side nav button
$j-sidenav-button-color: white !default;
$j-sidenav-button-active-color: white !default;
Test
- Run this in a separate command line to start node server
node server.js
- Run one of the following to re-create bundles
npm run dev
npm run dev:watch
- Navigate to http://localhost:3000
Build
npm run build
npm run build:watch