MUI is a lightweight CSS framework that follows Google’s Material Design guidelines.
Use From the CDN:
text-html-basic
<link href="//cdn.muicss.com/mui-0.10.0/css/mui.min.css" rel="stylesheet" type="text/css" />
<script src="//cdn.muicss.com/mui-0.10.0/js/mui.min.js"></script>
Or for development you can use the latest:
<link href="//cdn.muicss.com/mui-latest/css/mui.min.css" rel="stylesheet" type="text/css" />
<script src="//cdn.muicss.com/mui-latest/js/mui.min.js"></script>
Install with NPM:
$ npm install --save muicss
Read more: https://www.npmjs.com/package/muicss
Install with Bower:
$ bower install mui
MUI is designed from the ground up to be fast, small and developer friendly. By design it only includes the basic components you need to build a site that follows Google’s Material Design guidelines. Some of the key features of MUI are:
To get started using MUI, go to the MUI website to see examples and download boilerplate HTML.
MUI is tested and works in:
Clone repository
source-shell
$ git clone git@github.com:muicss/mui.git
$ cd mui
Install node dependencies using npm
source-shell
$ npm install
Build examples
source-shell
$ npm run build-examples
To view the examples you can use any static file server. To use the nodejs http-server
module:
source-shell
$ npm install http-server
$ npm run http-server -- -p 3000
Then visit http://localhost:3000/examples
To run the unit tests from the command line, run ‘npm test’:
source-shell
$ npm test
To run the E2E tests first compile the unit test files into a version that runs in the browser:
source-shell
$ npm run build-e2e-tests
Then visit http://localhost:3000/e2e-tests
source-shell
$ npm run build-cdn
The build will be located in the packages/cdn
directory:
cdn/
├── angular
│ ├── mui-angular.js
│ └── mui-angular.min.js
├── css
│ ├── mui.css
│ ├── mui.min.css
│ ├── mui-rtl.css
│ └── mui-rtl.min.css
├── email
│ ├── mui-email-inline.css
│ ├── mui-email-inline-rtl.css
│ ├── mui-email-styletag.css
│ └── mui-email-styletag-rtl.css
├── extra
│ ├── mui-angular-combined.js
│ ├── mui-angular-combined.min.js
│ ├── mui-colors.css
│ ├── mui-colors.min.css
│ ├── mui-combined.js
│ ├── mui-combined.min.js
│ ├── mui-noglobals.css
│ ├── mui-noglobals.min.css
│ ├── mui-noglobals-rtl.css
│ ├── mui-noglobals-rtl.min.css
│ ├── mui-react-combined.js
│ └── mui-react-combined.min.js
├── js
│ ├── mui.js
│ └── mui.min.js
├── react
│ ├── mui-react.js
│ └── mui-react.min.js
└── webcomponents
├── mui-webcomponents.js
└── mui-webcomponents.min.js
source-shell
$ npm run build-npm
The NPM package is located in the packages/npm
directory.
source-shell
$ npm run build-meteor
The Meteor package is located in the packages/meteor
directory.
Author: muicss
Official Website: https://github.com/muicss/mui
#css #programming