Skip to content
Material Design 风格的 Vue.js UI 组件库
Branch: master
Clone or download
Latest commit 3b2f8a8 Mar 5, 2018
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
build
demo refactor: update demo Mar 5, 2018
dist update to webpack 3.0.0 😁 👿 🌠 Jun 27, 2017
example refactor: update demo Mar 5, 2018
lib add localtorage loader for js & css 🌉 🎢 🏈 Apr 15, 2017
logo add logo and examples Dec 29, 2016
src clean Tab May 25, 2017
test/unit update webpack and add offline for demos 😈 🤒 👊 Feb 26, 2017
.babelrc rubik project init Dec 27, 2016
.editorconfig rubik project init Dec 27, 2016
.gitignore fixbug and update components 💫 🎂 🎬 Apr 10, 2017
.npmignore update to webpack 2.0 Feb 17, 2017
LICENSE Initial commit Dec 24, 2016
README.md update karma test config 🎗 🏡 🏙 Feb 24, 2017
index.html refactor: update demo Mar 5, 2018
package.json update to webpack 3.0.0 😁 👿 🌠 Jun 27, 2017
yarn.lock update to webpack 3.0.0 😁 👿 🌠 Jun 27, 2017

README.md

关于 Rubik UI

Rubik UI is a Material Design style ui library based Vue.js 2.0+ which can be used for PC and Mobile.

Rubik UI 是一个基于 Vue.js 2.0+ 的开源 UI 组件库,在交互和视觉设计上遵循 Material Design 规范,适用于 PC 端和 mobile 端。

GitHub

https://github.com/ccforward/rubik

NPM

npm

Support

Support Vue.js 2.0+

Not support Vue.js 1.x

Demo

https://ccforward.github.io/rubik/

http://rubik.ccforward.net/

Usage

npm install

$ npm install i-rubik --save

$ yarn add i-rubik

Rubik init

import Vue from 'vue'
import Rubik from 'i-rubik'
Vue.use(Rubik)

export default {
  name: 'app',
  mounted(){
    this.$rubik.init()
  }
}

iconfont

Material Design's iconfont has been writtened in css file

import css

<link href="./node_modules/i-rubik/dist/rubik.min.css" rel="stylesheet" type="text/css">

OR

<link href="//unpkg.com/i-rubik/dist/rubik.min.css" rel="stylesheet" type="text/css">

Releated Projects

Rubik UI 的部分组件和样式代码参考了以下项目

Thanks to

You can’t perform that action at this time.