Merge pull request #5113 from matthewoates/master

[Snackbar] Large screen snackbar does not cover up 100% width of screen anymore
mui · Sep 17, 2016 · 54d4fdb · 54d4fdb
2 parents 5395682 + 038aff8
commit 54d4fdb
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 5 deletions.
diff --git a/src/Snackbar/Snackbar.js b/src/Snackbar/Snackbar.js
@@ -20,15 +20,14 @@ function getStyles(props, context, state) {
   const styles = {
     root: {
       position: 'fixed',
-      left: 0,
+      left: '50%',
       display: 'flex',
-      right: 0,
       bottom: 0,
       zIndex: zIndex.snackbar,
       visibility: open ? 'visible' : 'hidden',
       transform: open ?
-        'translate(0, 0)' :
-        `translate(0, ${desktopSubheaderHeight}px)`,
+        'translate(-50%, 0)' :
+        `translate(-50%, ${desktopSubheaderHeight}px)`,
       transition: `${transitions.easeOut('400ms', 'transform')}, ${
         transitions.easeOut('400ms', 'visibility')}`,
     },

diff --git a/src/Snackbar/SnackbarBody.js b/src/Snackbar/SnackbarBody.js
@@ -38,8 +38,8 @@ function getStyles(props, context) {
       borderRadius: isSmall ? 0 : 2,
       maxWidth: isSmall ? 'inherit' : 568,
       minWidth: isSmall ? 'inherit' : 288,
+      width: isSmall ? 'calc(100vw - 48px)' : 'auto',
       flexGrow: isSmall ? 1 : 0,
-      margin: 'auto',
     },
     content: {
       fontSize: 14,