VueNES.css

Introduction

VueNES.css is a basic component library based on the CSS Framework NES.css

How to install

Using NPM

$npm install vuenes.css

Using yarn

$yarn add vuenes.css

Quick Start

VueJS Project

In your main.js you only need to import the component library and the just use it!

import Vue from 'vue'
import VueNesCss from 'vuenes.css'

Vue.use(VueNesCss)

NuxtJS Project

You can import the whole library in a NuxtJS Plugin

~/plugins/vuenes.css.js

import Vue from 'vue'
import VueNesCss from 'vuenes.css'

Vue.use(VueNesCss)

and then import it in your nuxt.config.js file

plugins: [
  '~/plugins/vuenes.css.js'
]

Individual Components

You can also import individual components instead of the whole library in your VueJS and NuxtJS Components

<template>
  <div class="container">
    <NesInputText id="example" />
    <NesOctocat animate />
  </div>
</template>

import { NesInputText, NesOctocat } from 'vuenes.css'

export default {
  components: {
    NesInputText,
    NesOctocat
  }
}

Documentation

Go to the docs/ library to navigate through the components documentation

Storybook

For visual testing, the library contains storybook which you can run by doing the next command:

$yarn storybook:serve

Help Wanted

Some components are missing in this library such as the table one.. if you come up with a solution for a missing component, feel free to Open a PR and discuss the approach

If you find any issue, please create an Issue or upload a PR