Materialish

Snackbar

Snackbars provide brief messages about app processes at the bottom of the screen.

🙌 Heads up! This code is editable. The preview above will update to reflect your changes.

Usage

import { Snackbar } from 'materialish';
import 'materialish/materialish.css';

Note that Snackbars are frequently used with Buttons.

Props

Prop NameDefault ValueDescription
classNameAdditional class name(s) to add to the snackbar
nodeRefPass a ref to get access to the root node
...restOther props are placed on the root element

CSS Variables

VariableDefault ValueDescription
--mt-baseFontSize1remThe text size and dimensions of the snackbar is based off of this value
--mt-fontFamily'Roboto'The font family to use for text

Useful Links