Material-ui: [Snackbar] Add multiline support

Created on 2 Apr 2016  路  4Comments  路  Source: mui-org/material-ui

It would be great if the Snackbar would support multiline texts. The specs for Snackbar multiline support can be found here:
https://www.google.com/design/spec/components/snackbars-toasts.html#snackbars-toasts-specs

snackbar

This feature has already been mentioned here #2826 by @mbrookes
Do you think you could fold in this little change in one of the following releases?

Snackbar enhancement

Most helpful comment

You can archive it with styling like

const message = 'First line\nSecond Line'

...

<Snackbar
  message={message}        
  bodyStyle={{ height: 'auto', lineHeight: '28px', padding: 24, whiteSpace: 'pre-line' }}
/>

Maybe try and set a maxHeight for mobile devices.

All 4 comments

@treylon, @rynti, this looks like the kind of thing you should be able to tackle as a PR, since Snackbar is a relatively simple component. Feel free to give it a go if this feature is important to you.

@mbrookes I'll tackle it in the next few days :)

Is there any update on this?

You can archive it with styling like

const message = 'First line\nSecond Line'

...

<Snackbar
  message={message}        
  bodyStyle={{ height: 'auto', lineHeight: '28px', padding: 24, whiteSpace: 'pre-line' }}
/>

Maybe try and set a maxHeight for mobile devices.

Was this page helpful?
0 / 5 - 0 ratings