[Snackbar] Add a contentStyle property

src/Snackbar/Snackbar.js

@@ -58,6 +58,10 @@ class Snackbar extends Component {
      * The css class name of the root element.
      */
     className: PropTypes.string,
+    /**
+     * Override the inline-styles of the content element.
+     */
+    contentStyle: PropTypes.object,
     /**
      * The message to be displayed.
      *
@@ -196,11 +200,12 @@ class Snackbar extends Component {
   render() {
     const {
       autoHideDuration, // eslint-disable-line no-unused-vars
+      contentStyle,
+      bodyStyle,
       message: messageProp, // eslint-disable-line no-unused-vars
       onRequestClose, // eslint-disable-line no-unused-vars
       onActionTouchTap,
       style,
-      bodyStyle,
       ...other,
     } = this.props;
 
@@ -217,11 +222,12 @@ class Snackbar extends Component {
       <ClickAwayListener onClickAway={open && this.componentClickAway}>
         <div {...other} style={prepareStyles(Object.assign(styles.root, style))}>
           <SnackbarBody
-            open={open}
-            message={message}
             action={action}
-            style={bodyStyle}
+            contentStyle={contentStyle}
+            message={message}
+            open={open}
             onActionTouchTap={onActionTouchTap}
+            style={bodyStyle}
           />
         </div>
       </ClickAwayListener>

src/Snackbar/Snackbar.spec.js

@@ -3,13 +3,14 @@ import React from 'react';
 import {shallow} from 'enzyme';
 import {assert} from 'chai';
 import Snackbar from './Snackbar';
+import SnackbarBody from './SnackbarBody';
 import getMuiTheme from '../styles/getMuiTheme';
 
 describe('<Snackbar />', () => {
   const muiTheme = getMuiTheme();
   const shallowWithContext = (node) => shallow(node, {context: {muiTheme}});
 
-  describe('props: open', () => {
+  describe('prop: open', () => {
     it('should be hidden when open is false', () => {
       const wrapper = shallowWithContext(
         <Snackbar open={false} message="Message" />
@@ -74,4 +75,18 @@ describe('<Snackbar />', () => {
       done();
     }, 500);
   });
+
+  describe('prop: contentStyle', () => {
+    it('should apply the style on the right element', () => {
+      const contentStyle = {};
+      const wrapper = shallowWithContext(
+        <Snackbar open={false} message="" contentStyle={contentStyle} />
+      );
+
+      assert.strictEqual(
+        wrapper.find(SnackbarBody).props().contentStyle,
+        contentStyle
+      );
+    });
+  });
 });

src/Snackbar/SnackbarBody.js

@@ -64,9 +64,10 @@ function getStyles(props, context) {
 
 export const SnackbarBody = (props, context) => {
   const {
-    open, // eslint-disable-line no-unused-vars
     action,
+    contentStyle,
     message,
+    open, // eslint-disable-line no-unused-vars
     onActionTouchTap,
     style,
     ...other,
@@ -85,7 +86,7 @@ export const SnackbarBody = (props, context) => {
 
   return (
     <div {...other} style={prepareStyles(Object.assign(styles.root, style))}>
-      <div style={prepareStyles(styles.content)}>
+      <div style={prepareStyles(Object.assign(styles.content, contentStyle))}>
         <span>{message}</span>
         {actionButton}
       </div>
@@ -98,6 +99,10 @@ SnackbarBody.propTypes = {
    * The label for the action on the snackbar.
    */
   action: PropTypes.node,
+  /**
+   * Override the inline-styles of the content element.
+   */
+  contentStyle: PropTypes.object,
   /**
    * The message to be displayed.
    *