[Table] Remove outer margins

mui · Dec 1, 2019 · 62512af · 62512af
1 parent 54dc994
commit 62512af
Show file tree

Hide file tree

Showing 12 changed files with 63 additions and 87 deletions.
diff --git a/docs/src/pages/components/tables/AcccessibleTable.js b/docs/src/pages/components/tables/AcccessibleTable.js
@@ -7,16 +7,15 @@ import TableHead from '@material-ui/core/TableHead';
 import TableRow from '@material-ui/core/TableRow';
 import Paper from '@material-ui/core/Paper';
 
-const useStyles = makeStyles(theme => ({
+const useStyles = makeStyles({
   root: {
     width: '100%',
-    marginTop: theme.spacing(3),
     overflowX: 'auto',
   },
   table: {
     minWidth: 650,
   },
-}));
+});
 
 function createData(name, calories, fat, carbs, protein) {
   return { name, calories, fat, carbs, protein };

diff --git a/docs/src/pages/components/tables/AcccessibleTable.tsx b/docs/src/pages/components/tables/AcccessibleTable.tsx
@@ -1,24 +1,21 @@
 import React from 'react';
-import { createStyles, Theme, makeStyles } from '@material-ui/core/styles';
+import { makeStyles } from '@material-ui/core/styles';
 import Table from '@material-ui/core/Table';
 import TableBody from '@material-ui/core/TableBody';
 import TableCell from '@material-ui/core/TableCell';
 import TableHead from '@material-ui/core/TableHead';
 import TableRow from '@material-ui/core/TableRow';
 import Paper from '@material-ui/core/Paper';
 
-const useStyles = makeStyles((theme: Theme) =>
-  createStyles({
-    root: {
-      width: '100%',
-      marginTop: theme.spacing(3),
-      overflowX: 'auto',
-    },
-    table: {
-      minWidth: 650,
-    },
-  }),
-);
+const useStyles = makeStyles({
+  root: {
+    width: '100%',
+    overflowX: 'auto',
+  },
+  table: {
+    minWidth: 650,
+  },
+});
 
 function createData(name: string, calories: number, fat: number, carbs: number, protein: number) {
   return { name, calories, fat, carbs, protein };

diff --git a/docs/src/pages/components/tables/CustomPaginationActionsTable.js b/docs/src/pages/components/tables/CustomPaginationActionsTable.js
@@ -99,18 +99,17 @@ const rows = [
   createData('Oreo', 437, 18.0),
 ].sort((a, b) => (a.calories < b.calories ? -1 : 1));
 
-const useStyles2 = makeStyles(theme => ({
+const useStyles2 = makeStyles({
   root: {
     width: '100%',
-    marginTop: theme.spacing(3),
   },
   table: {
     minWidth: 500,
   },
   tableWrapper: {
     overflowX: 'auto',
   },
-}));
+});
 
 export default function CustomPaginationActionsTable() {
   const classes = useStyles2();

diff --git a/docs/src/pages/components/tables/CustomPaginationActionsTable.tsx b/docs/src/pages/components/tables/CustomPaginationActionsTable.tsx
@@ -100,20 +100,17 @@ const rows = [
   createData('Oreo', 437, 18.0),
 ].sort((a, b) => (a.calories < b.calories ? -1 : 1));
 
-const useStyles2 = makeStyles((theme: Theme) =>
-  createStyles({
-    root: {
-      width: '100%',
-      marginTop: theme.spacing(3),
-    },
-    table: {
-      minWidth: 500,
-    },
-    tableWrapper: {
-      overflowX: 'auto',
-    },
-  }),
-);
+const useStyles2 = makeStyles({
+  root: {
+    width: '100%',
+  },
+  table: {
+    minWidth: 500,
+  },
+  tableWrapper: {
+    overflowX: 'auto',
+  },
+});
 
 export default function CustomPaginationActionsTable() {
   const classes = useStyles2();

diff --git a/docs/src/pages/components/tables/CustomizedTables.js b/docs/src/pages/components/tables/CustomizedTables.js
@@ -37,16 +37,15 @@ const rows = [
   createData('Gingerbread', 356, 16.0, 49, 3.9),
 ];
 
-const useStyles = makeStyles(theme => ({
+const useStyles = makeStyles({
   root: {
     width: '100%',
-    marginTop: theme.spacing(3),
     overflowX: 'auto',
   },
   table: {
     minWidth: 700,
   },
-}));
+});
 
 export default function CustomizedTables() {
   const classes = useStyles();

diff --git a/docs/src/pages/components/tables/CustomizedTables.tsx b/docs/src/pages/components/tables/CustomizedTables.tsx
@@ -41,18 +41,15 @@ const rows = [
   createData('Gingerbread', 356, 16.0, 49, 3.9),
 ];
 
-const useStyles = makeStyles((theme: Theme) =>
-  createStyles({
-    root: {
-      width: '100%',
-      marginTop: theme.spacing(3),
-      overflowX: 'auto',
-    },
-    table: {
-      minWidth: 700,
-    },
-  }),
-);
+const useStyles = makeStyles({
+  root: {
+    width: '100%',
+    overflowX: 'auto',
+  },
+  table: {
+    minWidth: 700,
+  },
+});
 
 export default function CustomizedTables() {
   const classes = useStyles();

diff --git a/docs/src/pages/components/tables/DenseTable.js b/docs/src/pages/components/tables/DenseTable.js
@@ -7,20 +7,18 @@ import TableHead from '@material-ui/core/TableHead';
 import TableRow from '@material-ui/core/TableRow';
 import Paper from '@material-ui/core/Paper';
 
-const useStyles = makeStyles(theme => ({
+const useStyles = makeStyles({
   root: {
     width: '100%',
   },
   paper: {
-    marginTop: theme.spacing(3),
     width: '100%',
     overflowX: 'auto',
-    marginBottom: theme.spacing(2),
   },
   table: {
     minWidth: 650,
   },
-}));
+});
 
 function createData(name, calories, fat, carbs, protein) {
   return { name, calories, fat, carbs, protein };

diff --git a/docs/src/pages/components/tables/DenseTable.tsx b/docs/src/pages/components/tables/DenseTable.tsx
@@ -1,28 +1,24 @@
 import React from 'react';
-import { createStyles, Theme, makeStyles } from '@material-ui/core/styles';
+import { makeStyles } from '@material-ui/core/styles';
 import Table from '@material-ui/core/Table';
 import TableBody from '@material-ui/core/TableBody';
 import TableCell from '@material-ui/core/TableCell';
 import TableHead from '@material-ui/core/TableHead';
 import TableRow from '@material-ui/core/TableRow';
 import Paper from '@material-ui/core/Paper';
 
-const useStyles = makeStyles((theme: Theme) =>
-  createStyles({
-    root: {
-      width: '100%',
-    },
-    paper: {
-      marginTop: theme.spacing(3),
-      width: '100%',
-      overflowX: 'auto',
-      marginBottom: theme.spacing(2),
-    },
-    table: {
-      minWidth: 650,
-    },
-  }),
-);
+const useStyles = makeStyles({
+  root: {
+    width: '100%',
+  },
+  paper: {
+    width: '100%',
+    overflowX: 'auto',
+  },
+  table: {
+    minWidth: 650,
+  },
+});
 
 function createData(name: string, calories: number, fat: number, carbs: number, protein: number) {
   return { name, calories, fat, carbs, protein };

diff --git a/docs/src/pages/components/tables/EnhancedTable.js b/docs/src/pages/components/tables/EnhancedTable.js
@@ -189,7 +189,6 @@ EnhancedTableToolbar.propTypes = {
 const useStyles = makeStyles(theme => ({
   root: {
     width: '100%',
-    marginTop: theme.spacing(3),
   },
   paper: {
     width: '100%',

diff --git a/docs/src/pages/components/tables/EnhancedTable.tsx b/docs/src/pages/components/tables/EnhancedTable.tsx
@@ -216,7 +216,6 @@ const useStyles = makeStyles((theme: Theme) =>
   createStyles({
     root: {
       width: '100%',
-      marginTop: theme.spacing(3),
     },
     paper: {
       width: '100%',

diff --git a/docs/src/pages/components/tables/SpanningTable.js b/docs/src/pages/components/tables/SpanningTable.js
@@ -9,16 +9,15 @@ import Paper from '@material-ui/core/Paper';
 
 const TAX_RATE = 0.07;
 
-const useStyles = makeStyles(theme => ({
+const useStyles = makeStyles({
   root: {
     width: '100%',
-    marginTop: theme.spacing(3),
     overflowX: 'auto',
   },
   table: {
     minWidth: 700,
   },
-}));
+});
 
 function ccyFormat(num) {
   return `${num.toFixed(2)}`;

diff --git a/docs/src/pages/components/tables/SpanningTable.tsx b/docs/src/pages/components/tables/SpanningTable.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { createStyles, Theme, makeStyles } from '@material-ui/core/styles';
+import { makeStyles } from '@material-ui/core/styles';
 import Table from '@material-ui/core/Table';
 import TableBody from '@material-ui/core/TableBody';
 import TableCell from '@material-ui/core/TableCell';
@@ -9,18 +9,15 @@ import Paper from '@material-ui/core/Paper';
 
 const TAX_RATE = 0.07;
 
-const useStyles = makeStyles((theme: Theme) =>
-  createStyles({
-    root: {
-      width: '100%',
-      marginTop: theme.spacing(3),
-      overflowX: 'auto',
-    },
-    table: {
-      minWidth: 700,
-    },
-  }),
-);
+const useStyles = makeStyles({
+  root: {
+    width: '100%',
+    overflowX: 'auto',
+  },
+  table: {
+    minWidth: 700,
+  },
+});
 
 function ccyFormat(num: number) {
   return `${num.toFixed(2)}`;