component-headerbite-vuejs v1.0.16

Component Headerbite Vuejs

Vue Headerbite Template Component

Synopsis

To deliver heading component providing location and day

Code Examples

Install:

npm install component-headerbite-vuejs --save

Usage:

Vue.use(Headerbite, options);

or within existing components:

import Headerbite from 'component-headerbite-vuejs';

export default {
    components: {
        Headerbite
    }
}

Installation

Install dependencies:

npm install

Copy .env.example to create .env:

cp .env.example .env

Copy config files over:

cp ./src/config/build.js ./src/config/development.js

Serve with hot reload at localhost:8080 (default):

npm run dev

Build for production with minification:

npm run build

Documentation

Properties

Displaying Options

Venue

• Image. With the venueType set it will display the background image of the given venue (Options listed above). venueType takes priority over all other properties
• Heading. venueName is set it will display its contents above the date. If venueName is not set it will fallback to the address

DMA

• Image. With the dma set it will display the background image of the given DMA (Only supported for the following DMAs: 501, 504, 506, 511, 514, 602, 803, 807). If DMA is provided that is not in the list a fallback image will be displayed
• Heading Will display the name of the dma. If stationary is set to true, then the address will be set instead of the DMA. (If address is set)

Address

• Image. With the address set and no other options the fallback image will be used.
• Heading The address will be set if no other options are used.

*Note: If no options are set the fallback image will be used and only the date will be displayed

Test

All widgets should have unit tests associated with them. To run all tests

npm test

For developments test with hot reloading at localhost:3001

npm run test:dev

To run tests with coveralls support:

npm run test:coveralls

Style Guide

All project should follow JS Style guide. Style guide is a modified version of airbnb, and should be referenced during development. Any modified rules can be found in .eslintc.json file.

To run eslint:

npm run lint

To fix eslint errors:

npm run lint:fix

Local Setup

• Atom: docs
• Sublime: docs