github/elm-mdl
1
0
Fork 0
mirror of https://github.com/correl/elm-mdl.git synced 2024-12-18 03:00:11 +00:00
Code Issues Projects Releases Packages Wiki Activity
Elm-port of the Material Design Lite CSS/JS library
58 commits 2 branches 8 tags 583 KiB
Elm 98.5%
Makefile 0.8%
HTML 0.7%
Find a file
Håkon Rossebø bcd5e3656a Updates Icon usage to handle separate Icon size Style values
2016-03-25 00:58:07 +01:00
examples Updates Icon usage to handle separate Icon size Style values 2016-03-25 00:58:07 +01:00
src Updates Icon usage to handle separate Icon size Style values 2016-03-25 00:58:07 +01:00
.gitignore chore(app): ignoring vscode files 2016-03-22 07:29:41 +01:00
CONTRIBUTING.md Update CONTRIBUTING.md 2016-03-21 23:30:09 +01:00
elm-package.json Added styling to Grid, Buttons. 2016-03-19 23:48:23 +01:00
Makefile Templates. 2016-03-21 12:24:00 +01:00
page.html Added sans documentation 2016-03-17 20:56:04 +01:00
README.md Separate contributions page 2016-03-21 23:29:29 +01:00

README.md

Material Design Components in Elm

Port of Google's Material Design Lite CSS/JS implementation of the Material Design Specification.

Live demo here.

MDL is implemented primarily through CSS, with a little bit of Javascript adding and removing CSS classes in response to DOM events. This port re-implements the CSS parts in Elm, but relies on the CSS of MDL verbatim.

CAUTION! This is an early and incomplete prototype. Use at your own risk.

Get Started

Build the demo:

> elm-make examples/Demo.elm

This will construct a file index.html; open that in your browser.

Embedding in your own HTML.

Initial page load of the demo will produce a flicker, which can only be avoided if you set up the MDL css to load before elm does. Use the file page.html as a template. To build the demo in this mode, comment out line 154 in examples/Demo.elm and build the demo like this:

> elm-make examples/Demo.elm --output elm.js

This will produce a file elm.js. Open the file page.html in your browser; this file will set up MDL css and load elm.js.

Contribute

Contributions are warmly encouraged! Whether you are a newcomer to Elm or an accomplished expert, the MDL port presents interesting challenges. Refer to this page for a detailed list of possible contributions.