##<vi-snackbar>##

Material Design: Snackbars

swipe-to-dismiss allows the user to swipe the snackbar away

Use the snackbar-dismiss attribute on interactive controls to close the snackbar in a similar fashion to dialog-confirm or dialog-dismiss.

Example w/ manual control:

    <vi-snackbar id="mySnackbar">Save successful!</vi-snackbar>
    
    ...

    save: function () {
        ...
        this.$.mySnackbar.active = true;
        this.async(() => {
            this.$.mySnackbar.active = false;
        }, 4000);
    }

Example w/ dismiss:

    <vi-snackbar id="mySnackbar" active="{{_saveError}}">
        <span>There was an error during save</span>
        <paper-button snackbar-dismiss>Dismiss</paper-button>
    </vi-snackbar>

    ...

    save: function () {
        ...
        this._saveError = true;
    }

Styling

The following custom properties and mixins are available for styling:

Custom property	Description	Default
--vi-snackbar-active	Mixin applied to the snackbar when active	{}
--vi-snackbar-active-two-line	Mixin applied to snackbar when active in two-line mode	--primary-color