Skip to content

N3-components/N3-components

master
Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
src
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

N3-components - Powerful Vue Library.

Shippable branch Test Coverage Gitter Code Climate npm

N3 components library is built with Vue.js, is a powerful library for frontend or full-stack engineers to build web pages quickly.

Home Page | 中文说明 | Documents

Introduction

logo

N3 components applys oneself to structure a great ecological circle of developers using Vue.js. Supporting as follows:

  • More than 60 components. See Here

  • Personality Of Style.

  • UMD.

  • Using ES6.

NPM

Link:https://www.npmjs.com/package/N3-components

npm install N3-components --save-dev

CNPM

Link:https://npm.taobao.org/package/N3-components

cnpm install N3-components --save-dev

CDN

Quick Start

You can install components for your global environment.

import Vue from 'vue'
import N3Components from 'N3-components'
import 'N3-components/dist/index.min.css'

// install N3
Vue.use(N3Components)

// for English  (default chinese)
// version 2.2.0 or later
Vue.use(N3Components, 'en')

You can also import single component when needed.

import Vue from 'vue'
import N3Components from 'N3-components'
import {n3Alert} from N3Components

// set language  
// window.n3Locale = 'en'
//

theme customization

// default 
import 'N3-components/src/style/default.less' 

// theme customization
import 'your-theme.less' 

your-theme.less

@import 'N3-components/src/style/common.less' 

/*base color*/
@whiteColor: #fff;
@blackColor: #000;
@lightBlackColor: #333;
@grayColor: #ccc;
@weightGrayColor: #999;
@lightGrayColor: #eee; 
@lightColor: #f9f9f9; 

/*font color*/
@fontColor: #555;

/*theme color*/
@primaryColor: #41cac0;
@primaryColorhover: #39b2a9;
@hoverColor:rgba(65, 202, 192, 0.05);

/*extend color*/
@successColor: #19d567;
@successColorhover: #30d073;

@infoColor: #2db7f5;
@infoColorhover: #43bcf3;

@dangerColor: #f50;
@dangerColorhover: #f9702b;

@warningColor: #fa0;
@warningColorhover: #f5b73b;

Requirements

  • vue
  • vue-focus
  • velocity-animate

Discussing

Contribute

Contribute

Change log

Change Log

License

MIT