From a1b8b12928a11049ac913ed542e12efe894f6d4b Mon Sep 17 00:00:00 2001
From: Daniel <57051444+daniel-lxs@users.noreply.github.com>
Date: Fri, 13 Jun 2025 10:28:33 -0500
Subject: [PATCH] Prevent MCP 'installed' label from being squeezed #4630
 (#4649)

---
 .../components/marketplace/components/MarketplaceItemCard.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/webview-ui/src/components/marketplace/components/MarketplaceItemCard.tsx b/webview-ui/src/components/marketplace/components/MarketplaceItemCard.tsx
index c382b36fce..2d20e8cadd 100644
--- a/webview-ui/src/components/marketplace/components/MarketplaceItemCard.tsx
+++ b/webview-ui/src/components/marketplace/components/MarketplaceItemCard.tsx
@@ -114,10 +114,10 @@ export const MarketplaceItemCard: React.FC<MarketplaceItemCardProps> = ({ item,
 
 				{/* Installation status badges and tags in the same row */}
 				{(isInstalled || (item.tags && item.tags.length > 0)) && (
-					<div className="relative flex gap-1 my-2 overflow-x-auto scrollbar-hide">
+					<div className="relative flex flex-wrap gap-1 my-2">
 						{/* Installation status badge on the left */}
 						{isInstalled && (
-							<span className="text-xs px-2 py-0.5 rounded-sm h-5 flex items-center bg-green-600/20 text-green-400 border border-green-600/30">
+							<span className="text-xs px-2 py-0.5 rounded-sm h-5 flex items-center bg-green-600/20 text-green-400 border border-green-600/30 shrink-0">
 								{t("marketplace:items.card.installed")}
 							</span>
 						)}