MATERIAL : DIALOGS
The Material Design Lite (MDL) dialog component allows for verification of user actions, simple data input, and alerts to provide extra information to users.
Note: Dialogs use the HTML <dialog> element, which currently has very limited cross-browser support. To ensure support across all modern browsers, please consider using a polyfill or creating your own. There is no polyfill included with MDL.
Smarty note: Desktop browsers may support this feature but mobile browsers do not! We recommend
you bootstrap modals. In the future, all browsers may support <dialog> but for now, please, avoid using it.
1. Add to html head, BEFORE essentials.css:
<link href="assets/plugins/mdl/material.indigo-blue.min.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
2. Add .enable-materialdesign class to body:
<body class="smoothscroll enable-animation enable-materialdesign">
(.enable-materialdesign class is used by assets/js/scripts.js to load MDL plugin from assets/plugins/mdl/)
COLOR SCHEME: We use blue as default color scheme. You can create your own material design color:
Click to create your material design color
Credits: MDL official