From 3f7085fec83381b120963a75aa1748e802d430f6 Mon Sep 17 00:00:00 2001
From: Scott Aslan <scottyaslan@users.noreply.github.com>
Date: Tue, 16 Apr 2024 17:17:36 -0400
Subject: [PATCH] [NIFI-13041] update listing table column widths (#8656)

* [NIFI-13041] update listing table column widths (moreDetails)

* listing tables actions column widths

* update table columns to better fit the data

* prettier

* restore property table commented out html

* name column now 25%, more-details and actions columns fixed width, all other columns flex

* column width percenatages for clustered tables

* property table updates

This closes #8656
---
 .../policy-table/policy-table.component.html  |  2 +-
 .../policy-table/policy-table.component.scss  |  2 +-
 ...configuration-history-table.component.html |  2 +-
 ...configuration-history-table.component.scss |  5 ++-
 .../local-changes-table.html                  |  4 +-
 .../local-changes-table.scss                  | 11 +++++-
 .../manage-remote-ports.component.html        |  4 +-
 .../manage-remote-ports.component.scss        | 24 +++++++-----
 .../parameter-context-table.component.html    | 10 +++--
 .../parameter-context-table.component.scss    | 16 ++++++++
 .../parameter-table.component.html            |  2 +-
 .../parameter-table.component.scss            |  2 +-
 .../provenance-event-table.component.html     | 12 +++---
 .../provenance-event-table.component.scss     |  6 +--
 .../flowfile-table.component.html             | 12 +++---
 .../flowfile-table.component.scss             | 16 ++------
 .../flow-analysis-rule-table.component.html   |  4 +-
 .../flow-analysis-rule-table.component.scss   | 10 ++++-
 ...rameter-provider-parameters.component.html |  2 +-
 ...rameter-provider-parameters.component.scss |  5 +--
 .../parameter-groups-table.component.html     |  2 +-
 .../parameter-groups-table.component.scss     |  1 -
 .../parameter-providers-table.component.html  |  7 ++--
 .../parameter-providers-table.component.scss  | 14 ++++++-
 .../registry-client-table.component.html      |  8 ++--
 .../registry-client-table.component.scss      | 18 +++++++--
 .../reporting-task-table.component.html       |  8 ++--
 .../reporting-task-table.component.scss       | 10 ++++-
 .../connection-cluster-table.component.scss   |  3 +-
 .../port-cluster-table.component.scss         | 13 +++++--
 ...process-group-cluster-table.component.scss |  3 +-
 .../processor-cluster-table.component.scss    |  3 +-
 ...process-group-cluster-table.component.scss |  3 +-
 .../port-status-table.component.html          |  6 ++-
 .../port-status-table.component.scss          | 16 +++++++-
 .../connection-status-table.component.html    |  6 ++-
 .../connection-status-table.component.scss    |  8 ++--
 .../process-group-status-table.component.html |  4 +-
 .../process-group-status-table.component.scss |  8 ++--
 .../processor-status-table.component.html     | 15 +++++---
 .../processor-status-table.component.scss     |  8 ++--
 ...-process-group-status-table.component.html |  6 ++-
 ...-process-group-status-table.component.scss |  8 ++--
 .../user-access-policies.component.html       | 12 +++---
 .../user-access-policies.component.scss       | 11 +-----
 .../user-table/user-table.component.html      |  2 +-
 .../user-table/user-table.component.scss      |  2 +-
 .../controller-service-table.component.html   | 28 +++++++-------
 .../controller-service-table.component.scss   | 10 ++++-
 .../property-table.component.html             |  2 +-
 .../property-table.component.scss             | 10 +++++
 .../property-table.component.ts               | 38 +++++++++++++------
 .../src/assets/styles/_listing-table.scss     | 12 +-----
 53 files changed, 286 insertions(+), 170 deletions(-)

diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/access-policies/ui/common/policy-table/policy-table.component.html b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/access-policies/ui/common/policy-table/policy-table.component.html
index c515f49795..44f282f796 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/access-policies/ui/common/policy-table/policy-table.component.html
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/access-policies/ui/common/policy-table/policy-table.component.html
@@ -38,7 +38,7 @@
             <ng-container matColumnDef="actions">
                 <th mat-header-cell *matHeaderCellDef></th>
                 <td mat-cell *matCellDef="let item">
-                    <div class="flex items-center gap-x-3">
+                    <div class="flex items-center justify-end gap-x-2">
                         @if (canRemove()) {
                             <div
                                 class="pointer fa fa-trash primary-color"
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/access-policies/ui/common/policy-table/policy-table.component.scss b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/access-policies/ui/common/policy-table/policy-table.component.scss
index 4460252842..fb216bbb53 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/access-policies/ui/common/policy-table/policy-table.component.scss
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/access-policies/ui/common/policy-table/policy-table.component.scss
@@ -18,7 +18,7 @@
 .policy-table {
     .listing-table {
         .mat-column-actions {
-            width: 75px;
+            width: 32px;
         }
     }
 }
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-configuration-history/ui/flow-configuration-history-listing/flow-configuration-history-table/flow-configuration-history-table.component.html b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-configuration-history/ui/flow-configuration-history-listing/flow-configuration-history-table/flow-configuration-history-table.component.html
index e9e8b664d8..2bf66391cf 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-configuration-history/ui/flow-configuration-history-listing/flow-configuration-history-table/flow-configuration-history-table.component.html
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-configuration-history/ui/flow-configuration-history-listing/flow-configuration-history-table/flow-configuration-history-table.component.html
@@ -29,7 +29,7 @@
                 <th mat-header-cell *matHeaderCellDef></th>
                 <td mat-cell *matCellDef="let item">
                     <ng-container>
-                        <div class="flex items-center gap-x-3">
+                        <div class="flex items-center gap-x-2">
                             @if (canRead(item)) {
                                 <div
                                     class="pointer fa fa-info-circle primary-color"
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-configuration-history/ui/flow-configuration-history-listing/flow-configuration-history-table/flow-configuration-history-table.component.scss b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-configuration-history/ui/flow-configuration-history-listing/flow-configuration-history-table/flow-configuration-history-table.component.scss
index 9e842e73d7..e72e6524cb 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-configuration-history/ui/flow-configuration-history-listing/flow-configuration-history-table/flow-configuration-history-table.component.scss
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-configuration-history/ui/flow-configuration-history-listing/flow-configuration-history-table/flow-configuration-history-table.component.scss
@@ -19,7 +19,10 @@
     .listing-table {
         .mat-column-moreDetails {
             width: 32px;
-            min-width: 32px;
+        }
+
+        .mat-column-sourceName {
+            width: 25%;
         }
     }
 }
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/ui/canvas/items/flow/local-changes-dialog/local-changes-table/local-changes-table.html b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/ui/canvas/items/flow/local-changes-dialog/local-changes-table/local-changes-table.html
index 76f3839cb6..a0d5bcae59 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/ui/canvas/items/flow/local-changes-dialog/local-changes-table/local-changes-table.html
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/ui/canvas/items/flow/local-changes-dialog/local-changes-table/local-changes-table.html
@@ -66,9 +66,9 @@
                 <ng-container matColumnDef="actions">
                     <th mat-header-cell *matHeaderCellDef></th>
                     <td mat-cell *matCellDef="let item">
-                        <div class="flex items-center gap-x-3 pointer">
+                        <div class="flex items-center justify-end gap-x-2">
                             <div
-                                class="fa fa-long-arrow-right primary-color"
+                                class="pointer fa fa-long-arrow-right primary-color"
                                 title="Go To"
                                 (click)="goToClicked(item)"></div>
                         </div>
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/ui/canvas/items/flow/local-changes-dialog/local-changes-table/local-changes-table.scss b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/ui/canvas/items/flow/local-changes-dialog/local-changes-table/local-changes-table.scss
index 54460aa9c2..af9835c32d 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/ui/canvas/items/flow/local-changes-dialog/local-changes-table/local-changes-table.scss
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/ui/canvas/items/flow/local-changes-dialog/local-changes-table/local-changes-table.scss
@@ -17,9 +17,16 @@
 
 .local-changes-table {
     .listing-table {
+        .mat-column-componentName {
+            width: 230px;
+        }
+
+        .mat-column-changeType {
+            width: 230px;
+        }
+
         .mat-column-actions {
-            width: 40px;
-            min-width: 40px;
+            width: 32px;
         }
     }
 }
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/ui/manage-remote-ports/manage-remote-ports.component.html b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/ui/manage-remote-ports/manage-remote-ports.component.html
index b9c4ec2477..8b61556009 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/ui/manage-remote-ports/manage-remote-ports.component.html
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/ui/manage-remote-ports/manage-remote-ports.component.html
@@ -65,7 +65,7 @@
                                     <ng-container matColumnDef="moreDetails">
                                         <th mat-header-cell *matHeaderCellDef></th>
                                         <td mat-cell *matCellDef="let item">
-                                            <div class="flex items-center gap-x-3">
+                                            <div class="flex items-center gap-x-2">
                                                 @if (hasComments(item)) {
                                                     <div>
                                                         <div
@@ -190,7 +190,7 @@
                                     <ng-container matColumnDef="actions">
                                         <th mat-header-cell *matHeaderCellDef></th>
                                         <td mat-cell *matCellDef="let port">
-                                            <div class="flex items-center gap-x-3">
+                                            <div class="flex items-center justify-end gap-x-2">
                                                 @if (
                                                     port.exists === true &&
                                                     port.connected === true &&
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/ui/manage-remote-ports/manage-remote-ports.component.scss b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/ui/manage-remote-ports/manage-remote-ports.component.scss
index c998c77801..3b817678a3 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/ui/manage-remote-ports/manage-remote-ports.component.scss
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/ui/manage-remote-ports/manage-remote-ports.component.scss
@@ -21,18 +21,22 @@
     line-height: normal;
 }
 
-.manage-remote-ports-table.listing-table {
-    @include mat.table-density(-4);
+.manage-remote-ports-table {
+    .listing-table {
+        @include mat.table-density(-4);
 
-    table {
-        .mat-column-moreDetails {
-            width: 32px;
-            min-width: 32px;
-        }
+        table {
+            .mat-column-moreDetails {
+                width: 52px;
+            }
 
-        .mat-column-actions {
-            width: 75px;
-            min-width: 75px;
+            .mat-column-name {
+                width: 25%;
+            }
+
+            .mat-column-actions {
+                width: 52px;
+            }
         }
     }
 }
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/parameter-contexts/ui/parameter-context-listing/parameter-context-table/parameter-context-table.component.html b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/parameter-contexts/ui/parameter-context-listing/parameter-context-table/parameter-context-table.component.html
index 50364177c5..8ac3a57ea3 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/parameter-contexts/ui/parameter-context-listing/parameter-context-table/parameter-context-table.component.html
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/parameter-contexts/ui/parameter-context-listing/parameter-context-table/parameter-context-table.component.html
@@ -15,7 +15,7 @@
   ~ limitations under the License.
   -->
 
-<div class="relative h-full">
+<div class="parameter-context-table relative h-full">
     <div class="listing-table absolute inset-0 overflow-y-auto">
         <table
             mat-table
@@ -30,7 +30,7 @@
                 <th mat-header-cell *matHeaderCellDef></th>
                 <td mat-cell *matCellDef="let item">
                     @if (canRead(item)) {
-                        <div class="flex items-center gap-x-3">
+                        <div class="flex items-center gap-x-2">
                             <!-- TODO - handle read only in configure component? -->
                             @if (canRead(item)) {
                                 <div class="pointer fa fa-info-circle primary-color"></div>
@@ -44,7 +44,9 @@
             <ng-container matColumnDef="name">
                 <th mat-header-cell *matHeaderCellDef mat-sort-header>Name</th>
                 <td mat-cell *matCellDef="let item">
-                    <div [ngClass]="{ unset: !canRead(item), 'nifi-surface-default': !canRead(item) }">
+                    <div
+                        [ngClass]="{ unset: !canRead(item), 'nifi-surface-default': !canRead(item) }"
+                        class="overflow-hidden overflow-ellipsis whitespace-nowrap">
                         {{ formatName(item) }}
                     </div>
                 </td>
@@ -70,7 +72,7 @@
             <ng-container matColumnDef="actions">
                 <th mat-header-cell *matHeaderCellDef></th>
                 <td mat-cell *matCellDef="let item">
-                    <div class="flex items-center gap-x-3">
+                    <div class="flex items-center justify-end gap-x-2">
                         @if (canRead(item) && canWrite(item)) {
                             <div
                                 class="pointer fa fa-pencil primary-color"
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/parameter-contexts/ui/parameter-context-listing/parameter-context-table/parameter-context-table.component.scss b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/parameter-contexts/ui/parameter-context-listing/parameter-context-table/parameter-context-table.component.scss
index 2944f98194..723f1dae30 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/parameter-contexts/ui/parameter-context-listing/parameter-context-table/parameter-context-table.component.scss
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/parameter-contexts/ui/parameter-context-listing/parameter-context-table/parameter-context-table.component.scss
@@ -14,3 +14,19 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+
+.parameter-context-table {
+    .listing-table {
+        .mat-column-moreDetails {
+            width: 32px;
+        }
+
+        .mat-column-name {
+            width: 25%;
+        }
+
+        .mat-column-actions {
+            width: 96px;
+        }
+    }
+}
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/parameter-contexts/ui/parameter-context-listing/parameter-table/parameter-table.component.html b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/parameter-contexts/ui/parameter-context-listing/parameter-table/parameter-table.component.html
index 28fae98e18..688c3edc00 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/parameter-contexts/ui/parameter-context-listing/parameter-table/parameter-table.component.html
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/parameter-contexts/ui/parameter-context-listing/parameter-table/parameter-table.component.html
@@ -95,7 +95,7 @@
                     <ng-container matColumnDef="actions">
                         <th mat-header-cell *matHeaderCellDef></th>
                         <td mat-cell *matCellDef="let item">
-                            <div class="flex items-center gap-x-3">
+                            <div class="flex items-center justify-end gap-x-2">
                                 @if (canGoToParameter(item)) {
                                     <div
                                         class="pointer fa fa-long-arrow-right primary-color"
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/parameter-contexts/ui/parameter-context-listing/parameter-table/parameter-table.component.scss b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/parameter-contexts/ui/parameter-context-listing/parameter-table/parameter-table.component.scss
index a4de7a5698..2499fddf90 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/parameter-contexts/ui/parameter-context-listing/parameter-table/parameter-table.component.scss
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/parameter-contexts/ui/parameter-context-listing/parameter-table/parameter-table.component.scss
@@ -23,7 +23,7 @@
 
         table {
             .mat-column-actions {
-                width: 75px;
+                width: 74px;
             }
         }
     }
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/provenance/ui/provenance-event-listing/provenance-event-table/provenance-event-table.component.html b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/provenance/ui/provenance-event-listing/provenance-event-table/provenance-event-table.component.html
index 308f48489e..2d07bcfef9 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/provenance/ui/provenance-event-listing/provenance-event-table/provenance-event-table.component.html
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/provenance/ui/provenance-event-listing/provenance-event-table/provenance-event-table.component.html
@@ -76,10 +76,12 @@
                     <ng-container matColumnDef="moreDetails">
                         <th mat-header-cell *matHeaderCellDef></th>
                         <td mat-cell *matCellDef="let item">
-                            <div
-                                class="pointer fa fa-info-circle primary-color"
-                                title="View Details"
-                                (click)="viewDetailsClicked(item)"></div>
+                            <div class="flex items-center gap-x-2">
+                                <div
+                                    class="pointer fa fa-info-circle primary-color"
+                                    title="View Details"
+                                    (click)="viewDetailsClicked(item)"></div>
+                            </div>
                         </td>
                     </ng-container>
 
@@ -145,7 +147,7 @@
                     <ng-container matColumnDef="actions">
                         <th mat-header-cell *matHeaderCellDef></th>
                         <td mat-cell *matCellDef="let item">
-                            <div class="flex items-center gap-x-3">
+                            <div class="flex items-center justify-end gap-x-2">
                                 <div
                                     class="pointer icon icon-lineage primary-color"
                                     (click)="showLineageGraph(item)"
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/provenance/ui/provenance-event-listing/provenance-event-table/provenance-event-table.component.scss b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/provenance/ui/provenance-event-listing/provenance-event-table/provenance-event-table.component.scss
index 8646fa07ab..5e515cc2e7 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/provenance/ui/provenance-event-listing/provenance-event-table/provenance-event-table.component.scss
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/provenance/ui/provenance-event-listing/provenance-event-table/provenance-event-table.component.scss
@@ -19,13 +19,11 @@
     .listing-table {
         table {
             .mat-column-moreDetails {
-                min-width: 50px;
-                width: 50px;
+                width: 32px;
             }
 
             .mat-column-actions {
-                min-width: 50px;
-                width: 50px;
+                width: 52px;
             }
         }
     }
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/queue/ui/queue-listing/flowfile-table/flowfile-table.component.html b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/queue/ui/queue-listing/flowfile-table/flowfile-table.component.html
index 9fd134b593..db8fd0be81 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/queue/ui/queue-listing/flowfile-table/flowfile-table.component.html
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/queue/ui/queue-listing/flowfile-table/flowfile-table.component.html
@@ -45,10 +45,12 @@
                 <ng-container matColumnDef="moreDetails">
                     <th mat-header-cell *matHeaderCellDef></th>
                     <td mat-cell *matCellDef="let item">
-                        <div
-                            class="pointer fa fa-info-circle primary-color"
-                            title="View Details"
-                            (click)="viewFlowFileClicked(item)"></div>
+                        <div class="flex items-center gap-x-2">
+                            <div
+                                class="pointer fa fa-info-circle primary-color"
+                                title="View Details"
+                                (click)="viewFlowFileClicked(item)"></div>
+                        </div>
                     </td>
                 </ng-container>
 
@@ -122,7 +124,7 @@
                 <ng-container matColumnDef="actions">
                     <th mat-header-cell *matHeaderCellDef></th>
                     <td mat-cell *matCellDef="let item">
-                        <div class="flex items-center gap-x-3">
+                        <div class="flex items-center justify-end gap-x-2">
                             @if (item.size > 0) {
                                 <div
                                     class="pointer fa fa-download primary-color"
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/queue/ui/queue-listing/flowfile-table/flowfile-table.component.scss b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/queue/ui/queue-listing/flowfile-table/flowfile-table.component.scss
index 29464f3954..fca7d08bf7 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/queue/ui/queue-listing/flowfile-table/flowfile-table.component.scss
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/queue/ui/queue-listing/flowfile-table/flowfile-table.component.scss
@@ -19,23 +19,15 @@
     .listing-table {
         table {
             .mat-column-moreDetails {
-                min-width: 50px;
-                width: 50px;
+                width: 32px;
             }
 
-            .mat-column-position {
-                min-width: 75px;
-                width: 75px;
-            }
-
-            .mat-column-penalized {
-                min-width: 85px;
-                width: 85px;
+            .mat-column-flowFileUuid {
+                width: 25%;
             }
 
             .mat-column-actions {
-                min-width: 100px;
-                width: 100px;
+                width: 74px;
             }
         }
     }
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/flow-analysis-rules/flow-analysis-rule-table/flow-analysis-rule-table.component.html b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/flow-analysis-rules/flow-analysis-rule-table/flow-analysis-rule-table.component.html
index e7ea6e53dc..813825f463 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/flow-analysis-rules/flow-analysis-rule-table/flow-analysis-rule-table.component.html
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/flow-analysis-rules/flow-analysis-rule-table/flow-analysis-rule-table.component.html
@@ -30,7 +30,7 @@
                 <th mat-header-cell *matHeaderCellDef></th>
                 <td mat-cell *matCellDef="let item">
                     @if (canRead(item)) {
-                        <div class="flex items-center gap-x-3">
+                        <div class="flex items-center gap-x-2">
                             <div
                                 class="pointer fa fa-book primary-color"
                                 (click)="viewDocumentationClicked(item, $event)"
@@ -121,7 +121,7 @@
             <ng-container matColumnDef="actions">
                 <th mat-header-cell *matHeaderCellDef></th>
                 <td mat-cell *matCellDef="let item">
-                    <div class="flex items-center gap-x-3">
+                    <div class="flex items-center justify-end gap-x-2">
                         @if (canConfigure(item)) {
                             <div
                                 class="pointer fa fa-cog primary-color"
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/flow-analysis-rules/flow-analysis-rule-table/flow-analysis-rule-table.component.scss b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/flow-analysis-rules/flow-analysis-rule-table/flow-analysis-rule-table.component.scss
index 0934915f54..2dca1f222b 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/flow-analysis-rules/flow-analysis-rule-table/flow-analysis-rule-table.component.scss
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/flow-analysis-rules/flow-analysis-rule-table/flow-analysis-rule-table.component.scss
@@ -19,7 +19,15 @@
     .listing-table {
         table {
             .mat-column-moreDetails {
-                min-width: 100px;
+                width: 96px;
+            }
+
+            .mat-column-name {
+                width: 25%;
+            }
+
+            .mat-column-actions {
+                width: 140px;
             }
         }
     }
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/parameter-providers/fetch-parameter-provider-parameters/fetch-parameter-provider-parameters.component.html b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/parameter-providers/fetch-parameter-provider-parameters/fetch-parameter-provider-parameters.component.html
index de5bff1f41..740e98b6ae 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/parameter-providers/fetch-parameter-provider-parameters/fetch-parameter-provider-parameters.component.html
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/parameter-providers/fetch-parameter-provider-parameters/fetch-parameter-provider-parameters.component.html
@@ -253,7 +253,7 @@
                                                     <ng-container matColumnDef="indicators">
                                                         <th mat-header-cell *matHeaderCellDef></th>
                                                         <td mat-cell *matCellDef="let item">
-                                                            <div class="flex items-center gap-x-3 justify-end">
+                                                            <div class="flex items-center gap-x-2 justify-end">
                                                                 <div
                                                                     class="fa fa-hashtag primary-color"
                                                                     title="Parameter is currently referenced by a property. The sensitivity cannot be changed."
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/parameter-providers/fetch-parameter-provider-parameters/fetch-parameter-provider-parameters.component.scss b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/parameter-providers/fetch-parameter-provider-parameters/fetch-parameter-provider-parameters.component.scss
index f427c8f81f..bfa0c5ca06 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/parameter-providers/fetch-parameter-provider-parameters/fetch-parameter-provider-parameters.component.scss
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/parameter-providers/fetch-parameter-provider-parameters/fetch-parameter-provider-parameters.component.scss
@@ -37,11 +37,10 @@
     .listing-table {
         .mat-column-sensitive {
             width: 32px;
-            min-width: 32px;
         }
+
         .mat-column-indicators {
-            width: 48px;
-            min-width: 48px;
+            width: 52px;
         }
     }
 }
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/parameter-providers/fetch-parameter-provider-parameters/parameter-groups-table/parameter-groups-table.component.html b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/parameter-providers/fetch-parameter-provider-parameters/parameter-groups-table/parameter-groups-table.component.html
index ea13206db4..e25fef3c12 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/parameter-providers/fetch-parameter-provider-parameters/parameter-groups-table/parameter-groups-table.component.html
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/parameter-providers/fetch-parameter-provider-parameters/parameter-groups-table/parameter-groups-table.component.html
@@ -36,7 +36,7 @@
                 <ng-container matColumnDef="indicators">
                     <th mat-header-cell *matHeaderCellDef></th>
                     <td mat-cell *matCellDef="let item">
-                        <div class="flex items-center gap-x-3">
+                        <div class="flex items-center gap-x-2">
                             @if (isSyncedToParameterContext(item)) {
                                 <div class="fa fa-star primary-color" title="Synced to a parameter context."></div>
                             }
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/parameter-providers/fetch-parameter-provider-parameters/parameter-groups-table/parameter-groups-table.component.scss b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/parameter-providers/fetch-parameter-provider-parameters/parameter-groups-table/parameter-groups-table.component.scss
index bf3d1a6f20..088527b977 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/parameter-providers/fetch-parameter-provider-parameters/parameter-groups-table/parameter-groups-table.component.scss
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/parameter-providers/fetch-parameter-provider-parameters/parameter-groups-table/parameter-groups-table.component.scss
@@ -19,7 +19,6 @@
     .listing-table {
         .mat-column-indicators {
             width: 32px;
-            min-width: 32px;
         }
     }
 }
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/parameter-providers/parameter-providers-table/parameter-providers-table.component.html b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/parameter-providers/parameter-providers-table/parameter-providers-table.component.html
index 6ab8237df8..a7d2165844 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/parameter-providers/parameter-providers-table/parameter-providers-table.component.html
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/parameter-providers/parameter-providers-table/parameter-providers-table.component.html
@@ -32,7 +32,7 @@
                         <th mat-header-cell *matHeaderCellDef></th>
                         <td mat-cell *matCellDef="let item">
                             @if (canRead(item)) {
-                                <div class="flex items-center gap-x-3">
+                                <div class="flex items-center gap-x-2">
                                     <!-- TODO: open details -->
                                     <div class="pointer fa fa-info-circle primary-color" title="View details"></div>
 
@@ -67,7 +67,8 @@
                                 [ngClass]="{
                                     unset: !canRead(item),
                                     'nifi-surface-default': !canRead(item)
-                                }">
+                                }"
+                                class="overflow-hidden overflow-ellipsis whitespace-nowrap">
                                 {{ formatName(item) }}
                             </div>
                         </td>
@@ -96,7 +97,7 @@
                     <ng-container matColumnDef="actions">
                         <th mat-header-cell *matHeaderCellDef></th>
                         <td mat-cell *matCellDef="let item">
-                            <div class="flex items-center gap-x-3">
+                            <div class="flex items-center justify-end gap-x-2">
                                 @if (canConfigure(item)) {
                                     <div
                                         class="pointer fa fa-cog primary-color"
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/parameter-providers/parameter-providers-table/parameter-providers-table.component.scss b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/parameter-providers/parameter-providers-table/parameter-providers-table.component.scss
index e44f2b386a..5ef42309c2 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/parameter-providers/parameter-providers-table/parameter-providers-table.component.scss
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/parameter-providers/parameter-providers-table/parameter-providers-table.component.scss
@@ -17,6 +17,18 @@
 
 .parameter-providers-table {
     .listing-table {
-        // overrides to the listing-table styles go here
+        table {
+            .mat-column-moreDetails {
+                width: 82px;
+            }
+
+            .mat-column-name {
+                width: 25%;
+            }
+
+            .mat-column-actions {
+                width: 118px;
+            }
+        }
     }
 }
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/registry-clients/registry-client-table/registry-client-table.component.html b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/registry-clients/registry-client-table/registry-client-table.component.html
index 2423a43001..8fb199052a 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/registry-clients/registry-client-table/registry-client-table.component.html
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/registry-clients/registry-client-table/registry-client-table.component.html
@@ -15,8 +15,8 @@
   ~ limitations under the License.
   -->
 
-<div class="relative h-full">
-    <div class="registry-client-table listing-table absolute inset-0 overflow-y-auto">
+<div class="registry-client-table relative h-full">
+    <div class="listing-table absolute inset-0 overflow-y-auto">
         <table
             mat-table
             [dataSource]="dataSource"
@@ -30,7 +30,7 @@
                 <th mat-header-cell *matHeaderCellDef></th>
                 <td mat-cell *matCellDef="let item">
                     @if (canRead(item)) {
-                        <div class="flex items-center">
+                        <div class="flex items-center gap-x-2">
                             <!-- TODO - handle read only in configure component? -->
                             @if (hasErrors(item)) {
                                 <div
@@ -99,7 +99,7 @@
             <ng-container matColumnDef="actions">
                 <th mat-header-cell *matHeaderCellDef></th>
                 <td mat-cell *matCellDef="let item">
-                    <div class="flex items-center gap-x-3">
+                    <div class="flex items-center justify-end gap-x-2">
                         @if (canConfigure(item)) {
                             <div
                                 class="pointer fa fa-cog primary-color"
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/registry-clients/registry-client-table/registry-client-table.component.scss b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/registry-clients/registry-client-table/registry-client-table.component.scss
index 114fe2647a..e0d08fd31e 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/registry-clients/registry-client-table/registry-client-table.component.scss
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/registry-clients/registry-client-table/registry-client-table.component.scss
@@ -15,10 +15,20 @@
  * limitations under the License.
  */
 
-.registry-client-table.listing-table {
-    table {
-        .mat-column-moreDetails {
-            min-width: 100px;
+.registry-client-table {
+    .listing-table {
+        table {
+            .mat-column-moreDetails {
+                width: 52px;
+            }
+
+            .mat-column-name {
+                width: 25%;
+            }
+
+            .mat-column-actions {
+                width: 52px;
+            }
         }
     }
 }
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/reporting-tasks/reporting-task-table/reporting-task-table.component.html b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/reporting-tasks/reporting-task-table/reporting-task-table.component.html
index 8b22b12092..abe91ebdf0 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/reporting-tasks/reporting-task-table/reporting-task-table.component.html
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/reporting-tasks/reporting-task-table/reporting-task-table.component.html
@@ -30,7 +30,7 @@
                 <th mat-header-cell *matHeaderCellDef></th>
                 <td mat-cell *matCellDef="let item">
                     @if (canRead(item)) {
-                        <div class="flex items-center gap-x-3">
+                        <div class="flex items-center gap-x-2">
                             <div
                                 class="pointer fa fa-book primary-color"
                                 (click)="viewDocumentationClicked(item, $event)"
@@ -75,7 +75,9 @@
             <ng-container matColumnDef="name">
                 <th mat-header-cell *matHeaderCellDef mat-sort-header>Name</th>
                 <td mat-cell *matCellDef="let item">
-                    <div [ngClass]="{ unset: !canRead(item), 'nifi-surface-default': !canRead(item) }">
+                    <div
+                        [ngClass]="{ unset: !canRead(item), 'nifi-surface-default': !canRead(item) }"
+                        class="overflow-hidden overflow-ellipsis whitespace-nowrap">
                         {{ formatName(item) }}
                     </div>
                 </td>
@@ -115,7 +117,7 @@
             <ng-container matColumnDef="actions">
                 <th mat-header-cell *matHeaderCellDef></th>
                 <td mat-cell *matCellDef="let item">
-                    <div class="flex items-center gap-x-3">
+                    <div class="flex items-center justify-end gap-x-2">
                         @if (canStop(item)) {
                             <div
                                 class="pointer fa fa-stop primary-color"
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/reporting-tasks/reporting-task-table/reporting-task-table.component.scss b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/reporting-tasks/reporting-task-table/reporting-task-table.component.scss
index 6411871761..4b839a98d7 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/reporting-tasks/reporting-task-table/reporting-task-table.component.scss
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/reporting-tasks/reporting-task-table/reporting-task-table.component.scss
@@ -18,7 +18,15 @@
 .reporting-task-table.listing-table {
     table {
         .mat-column-moreDetails {
-            min-width: 100px;
+            width: 96px;
+        }
+
+        .mat-column-name {
+            width: 25%;
+        }
+
+        .mat-column-actions {
+            width: 140px; // only 6 of the 8 action icons can be present at the same time
         }
     }
 }
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/common/cluster-summary-dialog/connection-cluster-table/connection-cluster-table.component.scss b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/common/cluster-summary-dialog/connection-cluster-table/connection-cluster-table.component.scss
index 27adcfd59f..748e8b96c6 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/common/cluster-summary-dialog/connection-cluster-table/connection-cluster-table.component.scss
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/common/cluster-summary-dialog/connection-cluster-table/connection-cluster-table.component.scss
@@ -18,8 +18,7 @@
 .connection-cluster-table {
     .listing-table {
         .mat-column-node {
-            min-width: 200px;
-            width: 30%;
+            width: 25%;
         }
     }
 }
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/common/cluster-summary-dialog/port-cluster-table/port-cluster-table.component.scss b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/common/cluster-summary-dialog/port-cluster-table/port-cluster-table.component.scss
index 4faf9cf6eb..8824816e02 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/common/cluster-summary-dialog/port-cluster-table/port-cluster-table.component.scss
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/common/cluster-summary-dialog/port-cluster-table/port-cluster-table.component.scss
@@ -17,9 +17,16 @@
 
 .port-cluster-table {
     .listing-table {
-        .mat-column-node {
-            min-width: 200px;
-            width: 50%;
+        .mat-column-runStatus {
+            width: 15%;
+        }
+
+        .mat-column-in {
+            width: 15%;
+        }
+
+        .mat-column-out {
+            width: 15%;
         }
     }
 }
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/common/cluster-summary-dialog/process-group-cluster-table/process-group-cluster-table.component.scss b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/common/cluster-summary-dialog/process-group-cluster-table/process-group-cluster-table.component.scss
index d036e5605f..d9e55a1d64 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/common/cluster-summary-dialog/process-group-cluster-table/process-group-cluster-table.component.scss
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/common/cluster-summary-dialog/process-group-cluster-table/process-group-cluster-table.component.scss
@@ -18,8 +18,7 @@
 .process-group-cluster-table {
     .listing-table {
         .mat-column-node {
-            min-width: 200px;
-            width: 30%;
+            width: 25%;
         }
     }
 }
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/common/cluster-summary-dialog/processor-cluster-table/processor-cluster-table.component.scss b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/common/cluster-summary-dialog/processor-cluster-table/processor-cluster-table.component.scss
index 9761a92602..c4c1708de1 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/common/cluster-summary-dialog/processor-cluster-table/processor-cluster-table.component.scss
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/common/cluster-summary-dialog/processor-cluster-table/processor-cluster-table.component.scss
@@ -18,8 +18,7 @@
 .processor-cluster-table {
     .listing-table {
         .mat-column-node {
-            min-width: 200px;
-            width: 30%;
+            width: 25%;
         }
     }
 }
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/common/cluster-summary-dialog/remote-process-group-cluster-table/remote-process-group-cluster-table.component.scss b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/common/cluster-summary-dialog/remote-process-group-cluster-table/remote-process-group-cluster-table.component.scss
index ca0c3bcbc9..a75c9efe86 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/common/cluster-summary-dialog/remote-process-group-cluster-table/remote-process-group-cluster-table.component.scss
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/common/cluster-summary-dialog/remote-process-group-cluster-table/remote-process-group-cluster-table.component.scss
@@ -18,8 +18,7 @@
 .remote-process-group-cluster-table {
     .listing-table {
         .mat-column-node {
-            min-width: 200px;
-            width: 30%;
+            width: 25%;
         }
     }
 }
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/common/port-status-table/port-status-table.component.html b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/common/port-status-table/port-status-table.component.html
index cea9d57082..4555af4774 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/common/port-status-table/port-status-table.component.html
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/common/port-status-table/port-status-table.component.html
@@ -42,7 +42,9 @@
                             <!-- More Details Column -->
                             <ng-container matColumnDef="moreDetails">
                                 <th mat-header-cell *matHeaderCellDef></th>
-                                <td mat-cell *matCellDef="let item"></td>
+                                <td mat-cell *matCellDef="let item">
+                                    <div class="flex items-center gap-x-2"></div>
+                                </td>
                             </ng-container>
 
                             <!-- Name Column -->
@@ -140,7 +142,7 @@
                             <ng-container matColumnDef="actions">
                                 <th mat-header-cell *matHeaderCellDef></th>
                                 <td mat-cell *matCellDef="let item">
-                                    <div class="flex items-center gap-x-3">
+                                    <div class="flex items-center justify-end gap-x-2">
                                         <div
                                             class="pointer fa fa-long-arrow-right primary-color"
                                             [routerLink]="getPortLink(item)"
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/common/port-status-table/port-status-table.component.scss b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/common/port-status-table/port-status-table.component.scss
index 4dbbdf8978..fb376e1482 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/common/port-status-table/port-status-table.component.scss
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/common/port-status-table/port-status-table.component.scss
@@ -22,9 +22,21 @@
             min-width: 32px;
         }
 
+        .mat-column-runStatus {
+            width: 20%;
+        }
+
+        .mat-column-in {
+            width: 20%;
+        }
+
+        .mat-column-out {
+            width: 20%;
+        }
+
         .mat-column-actions {
-            width: 80px;
-            min-width: 80px;
+            width: 52px;
+            min-width: 52px;
         }
     }
 }
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/connection-status-listing/connection-status-table/connection-status-table.component.html b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/connection-status-listing/connection-status-table/connection-status-table.component.html
index 9893020bcb..6ea11089ca 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/connection-status-listing/connection-status-table/connection-status-table.component.html
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/connection-status-listing/connection-status-table/connection-status-table.component.html
@@ -43,7 +43,9 @@
                             <!-- More Details Column -->
                             <ng-container matColumnDef="moreDetails">
                                 <th mat-header-cell *matHeaderCellDef></th>
-                                <td mat-cell *matCellDef="let item"></td>
+                                <td mat-cell *matCellDef="let item">
+                                    <div class="flex items-center gap-x-2"></div>
+                                </td>
                             </ng-container>
 
                             <!-- Name Column -->
@@ -204,7 +206,7 @@
                             <ng-container matColumnDef="actions">
                                 <th mat-header-cell *matHeaderCellDef></th>
                                 <td mat-cell *matCellDef="let item">
-                                    <div class="flex items-center gap-x-3">
+                                    <div class="flex items-center justify-end gap-x-2">
                                         <div
                                             class="pointer fa fa-long-arrow-right primary-color"
                                             [routerLink]="getConnectionLink(item)"
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/connection-status-listing/connection-status-table/connection-status-table.component.scss b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/connection-status-listing/connection-status-table/connection-status-table.component.scss
index f6ac47ab86..85e07ce9f0 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/connection-status-listing/connection-status-table/connection-status-table.component.scss
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/connection-status-listing/connection-status-table/connection-status-table.component.scss
@@ -19,12 +19,14 @@
     .listing-table {
         .mat-column-moreDetails {
             width: 32px;
-            min-width: 32px;
+        }
+
+        .mat-column-name {
+            width: 25%;
         }
 
         .mat-column-actions {
-            width: 80px;
-            min-width: 80px;
+            width: 74px;
         }
     }
 }
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/process-group-status-listing/process-group-status-table/process-group-status-table.component.html b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/process-group-status-listing/process-group-status-table/process-group-status-table.component.html
index a7b4494bb0..aed52d0114 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/process-group-status-listing/process-group-status-table/process-group-status-table.component.html
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/process-group-status-listing/process-group-status-table/process-group-status-table.component.html
@@ -44,7 +44,7 @@
                                 <th mat-header-cell *matHeaderCellDef></th>
                                 <td mat-cell *matCellDef="let item">
                                     @if (canRead(item)) {
-                                        <div class="flex items-center gap-x-3">
+                                        <div class="flex items-center gap-x-2">
                                             <!-- TODO - handle read only in configure component? -->
                                             @if (canRead(item)) {
                                                 <div
@@ -330,7 +330,7 @@
                             <ng-container matColumnDef="actions">
                                 <th mat-header-cell *matHeaderCellDef></th>
                                 <td mat-cell *matCellDef="let item">
-                                    <div class="flex items-center gap-x-3">
+                                    <div class="flex items-center justify-end gap-x-2">
                                         <div
                                             class="pointer fa fa-long-arrow-right primary-color"
                                             [routerLink]="getProcessGroupLink(item)"
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/process-group-status-listing/process-group-status-table/process-group-status-table.component.scss b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/process-group-status-listing/process-group-status-table/process-group-status-table.component.scss
index ece5fddef0..d59a0c21c5 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/process-group-status-listing/process-group-status-table/process-group-status-table.component.scss
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/process-group-status-listing/process-group-status-table/process-group-status-table.component.scss
@@ -19,12 +19,14 @@
     .listing-table {
         .mat-column-moreDetails {
             width: 32px;
-            min-width: 32px;
+        }
+
+        .mat-column-name {
+            width: 25%;
         }
 
         .mat-column-actions {
-            width: 80px;
-            min-width: 80px;
+            width: 74px;
         }
     }
 }
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/processor-status-listing/processor-status-table/processor-status-table.component.html b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/processor-status-listing/processor-status-table/processor-status-table.component.html
index a71f5e6082..e37ecc06f4 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/processor-status-listing/processor-status-table/processor-status-table.component.html
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/processor-status-listing/processor-status-table/processor-status-table.component.html
@@ -44,7 +44,7 @@
                                 <th mat-header-cell *matHeaderCellDef></th>
                                 <td mat-cell *matCellDef="let item">
                                     @if (canRead(item)) {
-                                        <div class="flex items-center gap-x-3">
+                                        <div class="flex items-center gap-x-2">
                                             <!-- TODO - handle read only in configure component? -->
                                             @if (canRead(item)) {
                                                 <div
@@ -70,7 +70,9 @@
                                                 P
                                             </div>
                                         }
-                                        <div>{{ formatName(item) }}</div>
+                                        <div class="flex-1 overflow-ellipsis overflow-hidden whitespace-nowrap">
+                                            {{ formatName(item) }}
+                                        </div>
                                     </div>
                                 </td>
                             </ng-container>
@@ -81,7 +83,9 @@
                                     <div class="flex-1 overflow-ellipsis overflow-hidden whitespace-nowrap">Type</div>
                                 </th>
                                 <td mat-cell *matCellDef="let item" [title]="formatType(item)">
-                                    {{ formatType(item) }}
+                                    <div class="flex-1 overflow-ellipsis overflow-hidden whitespace-nowrap">
+                                        {{ formatType(item) }}
+                                    </div>
                                 </td>
                             </ng-container>
 
@@ -101,8 +105,7 @@
                             <ng-container matColumnDef="runStatus">
                                 <th mat-header-cell *matHeaderCellDef mat-sort-header>Run Status</th>
                                 <td mat-cell *matCellDef="let item">
-                                    <div
-                                        class="inline-block overflow-hidden overflow-ellipsis whitespace-nowrap space-x-1.5 align-middle">
+                                    <div class="inline-block space-x-1.5 align-middle">
                                         <span [ngClass]="getRunStatusIcon(item)"></span>
                                         <span [title]="formatRunStatus(item)">{{ formatRunStatus(item) }}</span>
 
@@ -246,7 +249,7 @@
                             <ng-container matColumnDef="actions">
                                 <th mat-header-cell *matHeaderCellDef></th>
                                 <td mat-cell *matCellDef="let item">
-                                    <div class="flex items-center gap-x-3">
+                                    <div class="flex items-center justify-end gap-x-2">
                                         <div
                                             class="pointer fa fa-long-arrow-right primary-color"
                                             [routerLink]="getProcessorLink(item)"
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/processor-status-listing/processor-status-table/processor-status-table.component.scss b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/processor-status-listing/processor-status-table/processor-status-table.component.scss
index e4f2e7fc8d..84dff1ed9e 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/processor-status-listing/processor-status-table/processor-status-table.component.scss
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/processor-status-listing/processor-status-table/processor-status-table.component.scss
@@ -18,12 +18,14 @@
     .listing-table {
         .mat-column-moreDetails {
             width: 32px;
-            min-width: 32px;
+        }
+
+        .mat-column-name {
+            width: 25%;
         }
 
         .mat-column-actions {
-            width: 80px;
-            min-width: 80px;
+            width: 74px;
         }
     }
     .primary-node-only {
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/remote-process-group-status-listing/remote-process-group-status-table/remote-process-group-status-table.component.html b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/remote-process-group-status-listing/remote-process-group-status-table/remote-process-group-status-table.component.html
index 16b02a7973..7ea2730aa4 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/remote-process-group-status-listing/remote-process-group-status-table/remote-process-group-status-table.component.html
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/remote-process-group-status-listing/remote-process-group-status-table/remote-process-group-status-table.component.html
@@ -43,7 +43,9 @@
                             <!-- More Details Column -->
                             <ng-container matColumnDef="moreDetails">
                                 <th mat-header-cell *matHeaderCellDef></th>
-                                <td mat-cell *matCellDef="let item"></td>
+                                <td mat-cell *matCellDef="let item">
+                                    <div class="flex items-center gap-x-2"></div>
+                                </td>
                             </ng-container>
 
                             <!-- Name Column -->
@@ -146,7 +148,7 @@
                             <ng-container matColumnDef="actions">
                                 <th mat-header-cell *matHeaderCellDef></th>
                                 <td mat-cell *matCellDef="let item">
-                                    <div class="flex items-center gap-x-3">
+                                    <div class="flex items-center justify-end gap-x-2">
                                         <div
                                             class="pointer fa fa-long-arrow-right primary-color"
                                             [routerLink]="getRemoteProcessGroupLink(item)"
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/remote-process-group-status-listing/remote-process-group-status-table/remote-process-group-status-table.component.scss b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/remote-process-group-status-listing/remote-process-group-status-table/remote-process-group-status-table.component.scss
index 80086e7ca0..eaa2e38a5f 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/remote-process-group-status-listing/remote-process-group-status-table/remote-process-group-status-table.component.scss
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/remote-process-group-status-listing/remote-process-group-status-table/remote-process-group-status-table.component.scss
@@ -19,12 +19,14 @@
     .listing-table {
         .mat-column-moreDetails {
             width: 32px;
-            min-width: 32px;
+        }
+
+        .mat-column-name {
+            width: 25%;
         }
 
         .mat-column-actions {
-            width: 80px;
-            min-width: 80px;
+            width: 74px;
         }
     }
 }
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/users/ui/user-listing/user-access-policies/user-access-policies.component.html b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/users/ui/user-listing/user-access-policies/user-access-policies.component.html
index 3a1cc525f0..52b6b3120f 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/users/ui/user-listing/user-access-policies/user-access-policies.component.html
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/users/ui/user-listing/user-access-policies/user-access-policies.component.html
@@ -60,11 +60,13 @@
                             <th mat-header-cell *matHeaderCellDef></th>
                             <td mat-cell *matCellDef="let item">
                                 @if (canGoToPolicyTarget(item)) {
-                                    <div
-                                        class="pointer fa fa-long-arrow-right primary-color"
-                                        [routerLink]="getPolicyTargetLink(item)"
-                                        mat-dialog-close="ROUTED"
-                                        title="Go to"></div>
+                                    <div class="flex items-center justify-end gap-x-2">
+                                        <div
+                                            class="pointer fa fa-long-arrow-right primary-color"
+                                            [routerLink]="getPolicyTargetLink(item)"
+                                            mat-dialog-close="ROUTED"
+                                            title="Go to"></div>
+                                    </div>
                                 }
                             </td>
                         </ng-container>
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/users/ui/user-listing/user-access-policies/user-access-policies.component.scss b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/users/ui/user-listing/user-access-policies/user-access-policies.component.scss
index 829cb39665..5ffd800fa6 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/users/ui/user-listing/user-access-policies/user-access-policies.component.scss
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/users/ui/user-listing/user-access-policies/user-access-policies.component.scss
@@ -24,17 +24,8 @@
 
     .listing-table {
         table {
-            td,
-            th {
-                cursor: default;
-            }
-
-            .mat-column-action {
-                width: 75px;
-            }
-
             .mat-column-actions {
-                width: 50px;
+                width: 32px;
             }
         }
     }
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/users/ui/user-listing/user-table/user-table.component.html b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/users/ui/user-listing/user-table/user-table.component.html
index 1c298fa5f7..2ce6997e35 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/users/ui/user-listing/user-table/user-table.component.html
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/users/ui/user-listing/user-table/user-table.component.html
@@ -78,7 +78,7 @@
                 <ng-container matColumnDef="actions">
                     <th mat-header-cell *matHeaderCellDef></th>
                     <td mat-cell *matCellDef="let item">
-                        <div class="flex items-center gap-x-3">
+                        <div class="flex items-center justify-end gap-x-2">
                             @if (canEditOrDelete(currentUser, item)) {
                                 <div
                                     class="pointer fa fa-pencil primary-color"
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/users/ui/user-listing/user-table/user-table.component.scss b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/users/ui/user-listing/user-table/user-table.component.scss
index 181160a67c..ca83e58661 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/users/ui/user-listing/user-table/user-table.component.scss
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/users/ui/user-listing/user-table/user-table.component.scss
@@ -18,7 +18,7 @@
 .user-table {
     .listing-table {
         .mat-column-actions {
-            width: 75px;
+            width: 74px;
         }
     }
 }
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/controller-service/controller-service-table/controller-service-table.component.html b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/controller-service/controller-service-table/controller-service-table.component.html
index e8f735b02f..5fc5b47ca4 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/controller-service/controller-service-table/controller-service-table.component.html
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/controller-service/controller-service-table/controller-service-table.component.html
@@ -15,8 +15,8 @@
   ~ limitations under the License.
   -->
 
-<div class="relative h-full">
-    <div class="controller-service-table listing-table absolute inset-0 overflow-y-auto">
+<div class="controller-service-table relative h-full">
+    <div class="listing-table absolute inset-0 overflow-y-auto">
         <table
             mat-table
             [dataSource]="dataSource"
@@ -30,7 +30,7 @@
                 <th mat-header-cell *matHeaderCellDef></th>
                 <td mat-cell *matCellDef="let item">
                     @if (canRead(item)) {
-                        <div class="flex items-center gap-x-3">
+                        <div class="flex items-center gap-x-2">
                             <div
                                 class="pointer fa fa-book primary-color"
                                 (click)="viewDocumentationClicked(item, $event)"
@@ -75,7 +75,9 @@
             <ng-container matColumnDef="name">
                 <th mat-header-cell *matHeaderCellDef mat-sort-header>Name</th>
                 <td mat-cell *matCellDef="let item">
-                    <div [ngClass]="{ unset: !canRead(item), 'nifi-surface-default': !canRead(item) }">
+                    <div
+                        [ngClass]="{ unset: !canRead(item), 'nifi-surface-default': !canRead(item) }"
+                        class="overflow-hidden overflow-ellipsis whitespace-nowrap">
                         {{ formatName(item) }}
                     </div>
                 </td>
@@ -97,6 +99,14 @@
                 </td>
             </ng-container>
 
+            <!-- Scope Column -->
+            <ng-container matColumnDef="scope">
+                <th mat-header-cell *matHeaderCellDef mat-sort-header>Scope</th>
+                <td mat-cell *matCellDef="let item">
+                    {{ formatScope(item) }}
+                </td>
+            </ng-container>
+
             <!-- State Column -->
             <ng-container matColumnDef="state">
                 <th mat-header-cell *matHeaderCellDef mat-sort-header>State</th>
@@ -108,20 +118,12 @@
                 </td>
             </ng-container>
 
-            <!-- Scope Column -->
-            <ng-container matColumnDef="scope">
-                <th mat-header-cell *matHeaderCellDef mat-sort-header>Scope</th>
-                <td mat-cell *matCellDef="let item">
-                    {{ formatScope(item) }}
-                </td>
-            </ng-container>
-
             <!-- Actions Column -->
             <ng-container matColumnDef="actions">
                 <th mat-header-cell *matHeaderCellDef></th>
                 <td mat-cell *matCellDef="let item">
                     @if (definedByCurrentGroup(item)) {
-                        <div class="flex items-center gap-x-3">
+                        <div class="flex items-center justify-end gap-x-2">
                             @if (canConfigure(item)) {
                                 <div
                                     class="pointer fa fa-cog primary-color"
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/controller-service/controller-service-table/controller-service-table.component.scss b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/controller-service/controller-service-table/controller-service-table.component.scss
index 2a467a8a47..6f986b4e15 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/controller-service/controller-service-table/controller-service-table.component.scss
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/controller-service/controller-service-table/controller-service-table.component.scss
@@ -21,7 +21,15 @@
     .listing-table {
         table {
             .mat-column-moreDetails {
-                min-width: 90px;
+                width: 96px;
+            }
+
+            .mat-column-name {
+                width: 25%;
+            }
+
+            .mat-column-actions {
+                width: 140px; // only 6 of the 8 action icons can be present at the same time
             }
         }
     }
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/property-table/property-table.component.html b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/property-table/property-table.component.html
index 3917c325de..4dc639d049 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/property-table/property-table.component.html
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/property-table/property-table.component.html
@@ -102,7 +102,7 @@
                 <ng-container matColumnDef="actions">
                     <th mat-header-cell *matHeaderCellDef></th>
                     <td mat-cell *matCellDef="let item">
-                        <div class="flex items-center gap-x-3">
+                        <div class="flex items-center justify-end gap-x-2">
                             @if (item.descriptor.identifiesControllerService) {
                                 <div
                                     class="pointer fa fa-plus primary-color"
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/property-table/property-table.component.scss b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/property-table/property-table.component.scss
index 2944f98194..a2ad8e35ac 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/property-table/property-table.component.scss
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/property-table/property-table.component.scss
@@ -14,3 +14,13 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+
+.property-table {
+    .listing-table {
+        table {
+            .mat-column-actions {
+                width: 74px;
+            }
+        }
+    }
+}
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/property-table/property-table.component.ts b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/property-table/property-table.component.ts
index 9f3423ae66..9d4483e895 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/property-table/property-table.component.ts
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/property-table/property-table.component.ts
@@ -127,6 +127,12 @@ export class PropertyTable implements AfterViewInit, ControlValueAccessor {
     isTouched = false;
     onTouched!: () => void;
     onChange!: (properties: Property[]) => void;
+    editorOpen = false;
+    editorTrigger: any = null;
+    editorItem!: PropertyItem;
+    editorWidth = 0;
+    editorOffsetX = 0;
+    editorOffsetY = 0;
 
     private originPos: OriginConnectionPosition = {
         originX: 'center',
@@ -136,17 +142,7 @@ export class PropertyTable implements AfterViewInit, ControlValueAccessor {
         overlayX: 'center',
         overlayY: 'center'
     };
-    private editorPosition: ConnectionPositionPair = new ConnectionPositionPair(
-        this.originPos,
-        this.editorOverlayPos,
-        0,
-        0
-    );
-    public editorPositions: ConnectionPositionPair[] = [this.editorPosition];
-    editorOpen = false;
-    editorTrigger: any = null;
-    editorItem!: PropertyItem;
-    editorWidth = 0;
+    public editorPositions: ConnectionPositionPair[] = [];
 
     constructor(
         private changeDetector: ChangeDetectorRef,
@@ -408,10 +404,28 @@ export class PropertyTable implements AfterViewInit, ControlValueAccessor {
             if (td) {
                 const { width } = td.getBoundingClientRect();
 
+                this.editorPositions.pop();
                 this.editorItem = item;
                 this.editorTrigger = editorTrigger;
                 this.editorOpen = true;
-                this.editorWidth = width;
+
+                if (this.hasAllowableValues(item)) {
+                    this.editorWidth = width;
+                    this.editorOffsetX = -24;
+                    this.editorOffsetY = 24;
+                } else {
+                    this.editorWidth = width + 100;
+                    this.editorOffsetX = 8;
+                    this.editorOffsetY = 56;
+                }
+                this.editorPositions.push(
+                    new ConnectionPositionPair(
+                        this.originPos,
+                        this.editorOverlayPos,
+                        this.editorOffsetX,
+                        this.editorOffsetY
+                    )
+                );
             }
         }
     }
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/assets/styles/_listing-table.scss b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/assets/styles/_listing-table.scss
index 3e5d1ff9a8..99dece746b 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/assets/styles/_listing-table.scss
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/assets/styles/_listing-table.scss
@@ -38,23 +38,15 @@
             }
 
             .fa {
-                width: 10px;
+                width: 14px;
                 height: 14px;
                 text-align: center;
             }
 
             .icon {
-                width: 10px;
+                width: 14px;
                 text-align: center;
             }
-
-            .mat-column-moreDetails {
-                min-width: 30px;
-            }
-
-            .mat-column-actions {
-                min-width: 115px;
-            }
         }
     }