disabled add child props tab and repositioned props inputs and button

Author: jzuniga206

src/components/bottom/BottomTabs.tsx

@@ -184,11 +184,11 @@ class BottomTabs extends Component<BottomTabsPropsInt, StateInt> {
               htmlAttribCount ? `(${htmlAttribCount})` : ''
             } `}
           />
-          <Tab
+          {/* <Tab
             disableRipple
             classes={{ root: classes.tabRoot, selected: classes.tabSelected }}
             label='Add Child Props'
-          />
+          /> */}
         </Tabs>
 
         {value === 0 && (
@@ -242,7 +242,7 @@ class BottomTabs extends Component<BottomTabsPropsInt, StateInt> {
         {value === 3 && focusChild.childType !== 'HTML' && (
           <p>Please select an HTML element to view attributes</p>
         )}
-        {value === 4 && <AddChildProps />}
+        {/* {value === 4 && <AddChildProps />} */}
       </div>
     );
   }

src/components/bottom/DataTable.tsx

@@ -42,6 +42,7 @@ const styles = (theme: Theme) => ({
     padding: '3px',
     borderRadius: '7px',
     border: 'none',
+    align: 'center',
     '&:hover': {
       transform: 'scale(1.1)',
       color: '#fff'
@@ -105,7 +106,7 @@ function dataTable(props: dataTableProps) {
     // for some reason we must put each value in a div.
     return rowHeader.map((header: string, idx: number) => (
       <TableCell align={'center'} key={`td_${idx}`}>
-        <div className={classes.tableCell} align={'center'} padding={'none'}>
+        <div className={classes.tableCell} padding={'none'}>
           {row[header]}
         </div>
       </TableCell>
@@ -136,7 +137,7 @@ function dataTable(props: dataTableProps) {
   return (
     <Paper className={classes.root}>
       <div className={classes.tableContainer}>
-        <Table className={classes.table} selectable={'true'}>
+        <Table className={classes.table}>
           <TableHead>
             <TableRow>{renderHeader}</TableRow>
           </TableHead>

src/components/bottom/Props.tsx

@@ -58,13 +58,13 @@ const styles = () => ({
   propHeader: {
     fontSize: '35px',
     fontWeight: '900',
-    marginLeft: '1rem',
+    marginLeft: '2%',
     paddingTop: '10px'
   },
   dataTableHeader: {
     fontSize: '35px',
     fontWeight: '900',
-    marginLeft: '22rem',
+    marginLeft: '20%',
     marginTop: '15px',
     paddingTop: '10px'
   },
@@ -114,7 +114,7 @@ const styles = () => ({
   },
   addProp: {
     width: '15rem',
-    marginLeft: '3rem',
+    marginLeft: '45%',
     height: '4rem',
     transition: 'all 0.1s ease-out',
     border: '2px solid #33eb91',