Material design for Vue.js
Find a file
Marcos Moura e7eb23456e Merge remote-tracking branch 'origin/develop' into components/mdDatepicker
* origin/develop:
  mdSwitch can be used without v-model (#607) (#622)
  md-slect: key navigation ignores mdSubheader onEnter (#592) (#623)
  Fix subtotal not updating (#625)
  Fix undefined variable in md-radio SCSS (#635)
  Refactor Theme Engine (#646)
  some required scss imports added (#670)
  Fixes #629 Unable to set disabled property of md-bottom-bar-item (#689)
  Dont overwrite currentSize of mdTablePagination (#692)
  Fix radio button null value (#693)
  DOCS: Added missing argument in code example (#702)
  Allow object for option in select (#708)
  Fix floating action button incoherent move #713 (#714)
  Added the code samples for Demo in List Components (Multiple options, Multiple Expand) (#725)
  adding click handler (#726)
  fix md-tabs not properly flexed when applied with md-fixed (#636)
  fix language more gender neutral #633 (#637)
2017-05-07 20:09:48 -03:00
.github fix comment 2017-01-12 19:26:49 -02:00
build make tree shaking work with babel-preset-env 2017-03-03 00:38:18 -03:00
dist [build] 0.7.1 2017-02-08 22:05:12 -02:00
docs Merge remote-tracking branch 'origin/develop' into components/mdDatepicker 2017-05-07 20:09:48 -03:00
src Merge remote-tracking branch 'origin/develop' into components/mdDatepicker 2017-05-07 20:09:48 -03:00
.editorconfig Order 2016-07-13 02:39:15 -03:00
.eslintrc Improve logic of selection inside table 2016-10-26 21:59:51 -02:00
.gitignore add support for icons without ligatures (#330) 2017-01-12 10:55:39 -02:00
babel.js make tree shaking work with babel-preset-env 2017-03-03 00:38:18 -03:00
LICENSE Add LICENSE 2016-10-14 11:42:59 -03:00
package.json Merge remote-tracking branch 'origin/master' into components/mdDatepicker 2017-05-07 19:58:56 -03:00
README.md Merge remote-tracking branch 'origin/develop' into components/mdDatepicker 2017-05-07 20:09:48 -03:00
yarn.lock fix perfomance of buttons and improve month and year layout 2017-03-03 17:12:07 -03:00

Material Design for Vue.js

Downloads Version Version License Gitter Chat

Vue Material is lightweight framework built exactly according to the Material Design specs.

It aims to deliver a collection of reusable components and a series of UI Elements to build applications with support to all modern Web Browsers through Vue 2.

Build powerful and well-designed web apps that can fit on every screen. You can generate and use themes dynamically, use components on demand, take advantage of UI Elements and Components with an ease-to-use API.

Demo and Documentation

Demo

Installation

Import Roboto and Material Icons from Google CDN:

<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Roboto:300,400,500,700,400italic">
<link rel="stylesheet" href="//fonts.googleapis.com/icon?family=Material+Icons">

Install Vue Material through npm or yarn

npm install --save vue-material
yarn add vue-material

* Others package managers like JSPM and Bower are not supported yet.

Import or require Vue and Vue Material in your code:

import Vue from 'vue'
import VueMaterial from 'vue-material'
import 'vue-material/dist/vue-material.css'

// OR

var Vue = require('vue')
var VueMaterial = require('vue-material')
require('vue-material/dist/vue-material.css')

Alternativelly you can download and reference the script and the stylesheet in your HTML:

<link rel="stylesheet" href="path/to/vue-material.css">
<script src="path/to/vue-material.js"></script>

Usage

Enable Vue Material in your application using Vue.use(). You can always enable individual components:

Vue.use(VueMaterial)

// OR

Vue.use(VueMaterial.MdCore) //Required to boot vue material
Vue.use(VueMaterial.MdButton)
Vue.use(VueMaterial.MdIcon)
Vue.use(VueMaterial.MdSidenav)
Vue.use(VueMaterial.MdToolbar)

Changelog

Changelog

Questions

The issue list is exclusively for reports, bugs and feature requests. Use the Gitter Channel instead.

Contributing

Please make sure to read the Contributing Guide before making a pull request.

Browser Support

Vue Material supports the latest version of all Browsers. This means:

  • Google Chrome 52+
  • Firefox 48+
  • Safari 9+
  • Opera 38+
  • Edge 12+
  • IE 11

May work in other browsers but it's untested.

Credits and Thanks

  • This library aims to delivery components using almost the same API of Angular Material
  • Thanks a lot to elviskang for donating the npm package name!
  • Thanks to Evan You for allowing me to use Vue.js Logo.

Internal Dependencies

You don't need to include any other library to work with vue-material. The focus of this project is to have a standalone build with no external dependence, but aiming to deliver the best experience without break the compatibility with the Vue.js core.

License

MIT