SNACKBAR

Snackbar are a non-disruptive message in the corner of the interface. It provides quick 'at-a-glance' feedback on the outcome of an action.

Snackbars

There are three types of snackbar component. These can be accessed by class names - button-baseline, button-leading and button-stacked. Copy the code from below and add them accorging to your required size. Click on the buttons to see live demo.

Code Example


                    <div class='button-container'>
                        <button class="button-baseline">BASELINE</button>
                        <button class="button-leading">LEADING</button>
                        <button class="button-stacked">STACKED</button>
                    </div>
                    <div class="snackbar">
                        <p>Can't login to the website. Please try again later.</p>
                        <button>RETRY<i class="fa fa-times"></i></button>
                    </div>

Here is a link to a JS file:
https://github.com/pariyar07/WALDO/

Can't login to the website. Please try again later.