Prevent text overflow in resource action URLs

adamint · adamint · commit ba41dc1e199e · 2025-05-14T16:14:41.000-03:00
diff --git a/src/Aspire.Dashboard/Model/ResourceMenuItems.cs b/src/Aspire.Dashboard/Model/ResourceMenuItems.cs
@@ -149,6 +149,7 @@ public static void AddMenuItems(
                     Text = url.Text,
                     Tooltip = url.Url,
                     Icon = s_linkIcon,
+                    Class = "resource-actions-url-menuitem",
                     AdditionalAttributes = new Dictionary<string, object>
                     {
                         ["data-openbutton"] = "true",
diff --git a/src/Aspire.Dashboard/wwwroot/css/app.css b/src/Aspire.Dashboard/wwwroot/css/app.css
@@ -817,3 +817,8 @@ fluent-tooltip[anchor="dialog_close"] > div {
     vertical-align: text-bottom;
     margin-right: 3px;
 }
+
+.resource-actions-url-menuitem::part(content) {
+    width: 100%;
+    text-overflow: ellipsis;
+}

Original file line number	Diff line number	Diff line change
`@@ -149,6 +149,7 @@ public static void AddMenuItems(`
`149`	`149`	`Text = url.Text,`
`150`	`150`	`Tooltip = url.Url,`
`151`	`151`	`Icon = s_linkIcon,`
	`152`	`+ Class = "resource-actions-url-menuitem",`
`152`	`153`	`AdditionalAttributes = new Dictionary<string, object>`
`153`	`154`	`{`
`154`	`155`	`["data-openbutton"] = "true",`
Original file line number	Diff line number	Diff line change
`@@ -817,3 +817,8 @@ fluent-tooltip[anchor="dialog_close"] > div {`
`817`	`817`	`vertical-align: text-bottom;`
`818`	`818`	`margin-right: 3px;`
`819`	`819`	`}`
	`820`	`+`
	`821`	`+.resource-actions-url-menuitem::part(content) {`
	`822`	`+ width: 100%;`
	`823`	`+ text-overflow: ellipsis;`
	`824`	`+}`