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 JavaScript parts in Elm, but relies on the CSS of MDL verbatim.
Build the demo:
> elm-make examples/Demo.elm
This will construct a file index.html; open that in your browser.
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.
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.