From c794474b6fdf78a8f17b96b9442607f2cbd2790d Mon Sep 17 00:00:00 2001
From: ismail simsek <ismailsimsek09@gmail.com>
Date: Thu, 2 Oct 2025 00:18:24 +0200
Subject: [PATCH] suggested panel button visual improvements

---
 .../dashboard-scene/edit-pane/DashboardAddPanelPane.tsx   | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/public/app/features/dashboard-scene/edit-pane/DashboardAddPanelPane.tsx b/public/app/features/dashboard-scene/edit-pane/DashboardAddPanelPane.tsx
index 2d6b5646bb2..7fb8f5742a1 100644
--- a/public/app/features/dashboard-scene/edit-pane/DashboardAddPanelPane.tsx
+++ b/public/app/features/dashboard-scene/edit-pane/DashboardAddPanelPane.tsx
@@ -119,7 +119,7 @@ function getStyles(theme: GrafanaTheme2) {
     }),
     listItem: css({
       display: 'flex',
-      alignItems: 'center',
+      alignItems: 'flex-start',
       gap: theme.spacing(1),
       padding: theme.spacing(1),
       marginBottom: theme.spacing(1),
@@ -138,13 +138,19 @@ function getStyles(theme: GrafanaTheme2) {
       display: 'flex',
       alignItems: 'center',
       justifyContent: 'center',
+      marginTop: theme.spacing(0.25), // Slight offset to align with first line of text
+      flexShrink: 0, // Prevent icon from shrinking
     }),
     itemText: css({
       display: 'flex',
       flexDirection: 'column',
+      flex: 1,
+      minWidth: 0, // Allow flex item to shrink below its content size
     }),
     itemName: css({
       fontWeight: theme.typography.fontWeightMedium,
+      wordBreak: 'break-word',
+      lineHeight: theme.typography.body.lineHeight,
     }),
     itemMeta: css({
       color: theme.colors.text.secondary,