From 190fbeedb4f9f73f42795333628b46de8777a2f6 Mon Sep 17 00:00:00 2001
From: Cursor Agent <cursoragent@cursor.com>
Date: Mon, 3 Aug 2026 07:10:41 +0000
Subject: [PATCH] Improve pending OpenCode restart counter contrast

Place a high-contrast count badge first on the Apply & Restart action so
pending settings changes remain obvious in the Settings chrome.

Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>
---
 .../views/PendingOpenCodeRestartAction.tsx     | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

diff --git a/packages/ui/src/components/views/PendingOpenCodeRestartAction.tsx b/packages/ui/src/components/views/PendingOpenCodeRestartAction.tsx
index 22cf0540..25d19a42 100644
--- a/packages/ui/src/components/views/PendingOpenCodeRestartAction.tsx
+++ b/packages/ui/src/components/views/PendingOpenCodeRestartAction.tsx
@@ -61,21 +61,21 @@ export const PendingOpenCodeRestartAction: React.FC<PendingOpenCodeRestartAction
       onClick={() => void handleApply()}
       className={cn('gap-1.5 shadow-sm', className)}
     >
+      <span
+        className={cn(
+          'inline-flex h-5 min-w-5 shrink-0 items-center justify-center rounded-full px-1.5',
+          'bg-background text-foreground typography-micro font-semibold tabular-nums',
+        )}
+        aria-hidden="true"
+      >
+        {pendingCount}
+      </span>
       <Icon name="restart" className="h-3.5 w-3.5 shrink-0" />
       <span className="truncate">
         {isApplying
           ? t('settings.view.pendingRestart.applying')
           : t('settings.view.actions.applyAndRestartOpenCode')}
       </span>
-      <span
-        className={cn(
-          'inline-flex min-w-5 items-center justify-center rounded-md px-1.5 typography-micro font-semibold',
-          'bg-primary-foreground/15 text-primary-foreground',
-        )}
-        aria-hidden="true"
-      >
-        {pendingCount}
-      </span>
     </Button>
   );
 };