[docs] Migrate Container demos to emotion (#25220)

mui · Mar 6, 2021 · 6666682 · 6666682
1 parent 69c2084
commit 6666682
Show file tree

Hide file tree

Showing 4 changed files with 8 additions and 32 deletions.
diff --git a/docs/src/pages/components/container/FixedContainer.js b/docs/src/pages/components/container/FixedContainer.js
@@ -1,20 +1,14 @@
 import * as React from 'react';
 import CssBaseline from '@material-ui/core/CssBaseline';
-import Typography from '@material-ui/core/Typography';
+import Box from '@material-ui/core/Box';
 import Container from '@material-ui/core/Container';
 
 export default function FixedContainer() {
   return (
     <React.Fragment>
       <CssBaseline />
       <Container fixed>
-        <Typography
-          component="div"
-          style={{
-            backgroundColor: '#cfe8fc',
-            height: '100vh',
-          }}
-        />
+        <Box sx={{ bgcolor: '#cfe8fc', height: '100vh' }} />
       </Container>
     </React.Fragment>
   );

diff --git a/docs/src/pages/components/container/FixedContainer.tsx b/docs/src/pages/components/container/FixedContainer.tsx
@@ -1,20 +1,14 @@
 import * as React from 'react';
 import CssBaseline from '@material-ui/core/CssBaseline';
-import Typography from '@material-ui/core/Typography';
+import Box from '@material-ui/core/Box';
 import Container from '@material-ui/core/Container';
 
 export default function FixedContainer() {
   return (
     <React.Fragment>
       <CssBaseline />
       <Container fixed>
-        <Typography
-          component="div"
-          style={{
-            backgroundColor: '#cfe8fc',
-            height: '100vh',
-          }}
-        />
+        <Box sx={{ bgcolor: '#cfe8fc', height: '100vh' }} />
       </Container>
     </React.Fragment>
   );

diff --git a/docs/src/pages/components/container/SimpleContainer.js b/docs/src/pages/components/container/SimpleContainer.js
@@ -1,20 +1,14 @@
 import * as React from 'react';
 import CssBaseline from '@material-ui/core/CssBaseline';
-import Typography from '@material-ui/core/Typography';
+import Box from '@material-ui/core/Box';
 import Container from '@material-ui/core/Container';
 
 export default function SimpleContainer() {
   return (
     <React.Fragment>
       <CssBaseline />
       <Container maxWidth="sm">
-        <Typography
-          component="div"
-          style={{
-            backgroundColor: '#cfe8fc',
-            height: '100vh',
-          }}
-        />
+        <Box sx={{ bgcolor: '#cfe8fc', height: '100vh' }} />
       </Container>
     </React.Fragment>
   );

diff --git a/docs/src/pages/components/container/SimpleContainer.tsx b/docs/src/pages/components/container/SimpleContainer.tsx
@@ -1,20 +1,14 @@
 import * as React from 'react';
 import CssBaseline from '@material-ui/core/CssBaseline';
-import Typography from '@material-ui/core/Typography';
+import Box from '@material-ui/core/Box';
 import Container from '@material-ui/core/Container';
 
 export default function SimpleContainer() {
   return (
     <React.Fragment>
       <CssBaseline />
       <Container maxWidth="sm">
-        <Typography
-          component="div"
-          style={{
-            backgroundColor: '#cfe8fc',
-            height: '100vh',
-          }}
-        />
+        <Box sx={{ bgcolor: '#cfe8fc', height: '100vh' }} />
       </Container>
     </React.Fragment>
   );