diff --git a/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionAdminConsoleRow.tsx b/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionAdminConsoleRow.tsx
index e9f103153..38407fd98 100644
--- a/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionAdminConsoleRow.tsx
+++ b/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionAdminConsoleRow.tsx
@@ -96,10 +96,7 @@ export const OrgPermissionAdminConsoleRow = ({ isEditable, control, setValue }:
       </Tr>
       {isRowExpanded && (
         <Tr>
-          <Td
-            colSpan={3}
-            className={`bg-mineshaft-900 px-0 py-0 ${isRowExpanded && "border-mineshaft-500 p-8"}`}
-          >
+          <Td colSpan={3} className="border-mineshaft-500 bg-mineshaft-900 p-8">
             <div className="flex flex-grow flex-wrap justify-start gap-x-8 gap-y-4">
               {PERMISSION_ACTIONS.map(({ action, label }) => {
                 return (
diff --git a/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionAppConnectionRow.tsx b/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionAppConnectionRow.tsx
index 8350c3730..bce7f2403 100644
--- a/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionAppConnectionRow.tsx
+++ b/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionAppConnectionRow.tsx
@@ -146,10 +146,7 @@ export const OrgPermissionAppConnectionRow = ({ isEditable, control, setValue }:
       </Tr>
       {isRowExpanded && (
         <Tr>
-          <Td
-            colSpan={3}
-            className={`bg-mineshaft-900 px-0 py-0 ${isRowExpanded && "border-mineshaft-500 p-8"}`}
-          >
+          <Td colSpan={3} className="border-mineshaft-500 bg-mineshaft-900 p-8">
             <div className="flex flex-grow flex-wrap justify-start gap-x-8 gap-y-4">
               {PERMISSION_ACTIONS.map(({ action, label }) => {
                 return (
diff --git a/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionBillingRow.tsx b/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionBillingRow.tsx
index e8dfca206..db9d5cb54 100644
--- a/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionBillingRow.tsx
+++ b/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionBillingRow.tsx
@@ -134,10 +134,7 @@ export const OrgPermissionBillingRow = ({ isEditable, control, setValue }: Props
       </Tr>
       {isRowExpanded && (
         <Tr>
-          <Td
-            colSpan={3}
-            className={`bg-mineshaft-900 px-0 py-0 ${isRowExpanded && "border-mineshaft-500 p-8"}`}
-          >
+          <Td colSpan={3} className="border-mineshaft-500 bg-mineshaft-900 p-8">
             <div className="flex flex-grow flex-wrap justify-start gap-x-8 gap-y-4">
               {PERMISSION_ACTIONS.map(({ action, label }) => {
                 return (
diff --git a/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionGatewayRow.tsx b/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionGatewayRow.tsx
index 5b1d4e341..2c94aa6b5 100644
--- a/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionGatewayRow.tsx
+++ b/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionGatewayRow.tsx
@@ -143,10 +143,7 @@ export const OrgGatewayPermissionRow = ({ isEditable, control, setValue }: Props
       </Tr>
       {isRowExpanded && (
         <Tr>
-          <Td
-            colSpan={3}
-            className={`bg-mineshaft-900 px-0 py-0 ${isRowExpanded && "border-mineshaft-500 p-8"}`}
-          >
+          <Td colSpan={3} className="border-mineshaft-500 bg-mineshaft-900 p-8">
             <div className="flex flex-grow flex-wrap justify-start gap-x-8 gap-y-4">
               {PERMISSION_ACTIONS.map(({ action, label }) => {
                 return (
diff --git a/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionGroupRow.tsx b/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionGroupRow.tsx
index 10f0b2cd7..5f5287847 100644
--- a/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionGroupRow.tsx
+++ b/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionGroupRow.tsx
@@ -167,10 +167,7 @@ export const OrgPermissionGroupRow = ({ isEditable, control, setValue }: Props)
       </Tr>
       {isRowExpanded && (
         <Tr>
-          <Td
-            colSpan={3}
-            className={`bg-mineshaft-900 px-0 py-0 ${isRowExpanded && "border-mineshaft-500 p-8"}`}
-          >
+          <Td colSpan={3} className="border-mineshaft-500 bg-mineshaft-900 p-8">
             <div className="flex flex-grow flex-wrap justify-start gap-x-8 gap-y-4">
               {PERMISSION_ACTIONS.map(({ action, label }) => {
                 return (
diff --git a/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionIdentityRow.tsx b/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionIdentityRow.tsx
index 4fff84852..8ea639828 100644
--- a/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionIdentityRow.tsx
+++ b/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionIdentityRow.tsx
@@ -177,10 +177,7 @@ export const OrgPermissionIdentityRow = ({ isEditable, control, setValue }: Prop
       </Tr>
       {isRowExpanded && (
         <Tr>
-          <Td
-            colSpan={3}
-            className={`bg-mineshaft-900 px-0 py-0 ${isRowExpanded && "border-mineshaft-500 p-8"}`}
-          >
+          <Td colSpan={3} className="border-mineshaft-500 bg-mineshaft-900 p-8">
             <div className="flex flex-grow flex-wrap justify-start gap-x-8 gap-y-4">
               {PERMISSION_ACTIONS.map(({ action, label }) => {
                 return (
diff --git a/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionKmipRow.tsx b/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionKmipRow.tsx
index b890bd11a..28ce55803 100644
--- a/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionKmipRow.tsx
+++ b/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionKmipRow.tsx
@@ -93,10 +93,7 @@ export const OrgPermissionKmipRow = ({ isEditable, control, setValue }: Props) =
       </Tr>
       {isRowExpanded && (
         <Tr>
-          <Td
-            colSpan={3}
-            className={`bg-mineshaft-900 px-0 py-0 ${isRowExpanded && "border-mineshaft-500 p-8"}`}
-          >
+          <Td colSpan={3} className="border-mineshaft-500 bg-mineshaft-900 p-8">
             <div className="flex flex-grow flex-wrap justify-start gap-x-8 gap-y-4">
               {PERMISSION_ACTIONS.map(({ action, label }) => {
                 return (
diff --git a/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionSecretShareRow.tsx b/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionSecretShareRow.tsx
index 8cd890a36..d1b6705c7 100644
--- a/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionSecretShareRow.tsx
+++ b/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgPermissionSecretShareRow.tsx
@@ -90,10 +90,7 @@ export const OrgPermissionSecretShareRow = ({ isEditable, control, setValue }: P
       </Tr>
       {isRowExpanded && (
         <Tr>
-          <Td
-            colSpan={3}
-            className={`bg-mineshaft-900 px-0 py-0 ${isRowExpanded && "border-mineshaft-500 p-8"}`}
-          >
+          <Td colSpan={3} className="border-mineshaft-500 bg-mineshaft-900 p-8">
             <div className="flex flex-grow flex-wrap justify-start gap-x-8 gap-y-4">
               {PERMISSION_ACTIONS.map(({ action, label }) => {
                 return (
diff --git a/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgRoleWorkspaceRow.tsx b/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgRoleWorkspaceRow.tsx
index f3216b82a..2746e10bc 100644
--- a/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgRoleWorkspaceRow.tsx
+++ b/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/OrgRoleWorkspaceRow.tsx
@@ -90,10 +90,7 @@ export const OrgRoleWorkspaceRow = ({ isEditable, control, setValue }: Props) =>
       </Tr>
       {isRowExpanded && (
         <Tr>
-          <Td
-            colSpan={3}
-            className={`bg-mineshaft-900 px-0 py-0 ${isRowExpanded && "border-mineshaft-500 p-8"}`}
-          >
+          <Td colSpan={3} className="border-mineshaft-500 bg-mineshaft-900 p-8">
             <div className="flex flex-grow flex-wrap justify-start gap-x-8 gap-y-4">
               {PERMISSION_ACTIONS.map(({ action, label }) => {
                 return (
diff --git a/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/RolePermissionRow.tsx b/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/RolePermissionRow.tsx
index 853180f1b..969024c07 100644
--- a/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/RolePermissionRow.tsx
+++ b/frontend/src/pages/organization/RoleByIDPage/components/RolePermissionsSection/RolePermissionRow.tsx
@@ -180,10 +180,7 @@ export const RolePermissionRow = ({ isEditable, title, formName, control, setVal
       </Tr>
       {isRowExpanded && (
         <Tr>
-          <Td
-            colSpan={3}
-            className={`bg-mineshaft-900 px-0 py-0 ${isRowExpanded && "border-mineshaft-500 p-8"}`}
-          >
+          <Td colSpan={3} className="border-mineshaft-500 bg-mineshaft-900 p-8">
             <div className="flex flex-grow flex-wrap justify-start gap-x-8 gap-y-4">
               {getPermissionList(formName).map(({ action, label }) => {
                 return (