Fix styles in owners table

src/routes/safe/components/Settings/ManageOwners/dataFetcher.js

@@ -31,6 +31,7 @@ export const generateColumns = () => {
     disablePadding: false,
     label: 'Name',
     width: 150,
+    custom: false,
     align: 'left',
   }
 
@@ -40,6 +41,7 @@ export const generateColumns = () => {
     disablePadding: false,
     label: 'Address',
     width: 350,
+    custom: false,
     align: 'left',
   }
 
@@ -48,6 +50,7 @@ export const generateColumns = () => {
     order: false,
     disablePadding: false,
     label: '',
+    align: 'right',
     custom: true,
   }
 

src/routes/safe/components/Settings/ManageOwners/index.jsx

@@ -22,7 +22,9 @@ import Button from '~/components/layout/Button'
 import AddOwnerModal from './AddOwnerModal'
 import OwnerAddressTableCell from './OwnerAddressTableCell'
 import type { Owner } from '~/routes/safe/store/models/owner'
-import { getOwnerData, generateColumns, OWNERS_TABLE_ADDRESS_ID, type OwnerRow, } from './dataFetcher'
+import {
+  getOwnerData, generateColumns, OWNERS_TABLE_ADDRESS_ID, type OwnerRow,
+} from './dataFetcher'
 import { sm, boldFont } from '~/theme/variables'
 import { styles } from './style'
 

src/routes/safe/components/Settings/ManageOwners/style.js

@@ -11,43 +11,19 @@ export const styles = () => ({
   formContainer: {
     minHeight: '369px',
   },
-  owners: {
-    padding: lg,
-  },
-  name: {
-    textOverflow: 'ellipsis',
-    overflow: 'hidden',
-  },
-  userName: {
-    whiteSpace: 'nowrap',
-  },
-  owner: {
-    padding: md,
-    paddingLeft: lg,
-    alignItems: 'center',
-  },
-  user: {
-    justifyContent: 'left',
-  },
-  open: {
-    paddingLeft: sm,
-    width: 'auto',
+  hide: {
     '&:hover': {
-      cursor: 'pointer',
+      backgroundColor: '#fff3e2',
+    },
+    '&:hover $actions': {
+      visibility: 'initial',
+    },
+    '&:focus $actions': {
+      visibility: 'initial',
     },
   },
-  container: {
-    marginTop: xs,
-    alignItems: 'center',
-  },
-  address: {
-    paddingLeft: '6px',
-  },
-  open: {
-    paddingLeft: sm,
-    width: 'auto',
-    '&:hover': {
-      cursor: 'pointer',
-    },
+  actions: {
+    justifyContent: 'flex-end',
+    visibility: 'hidden',
   },
 })