mdbootstrap/mdb-ui-kit
1
1
Fork 0
mirror of https://github.com/mdbootstrap/mdb-ui-kit.git synced 2025-04-23 02:22:12 +03:00
Code Issues Packages Projects Releases Wiki Activity

added development info page

FezVrasta 2015-01-28 18:16:27 +01:00
parent 6aba5c661f
commit ea368e94ef
1 changed files with 54 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
development.md Normal file

@ -0,0 +1,54 @@
# Development
Material Design for Bootstrap ("MDB") is developed with mainly two languages: LESS and JavaScript.
Source files are in the `less/` and `scripts/` directories, the first contains the source of the LESS files and the second one contains the JavaScript source files.
MDB uses `material.css` as stylesheet, `material-wfont.css` is the same file, but with the Google Web fonts included for Roboto.
`material.js`, instead, is used to add some extra markup and some jQuery events used to add animations to the elements.
## LESS
LESS is the CSS pre-processor we use to write the style of the theme, it then compiles to CSS thanks to our __Grunt__ tasks.
When you edit files related to the theme (`less/`) you will want to compile them running:
````sh
grunt material:less
````
It will compile LESS files into CSS inside the `dist/css/` folder and will create maps for them, along with minified versions of them with their maps.
Every map refers directly to the LESS source to help the development.
The ripple effect has its own dedicated LESS file which compiles in `ripples.css`. To compile it use:
````sh
grunt ripples:less
````
It will compile LESS to CSS inside the `dist/css/` folder and will create its source maps. It will even minify the CSS and will create the source map for it.
Every map refers directly to the LESS source to help development.
## JavaScript
This project, unfortunately, needs JavaScript to make some element work. We try to use CSS only solution every time is possible but, sometimes, JavaScript is needed.
The main file is `material.js`, inside the `scripts/` folder. To compile it use:
````sh
grunt material:js
````
It will copy the script inside `dist/js/` folder and will minify it creating the minified script and its source map.
The other script is `ripples.js` and is an awesome piece of jQuery which adds the ripples effect to every _not\_self\_closing\_element_.
To compile it and generate minified versions and source maps run:
````sh
grunt ripples:js
````
## SASS
Currently only LESS is maintained. The SASS version no longer has a maintainer (#256).
The SASS files are in the source just in case someone wants to update the source from SASS and use these files as a base.