From fe3ae1392882e838c40de26040822e8508cd54bb Mon Sep 17 00:00:00 2001
From: zhom <2717306+zhom@users.noreply.github.com>
Date: Wed, 24 Jun 2026 01:13:48 +0400
Subject: [PATCH] style: interactive elements consistently have cursor pointer

---
 src/components/rail-nav.tsx         |  8 ++++----
 src/components/ui/command.tsx       |  2 +-
 src/components/ui/dropdown-menu.tsx |  6 +++---
 src/components/ui/radio-group.tsx   |  2 +-
 src/styles/globals.css              | 17 +++++++++++++++++
 5 files changed, 26 insertions(+), 9 deletions(-)

diff --git a/src/components/rail-nav.tsx b/src/components/rail-nav.tsx
index 0f4f0c0..c15eb82 100644
--- a/src/components/rail-nav.tsx
+++ b/src/components/rail-nav.tsx
@@ -352,7 +352,7 @@ export function RailNav({ currentPage, onNavigate }: RailNavProps) {
                   aria-label={t(labelKey)}
                   aria-current={active ? "page" : undefined}
                   className={cn(
-                    "relative grid place-items-center size-7 rounded-md transition-colors duration-100 shrink-0",
+                    "relative grid place-items-center size-7 rounded-md cursor-pointer transition-colors duration-100 shrink-0",
                     active
                       ? "text-foreground bg-accent"
                       : "text-muted-foreground hover:text-card-foreground hover:bg-accent/50",
@@ -385,7 +385,7 @@ export function RailNav({ currentPage, onNavigate }: RailNavProps) {
             aria-label={t("rail.more.label")}
             aria-expanded={moreOpen}
             className={cn(
-              "grid place-items-center size-7 rounded-md transition-colors duration-100 shrink-0",
+              "grid place-items-center size-7 rounded-md cursor-pointer transition-colors duration-100 shrink-0",
               moreOpen
                 ? "text-foreground bg-accent"
                 : "text-muted-foreground hover:text-card-foreground hover:bg-accent/50",
@@ -407,7 +407,7 @@ export function RailNav({ currentPage, onNavigate }: RailNavProps) {
             aria-label={t("rail.settings")}
             aria-current={currentPage === "settings" ? "page" : undefined}
             className={cn(
-              "relative grid place-items-center size-7 rounded-md transition-colors duration-100 shrink-0",
+              "relative grid place-items-center size-7 rounded-md cursor-pointer transition-colors duration-100 shrink-0",
               currentPage === "settings"
                 ? "text-foreground bg-accent"
                 : "text-muted-foreground hover:text-card-foreground hover:bg-accent/50",
@@ -444,7 +444,7 @@ export function RailNav({ currentPage, onNavigate }: RailNavProps) {
                   setMoreOpen(false);
                   onNavigate(page);
                 }}
-                className="flex items-center gap-2 w-full px-2 py-1.5 rounded-md hover:bg-accent transition-colors duration-100 text-left"
+                className="flex items-center gap-2 w-full px-2 py-1.5 rounded-md cursor-pointer hover:bg-accent transition-colors duration-100 text-left"
               >
                 <span className="grid place-items-center size-5 rounded bg-muted text-muted-foreground shrink-0">
                   <Icon className="size-3" />
diff --git a/src/components/ui/command.tsx b/src/components/ui/command.tsx
index 6f13c86..8d20bd9 100644
--- a/src/components/ui/command.tsx
+++ b/src/components/ui/command.tsx
@@ -153,7 +153,7 @@ function CommandItem({
     <CommandPrimitive.Item
       data-slot="command-item"
       className={cn(
-        "data-[selected=true]:bg-accent data-[selected=true]:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "data-[selected=true]:bg-accent data-[selected=true]:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
         className,
       )}
       {...props}
diff --git a/src/components/ui/dropdown-menu.tsx b/src/components/ui/dropdown-menu.tsx
index 16f5afc..8326290 100644
--- a/src/components/ui/dropdown-menu.tsx
+++ b/src/components/ui/dropdown-menu.tsx
@@ -92,7 +92,7 @@ function DropdownMenuCheckboxItem({
     <DropdownMenuPrimitive.CheckboxItem
       data-slot="dropdown-menu-checkbox-item"
       className={cn(
-        "focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "focus:bg-accent focus:text-accent-foreground relative flex cursor-pointer items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
         className,
       )}
       checked={checked}
@@ -128,7 +128,7 @@ function DropdownMenuRadioItem({
     <DropdownMenuPrimitive.RadioItem
       data-slot="dropdown-menu-radio-item"
       className={cn(
-        "focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "focus:bg-accent focus:text-accent-foreground relative flex cursor-pointer items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
         className,
       )}
       {...props}
@@ -211,7 +211,7 @@ function DropdownMenuSubTrigger({
       data-slot="dropdown-menu-sub-trigger"
       data-inset={inset}
       className={cn(
-        "focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[inset]:pl-8",
+        "focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-pointer items-center rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[inset]:pl-8",
         className,
       )}
       {...props}
diff --git a/src/components/ui/radio-group.tsx b/src/components/ui/radio-group.tsx
index e2d957c..c024348 100644
--- a/src/components/ui/radio-group.tsx
+++ b/src/components/ui/radio-group.tsx
@@ -28,7 +28,7 @@ const RadioGroupItem = React.forwardRef<
     <RadioGroupPrimitive.Item
       ref={ref}
       className={cn(
-        "aspect-square size-4 rounded-full border border-primary text-primary ring-offset-background focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
+        "cursor-pointer aspect-square size-4 rounded-full border border-primary text-primary ring-offset-background focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
         className,
       )}
       {...props}
diff --git a/src/styles/globals.css b/src/styles/globals.css
index 261f766..bd57799 100644
--- a/src/styles/globals.css
+++ b/src/styles/globals.css
@@ -155,6 +155,23 @@
   body {
     @apply bg-background text-foreground;
   }
+  /* Interactive elements show a pointer cursor app-wide, so cursor behavior is
+     consistent everywhere without per-element classes — and there's no lingering
+     "fix the cursor" surface for drive-by PRs. Disabled controls rely on
+     pointer-events:none / their own disabled cursor, and an explicit `cursor-*`
+     utility still wins over this base rule (utilities out-rank the base layer),
+     e.g. the invisible click-to-close backdrop and the auto-scroll buttons. */
+  button:not(:disabled),
+  [role="button"]:not([aria-disabled="true"]),
+  [role="menuitem"],
+  [role="menuitemcheckbox"],
+  [role="menuitemradio"],
+  [role="option"],
+  [role="radio"],
+  [role="tab"],
+  [role="switch"] {
+    cursor: pointer;
+  }
 }
 
 /* Scroll-fade utility: a vertical mask that thins the alpha of the top and