Fix delete icon placement

src/products/components/ProductVariants/ProductVariants.tsx

@@ -70,7 +70,7 @@ const useStyles = makeStyles(
   theme => ({
     [theme.breakpoints.up("lg")]: {
       colActions: {
-        width: 30
+        width: 70
       },
       colInventory: {
         width: 200
@@ -89,7 +89,9 @@ const useStyles = makeStyles(
     colInventory: {
       textAlign: "right"
     },
-    colName: {},
+    colName: {
+      paddingLeft: 0
+    },
     colPrice: {
       textAlign: "right"
     },
@@ -99,12 +101,6 @@ const useStyles = makeStyles(
       color: fade(theme.palette.text.secondary, 0.6),
       display: "block"
     },
-    denseTable: {
-      "& td, & th": {
-        paddingRight: theme.spacing(3)
-      },
-      width: "auto"
-    },
     link: {
       cursor: "pointer"
     },
@@ -195,7 +191,7 @@ interface ProductVariantsProps extends ListActions {
   onVariantsAdd?();
 }
 
-const numberOfColumns = 6;
+const numberOfColumns = 7;
 
 export const ProductVariants: React.FC<ProductVariantsProps> = props => {
   const {
@@ -280,7 +276,7 @@ export const ProductVariants: React.FC<ProductVariantsProps> = props => {
         </CardContent>
       )}
       {hasVariants && (
-        <ResponsiveTable className={classes.denseTable}>
+        <ResponsiveTable>
           <colgroup>
             <col className={classes.colGrab} />
             <col />
@@ -288,6 +284,7 @@ export const ProductVariants: React.FC<ProductVariantsProps> = props => {
             <col className={classes.colSku} />
             <col className={classes.colPrice} />
             <col className={classes.colInventory} />
+            <col className={classes.colActions} />
           </colgroup>
           <TableHead
             colSpan={numberOfColumns}

src/storybook/__snapshots__/Stories.test.ts.snap

@@ -146204,7 +146204,7 @@ Ctrl + K"
               class="ResponsiveTable-root-id"
             >
               <table
-                class="MuiTable-root-id ProductVariants-denseTable-id"
+                class="MuiTable-root-id"
               >
                 <colgroup>
                   <col
@@ -146223,6 +146223,9 @@ Ctrl + K"
                   <col
                     class="ProductVariants-colInventory-id"
                   />
+                  <col
+                    class="ProductVariants-colActions-id"
+                  />
                 </colgroup>
                 <thead
                   class="MuiTableHead-root-id"
@@ -148523,7 +148526,7 @@ Ctrl + K"
               class="ResponsiveTable-root-id"
             >
               <table
-                class="MuiTable-root-id ProductVariants-denseTable-id"
+                class="MuiTable-root-id"
               >
                 <colgroup>
                   <col
@@ -148542,6 +148545,9 @@ Ctrl + K"
                   <col
                     class="ProductVariants-colInventory-id"
                   />
+                  <col
+                    class="ProductVariants-colActions-id"
+                  />
                 </colgroup>
                 <thead
                   class="MuiTableHead-root-id"
@@ -158691,7 +158697,7 @@ Ctrl + K"
               class="ResponsiveTable-root-id"
             >
               <table
-                class="MuiTable-root-id ProductVariants-denseTable-id"
+                class="MuiTable-root-id"
               >
                 <colgroup>
                   <col
@@ -158710,6 +158716,9 @@ Ctrl + K"
                   <col
                     class="ProductVariants-colInventory-id"
                   />
+                  <col
+                    class="ProductVariants-colActions-id"
+                  />
                 </colgroup>
                 <thead
                   class="MuiTableHead-root-id"
@@ -162638,7 +162647,7 @@ Ctrl + K"
               class="ResponsiveTable-root-id"
             >
               <table
-                class="MuiTable-root-id ProductVariants-denseTable-id"
+                class="MuiTable-root-id"
               >
                 <colgroup>
                   <col
@@ -162657,6 +162666,9 @@ Ctrl + K"
                   <col
                     class="ProductVariants-colInventory-id"
                   />
+                  <col
+                    class="ProductVariants-colActions-id"
+                  />
                 </colgroup>
                 <thead
                   class="MuiTableHead-root-id"