| author |  naMqe <naMqe07@gmail.com> 2026-08-09 02:02:57+02:00 |
| committer |  GitHub <noreply@github.com> 2026-08-08 20:02:57-04:00 |
| log | be01b287b92b4686023a5e213078a2f51b3c1880 |
| tree | 9f6b1e634664c64b050509a1430bd45d46939d70 |
| parent | c2f8cb7ca1576afd70294b98dfe1de9be17aacae |
| signature | Signed by PGP key B5690EEEBB952194 |
fix(web): add missing cursor-pointer styling to dropdowns and interactive buttons (#5716)
7 files changed, 25 insertions(+), 25 deletions(-)
apps
web
apps/web/src/components/RightPanelTabs.tsx+5-5
| ... | @@ -185,7 +185,7 @@ function RightPanelEmptyState(props: { | ... | @@ -185,7 +185,7 @@ function RightPanelEmptyState(props: { |
| 185 | key={action.label} | 185 | key={action.label} |
| 186 | type="button" | 186 | type="button" |
| 187 | onClick={action.onClick} | 187 | onClick={action.onClick} |
| 188 | className="flex min-h-28 w-full flex-col items-start rounded-lg border border-border/80 bg-card p-4 text-left transition hover:border-border hover:bg-accent/60 dark:border-transparent dark:shadow-none dark:inset-ring-1 dark:inset-ring-white/5" | 188 | className="cursor-pointer flex min-h-28 w-full flex-col items-start rounded-lg border border-border/80 bg-card p-4 text-left transition hover:border-border hover:bg-accent/60 dark:border-transparent dark:shadow-none dark:inset-ring-1 dark:inset-ring-white/5" |
| 189 | > | 189 | > |
| 190 | {content} | 190 | {content} |
| 191 | </button> | 191 | </button> |
| ... | @@ -413,7 +413,7 @@ export function RightPanelTabs(props: RightPanelTabsProps) { | ... | @@ -413,7 +413,7 @@ export function RightPanelTabs(props: RightPanelTabsProps) { |
| 413 | onAuxClick={(event) => handleTabAuxClick(event, surface)} | 413 | onAuxClick={(event) => handleTabAuxClick(event, surface)} |
| 414 | onContextMenu={(event) => void handleTabContextMenu(event, surface)} | 414 | onContextMenu={(event) => void handleTabContextMenu(event, surface)} |
| 415 | className={cn( | 415 | className={cn( |
| 416 | "group/tab flex h-6 max-w-36 shrink-0 items-center gap-0.5 rounded-md pr-2 pl-1.5 text-xs", | 416 | "cursor-pointer group/tab flex h-6 max-w-36 shrink-0 items-center gap-0.5 rounded-md pr-2 pl-1.5 text-xs", |
| 417 | active | 417 | active |
| 418 | ? "bg-accent text-foreground" | 418 | ? "bg-accent text-foreground" |
| 419 | : "text-muted-foreground hover:bg-accent/60 hover:text-foreground", | 419 | : "text-muted-foreground hover:bg-accent/60 hover:text-foreground", |
| ... | @@ -421,7 +421,7 @@ export function RightPanelTabs(props: RightPanelTabsProps) { | ... | @@ -421,7 +421,7 @@ export function RightPanelTabs(props: RightPanelTabsProps) { |
| 421 | > | 421 | > |
| 422 | <button | 422 | <button |
| 423 | type="button" | 423 | type="button" |
| 424 | className="group/close relative flex size-4 shrink-0 items-center justify-center rounded-sm hover:bg-muted" | 424 | className="cursor-pointer group/close relative flex size-4 shrink-0 items-center justify-center rounded-sm hover:bg-muted" |
| 425 | aria-label={`Close ${title}`} | 425 | aria-label={`Close ${title}`} |
| 426 | onClick={() => props.onCloseSurface(surface)} | 426 | onClick={() => props.onCloseSurface(surface)} |
| 427 | > | 427 | > |
| ... | @@ -445,7 +445,7 @@ export function RightPanelTabs(props: RightPanelTabsProps) { | ... | @@ -445,7 +445,7 @@ export function RightPanelTabs(props: RightPanelTabsProps) { |
| 445 | render={ | 445 | render={ |
| 446 | <button | 446 | <button |
| 447 | type="button" | 447 | type="button" |
| 448 | className="flex min-w-0 items-center" | 448 | className="cursor-pointer flex min-w-0 items-center" |
| 449 | onClick={() => props.onActivate(surface)} | 449 | onClick={() => props.onActivate(surface)} |
| 450 | > | 450 | > |
| 451 | <span className="truncate">{title}</span> | 451 | <span className="truncate">{title}</span> |
| ... | @@ -460,7 +460,7 @@ export function RightPanelTabs(props: RightPanelTabsProps) { | ... | @@ -460,7 +460,7 @@ export function RightPanelTabs(props: RightPanelTabsProps) { |
| 460 | {props.surfaces.length > 0 ? ( | 460 | {props.surfaces.length > 0 ? ( |
| 461 | <Menu> | 461 | <Menu> |
| 462 | <MenuTrigger | 462 | <MenuTrigger |
| 463 | className="relative inline-flex size-6 shrink-0 items-center justify-center rounded-md text-muted-foreground hover:bg-accent hover:text-foreground" | 463 | className="cursor-pointer relative inline-flex size-6 shrink-0 items-center justify-center rounded-md text-muted-foreground hover:bg-accent hover:text-foreground" |
| 464 | aria-label="Add panel surface" | 464 | aria-label="Add panel surface" |
| 465 | > | 465 | > |
| 466 | <Plus className="size-3.5" /> | 466 | <Plus className="size-3.5" /> |
apps/web/src/components/settings/DiagnosticsSettings.tsx+7-7
| ... | @@ -103,7 +103,7 @@ function StatBlock({ | ... | @@ -103,7 +103,7 @@ function StatBlock({ |
| 103 | render={ | 103 | render={ |
| 104 | <button | 104 | <button |
| 105 | type="button" | 105 | type="button" |
| 106 | className="inline-flex size-3.5 shrink-0 items-center justify-center rounded-sm text-muted-foreground/60 hover:text-foreground" | 106 | className="cursor-pointer inline-flex size-3.5 shrink-0 items-center justify-center rounded-sm text-muted-foreground/60 hover:text-foreground" |
| 107 | aria-label={`${label} details`} | 107 | aria-label={`${label} details`} |
| 108 | > | 108 | > |
| 109 | <InfoIcon className="size-3" /> | 109 | <InfoIcon className="size-3" /> |
| ... | @@ -187,7 +187,7 @@ function ExpandableText({ | ... | @@ -187,7 +187,7 @@ function ExpandableText({ |
| 187 | {canExpand ? ( | 187 | {canExpand ? ( |
| 188 | <button | 188 | <button |
| 189 | type="button" | 189 | type="button" |
| 190 | className="mt-1 text-[11px] font-medium text-foreground/70 underline-offset-2 hover:text-foreground hover:underline" | 190 | className="cursor-pointer mt-1 text-[11px] font-medium text-foreground/70 underline-offset-2 hover:text-foreground hover:underline" |
| 191 | onClick={() => setExpanded((value) => !value)} | 191 | onClick={() => setExpanded((value) => !value)} |
| 192 | > | 192 | > |
| 193 | {expanded ? "Show less" : expandLabel} | 193 | {expanded ? "Show less" : expandLabel} |
| ... | @@ -274,7 +274,7 @@ function TraceIdCell({ traceId }: { traceId: string }) { | ... | @@ -274,7 +274,7 @@ function TraceIdCell({ traceId }: { traceId: string }) { |
| 274 | render={ | 274 | render={ |
| 275 | <button | 275 | <button |
| 276 | type="button" | 276 | type="button" |
| 277 | className="inline-flex size-5 shrink-0 items-center justify-center rounded-sm text-muted-foreground hover:bg-accent hover:text-foreground" | 277 | className="cursor-pointer inline-flex size-5 shrink-0 items-center justify-center rounded-sm text-muted-foreground hover:bg-accent hover:text-foreground" |
| 278 | aria-label={copied ? "Copied trace ID" : "Copy trace ID"} | 278 | aria-label={copied ? "Copied trace ID" : "Copy trace ID"} |
| 279 | onClick={() => copyToClipboard(traceId)} | 279 | onClick={() => copyToClipboard(traceId)} |
| 280 | > | 280 | > |
| ... | @@ -323,7 +323,7 @@ function ProcessNameCell({ | ... | @@ -323,7 +323,7 @@ function ProcessNameCell({ |
| 323 | {hasChildren ? ( | 323 | {hasChildren ? ( |
| 324 | <button | 324 | <button |
| 325 | type="button" | 325 | type="button" |
| 326 | className="inline-flex size-5 items-center justify-center rounded-sm text-muted-foreground hover:bg-accent hover:text-foreground" | 326 | className="cursor-pointer inline-flex size-5 items-center justify-center rounded-sm text-muted-foreground hover:bg-accent hover:text-foreground" |
| 327 | aria-label={isExpanded ? `Collapse ${name}` : `Expand ${name}`} | 327 | aria-label={isExpanded ? `Collapse ${name}` : `Expand ${name}`} |
| 328 | onClick={() => onToggle(process.pid)} | 328 | onClick={() => onToggle(process.pid)} |
| 329 | > | 329 | > |
| ... | @@ -365,7 +365,7 @@ function ProcessSignalActions({ | ... | @@ -365,7 +365,7 @@ function ProcessSignalActions({ |
| 365 | <button | 365 | <button |
| 366 | type="button" | 366 | type="button" |
| 367 | disabled={isSignaling} | 367 | disabled={isSignaling} |
| 368 | className="text-[11px] font-medium text-muted-foreground underline-offset-2 hover:text-foreground hover:underline disabled:pointer-events-none disabled:opacity-50" | 368 | className="cursor-pointer text-[11px] font-medium text-muted-foreground underline-offset-2 hover:text-foreground hover:underline disabled:pointer-events-none disabled:opacity-50" |
| 369 | onClick={() => onSignal(process.pid, "SIGINT")} | 369 | onClick={() => onSignal(process.pid, "SIGINT")} |
| 370 | > | 370 | > |
| 371 | INT | 371 | INT |
| ... | @@ -380,7 +380,7 @@ function ProcessSignalActions({ | ... | @@ -380,7 +380,7 @@ function ProcessSignalActions({ |
| 380 | <button | 380 | <button |
| 381 | type="button" | 381 | type="button" |
| 382 | disabled={isSignaling} | 382 | disabled={isSignaling} |
| 383 | className="text-[11px] font-medium text-destructive underline-offset-2 hover:underline disabled:pointer-events-none disabled:opacity-50" | 383 | className="cursor-pointer text-[11px] font-medium text-destructive underline-offset-2 hover:underline disabled:pointer-events-none disabled:opacity-50" |
| 384 | onClick={() => onSignal(process.pid, "SIGKILL")} | 384 | onClick={() => onSignal(process.pid, "SIGKILL")} |
| 385 | > | 385 | > |
| 386 | KILL | 386 | KILL |
| ... | @@ -640,7 +640,7 @@ function ResourceHistoryWindowSelector({ | ... | @@ -640,7 +640,7 @@ function ResourceHistoryWindowSelector({ |
| 640 | key={option.windowMs} | 640 | key={option.windowMs} |
| 641 | type="button" | 641 | type="button" |
| 642 | className={cn( | 642 | className={cn( |
| 643 | "h-6 rounded-sm px-2 text-[11px] font-medium text-muted-foreground hover:text-foreground", | 643 | "cursor-pointer h-6 rounded-sm px-2 text-[11px] font-medium text-muted-foreground hover:text-foreground", |
| 644 | selectedWindowMs === option.windowMs && "bg-muted text-foreground", | 644 | selectedWindowMs === option.windowMs && "bg-muted text-foreground", |
| 645 | )} | 645 | )} |
| 646 | onClick={() => onSelect(option.windowMs)} | 646 | onClick={() => onSelect(option.windowMs)} |
apps/web/src/components/settings/ResourceTelemetryDiagnostics.tsx+4-4
| ... | @@ -383,7 +383,7 @@ function HistoryWindowSelector({ | ... | @@ -383,7 +383,7 @@ function HistoryWindowSelector({ |
| 383 | key={option.windowMs} | 383 | key={option.windowMs} |
| 384 | type="button" | 384 | type="button" |
| 385 | className={cn( | 385 | className={cn( |
| 386 | "h-6 rounded-sm px-2 text-[11px] font-medium text-muted-foreground hover:text-foreground", | 386 | "cursor-pointer h-6 rounded-sm px-2 text-[11px] font-medium text-muted-foreground hover:text-foreground", |
| 387 | selectedWindowMs === option.windowMs && "bg-muted text-foreground", | 387 | selectedWindowMs === option.windowMs && "bg-muted text-foreground", |
| 388 | )} | 388 | )} |
| 389 | onClick={() => onSelect(option.windowMs)} | 389 | onClick={() => onSelect(option.windowMs)} |
| ... | @@ -487,7 +487,7 @@ function ProcessTreeName({ | ... | @@ -487,7 +487,7 @@ function ProcessTreeName({ |
| 487 | {hasChildren ? ( | 487 | {hasChildren ? ( |
| 488 | <button | 488 | <button |
| 489 | type="button" | 489 | type="button" |
| 490 | className="inline-flex size-5 items-center justify-center rounded-sm text-muted-foreground hover:bg-accent hover:text-foreground" | 490 | className="cursor-pointer inline-flex size-5 items-center justify-center rounded-sm text-muted-foreground hover:bg-accent hover:text-foreground" |
| 491 | onClick={() => onToggle(process)} | 491 | onClick={() => onToggle(process)} |
| 492 | aria-label={collapsed ? `Expand ${name}` : `Collapse ${name}`} | 492 | aria-label={collapsed ? `Expand ${name}` : `Collapse ${name}`} |
| 493 | > | 493 | > |
| ... | @@ -538,7 +538,7 @@ function ProcessActions({ | ... | @@ -538,7 +538,7 @@ function ProcessActions({ |
| 538 | <button | 538 | <button |
| 539 | type="button" | 539 | type="button" |
| 540 | disabled={isSignaling} | 540 | disabled={isSignaling} |
| 541 | className="text-[10px] font-semibold text-muted-foreground hover:text-foreground disabled:opacity-50" | 541 | className="cursor-pointer text-[10px] font-semibold text-muted-foreground hover:text-foreground disabled:opacity-50" |
| 542 | onClick={() => onSignal(process, "SIGINT")} | 542 | onClick={() => onSignal(process, "SIGINT")} |
| 543 | > | 543 | > |
| 544 | INT | 544 | INT |
| ... | @@ -546,7 +546,7 @@ function ProcessActions({ | ... | @@ -546,7 +546,7 @@ function ProcessActions({ |
| 546 | <button | 546 | <button |
| 547 | type="button" | 547 | type="button" |
| 548 | disabled={isSignaling} | 548 | disabled={isSignaling} |
| 549 | className="text-[10px] font-semibold text-destructive hover:underline disabled:opacity-50" | 549 | className="cursor-pointer text-[10px] font-semibold text-destructive hover:underline disabled:opacity-50" |
| 550 | onClick={() => onSignal(process, "SIGKILL")} | 550 | onClick={() => onSignal(process, "SIGKILL")} |
| 551 | > | 551 | > |
| 552 | KILL | 552 | KILL |
apps/web/src/components/ui/combobox.tsx+1-1
| ... | @@ -200,7 +200,7 @@ function ComboboxItem({ | ... | @@ -200,7 +200,7 @@ function ComboboxItem({ |
| 200 | return ( | 200 | return ( |
| 201 | <ComboboxPrimitive.Item | 201 | <ComboboxPrimitive.Item |
| 202 | className={cn( | 202 | className={cn( |
| 203 | "flex min-h-8 in-data-[side=none]:min-w-[calc(var(--anchor-width)+1.25rem)] cursor-default items-center rounded-sm px-2 py-1 text-base outline-none hover:bg-accent data-disabled:pointer-events-none data-selected:bg-foreground/[0.08] data-selected:text-foreground data-highlighted:bg-accent data-highlighted:text-accent-foreground [&[data-highlighted][data-selected]]:bg-accent [&[data-highlighted][data-selected]]:text-accent-foreground data-disabled:opacity-64 sm:min-h-7 sm:text-sm [&_svg:not([class*='size-'])]:size-4.5 sm:[&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", | 203 | "flex min-h-8 in-data-[side=none]:min-w-[calc(var(--anchor-width)+1.25rem)] cursor-pointer items-center rounded-sm px-2 py-1 text-base outline-none hover:bg-accent data-disabled:pointer-events-none data-disabled:cursor-not-allowed data-selected:bg-foreground/[0.08] data-selected:text-foreground data-highlighted:bg-accent data-highlighted:text-accent-foreground [&[data-highlighted][data-selected]]:bg-accent [&[data-highlighted][data-selected]]:text-accent-foreground data-disabled:opacity-64 sm:min-h-7 sm:text-sm [&_svg:not([class*='size-'])]:size-4.5 sm:[&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", |
| 204 | className, | 204 | className, |
| 205 | )} | 205 | )} |
| 206 | data-slot="combobox-item" | 206 | data-slot="combobox-item" |
apps/web/src/components/ui/menu.tsx+3-3
| ... | @@ -78,7 +78,7 @@ function MenuItem({ | ... | @@ -78,7 +78,7 @@ function MenuItem({ |
| 78 | return ( | 78 | return ( |
| 79 | <MenuPrimitive.Item | 79 | <MenuPrimitive.Item |
| 80 | className={cn( | 80 | className={cn( |
| 81 | "[&>svg]:-mx-0.5 flex min-h-8 cursor-default select-none items-center gap-2 rounded-sm px-2 py-1 text-base text-foreground outline-none data-disabled:pointer-events-none data-highlighted:bg-accent data-inset:ps-8 data-[variant=destructive]:text-destructive-foreground data-highlighted:text-accent-foreground data-disabled:opacity-64 sm:min-h-7 sm:text-sm [&>svg:not([class*='opacity-'])]:opacity-80 [&>svg:not([class*='size-'])]:size-4.5 sm:[&>svg:not([class*='size-'])]:size-4 [&>svg:not([class*='text-'])]:text-muted-foreground data-[variant=destructive]:[&>svg:not([class*='text-'])]:text-current [&>svg]:pointer-events-none [&>svg]:shrink-0", | 81 | "[&>svg]:-mx-0.5 flex min-h-8 cursor-pointer select-none items-center gap-2 rounded-sm px-2 py-1 text-base text-foreground outline-none data-disabled:pointer-events-none data-disabled:cursor-not-allowed data-highlighted:bg-accent data-inset:ps-8 data-[variant=destructive]:text-destructive-foreground data-highlighted:text-accent-foreground data-disabled:opacity-64 sm:min-h-7 sm:text-sm [&>svg:not([class*='opacity-'])]:opacity-80 [&>svg:not([class*='size-'])]:size-4.5 sm:[&>svg:not([class*='size-'])]:size-4 [&>svg:not([class*='text-'])]:text-muted-foreground data-[variant=destructive]:[&>svg:not([class*='text-'])]:text-current [&>svg]:pointer-events-none [&>svg]:shrink-0", |
| 82 | className, | 82 | className, |
| 83 | )} | 83 | )} |
| 84 | data-inset={inset} | 84 | data-inset={inset} |
| ... | @@ -102,7 +102,7 @@ function MenuCheckboxItem({ | ... | @@ -102,7 +102,7 @@ function MenuCheckboxItem({ |
| 102 | <MenuPrimitive.CheckboxItem | 102 | <MenuPrimitive.CheckboxItem |
| 103 | checked={checked} | 103 | checked={checked} |
| 104 | className={cn( | 104 | className={cn( |
| 105 | "grid min-h-8 in-data-[side=none]:min-w-[calc(var(--anchor-width)+1.25rem)] cursor-default items-center gap-2 rounded-sm py-1 ps-2 text-base text-foreground outline-none data-disabled:pointer-events-none data-highlighted:bg-accent data-highlighted:text-accent-foreground data-disabled:opacity-64 sm:min-h-7 sm:text-sm [&_svg:not([class*='size-'])]:size-4.5 sm:[&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", | 105 | "grid min-h-8 in-data-[side=none]:min-w-[calc(var(--anchor-width)+1.25rem)] cursor-pointer items-center gap-2 rounded-sm py-1 ps-2 text-base text-foreground outline-none data-disabled:pointer-events-none data-disabled:cursor-not-allowed data-highlighted:bg-accent data-highlighted:text-accent-foreground data-disabled:opacity-64 sm:min-h-7 sm:text-sm [&_svg:not([class*='size-'])]:size-4.5 sm:[&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", |
| 106 | variant === "switch" ? "grid-cols-[1fr_auto] gap-4 pe-1.5" : "grid-cols-[1rem_1fr] pe-4", | 106 | variant === "switch" ? "grid-cols-[1fr_auto] gap-4 pe-1.5" : "grid-cols-[1rem_1fr] pe-4", |
| 107 | className, | 107 | className, |
| 108 | )} | 108 | )} |
| ... | @@ -158,7 +158,7 @@ function MenuRadioItem({ | ... | @@ -158,7 +158,7 @@ function MenuRadioItem({ |
| 158 | return ( | 158 | return ( |
| 159 | <MenuPrimitive.RadioItem | 159 | <MenuPrimitive.RadioItem |
| 160 | className={cn( | 160 | className={cn( |
| 161 | "flex min-h-8 in-data-[side=none]:min-w-[calc(var(--anchor-width)+1.25rem)] cursor-default items-center rounded-sm px-2 py-1 text-base text-foreground outline-none data-checked:bg-foreground/[0.08] data-disabled:pointer-events-none data-highlighted:bg-accent data-highlighted:text-accent-foreground data-disabled:opacity-64 sm:min-h-7 sm:text-sm [&_svg:not([class*='size-'])]:size-4.5 sm:[&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", | 161 | "flex min-h-8 in-data-[side=none]:min-w-[calc(var(--anchor-width)+1.25rem)] cursor-pointer items-center rounded-sm px-2 py-1 text-base text-foreground outline-none data-checked:bg-foreground/[0.08] data-disabled:pointer-events-none data-disabled:cursor-not-allowed data-highlighted:bg-accent data-highlighted:text-accent-foreground data-disabled:opacity-64 sm:min-h-7 sm:text-sm [&_svg:not([class*='size-'])]:size-4.5 sm:[&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", |
| 162 | className, | 162 | className, |
| 163 | )} | 163 | )} |
| 164 | data-slot="menu-radio-item" | 164 | data-slot="menu-radio-item" |
apps/web/src/components/ui/select.tsx+1-1
| ... | @@ -185,7 +185,7 @@ function SelectItem({ | ... | @@ -185,7 +185,7 @@ function SelectItem({ |
| 185 | return ( | 185 | return ( |
| 186 | <SelectPrimitive.Item | 186 | <SelectPrimitive.Item |
| 187 | className={cn( | 187 | className={cn( |
| 188 | "flex min-h-8 in-data-[side=none]:min-w-[calc(var(--anchor-width)+1.25rem)] cursor-default items-center rounded-sm px-2 py-1 text-base outline-none data-selected:bg-foreground/[0.08] data-disabled:pointer-events-none data-highlighted:bg-accent data-highlighted:text-accent-foreground data-disabled:opacity-64 sm:min-h-7 sm:text-sm [&_svg:not([class*='size-'])]:size-4.5 sm:[&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", | 188 | "flex min-h-8 in-data-[side=none]:min-w-[calc(var(--anchor-width)+1.25rem)] cursor-pointer items-center rounded-sm px-2 py-1 text-base outline-none data-selected:bg-foreground/[0.08] data-disabled:pointer-events-none data-disabled:cursor-not-allowed data-highlighted:bg-accent data-highlighted:text-accent-foreground data-disabled:opacity-64 sm:min-h-7 sm:text-sm [&_svg:not([class*='size-'])]:size-4.5 sm:[&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", |
| 189 | className, | 189 | className, |
| 190 | )} | 190 | )} |
| 191 | data-slot="select-item" | 191 | data-slot="select-item" |
apps/web/src/components/usage/UsagePage.tsx+4-4
| ... | @@ -71,7 +71,7 @@ export function UsagePage() { | ... | @@ -71,7 +71,7 @@ export function UsagePage() { |
| 71 | type="button" | 71 | type="button" |
| 72 | onClick={() => setWindowDays(option.days)} | 72 | onClick={() => setWindowDays(option.days)} |
| 73 | className={cn( | 73 | className={cn( |
| 74 | "px-3 py-1.5 text-xs", | 74 | "cursor-pointer px-3 py-1.5 text-xs", |
| 75 | option.days === windowDays | 75 | option.days === windowDays |
| 76 | ? "bg-muted text-foreground" | 76 | ? "bg-muted text-foreground" |
| 77 | : "text-muted-foreground hover:text-foreground", | 77 | : "text-muted-foreground hover:text-foreground", |
| ... | @@ -85,7 +85,7 @@ export function UsagePage() { | ... | @@ -85,7 +85,7 @@ export function UsagePage() { |
| 85 | type="button" | 85 | type="button" |
| 86 | onClick={refresh} | 86 | onClick={refresh} |
| 87 | aria-label="Refresh usage" | 87 | aria-label="Refresh usage" |
| 88 | className="rounded-md border border-border p-2 text-muted-foreground hover:text-foreground" | 88 | className="cursor-pointer rounded-md border border-border p-2 text-muted-foreground hover:text-foreground" |
| 89 | > | 89 | > |
| 90 | <RefreshCwIcon className="size-3.5" /> | 90 | <RefreshCwIcon className="size-3.5" /> |
| 91 | </button> | 91 | </button> |
| ... | @@ -173,7 +173,7 @@ export function UsagePage() { | ... | @@ -173,7 +173,7 @@ export function UsagePage() { |
| 173 | type="button" | 173 | type="button" |
| 174 | onClick={() => setMetric(option)} | 174 | onClick={() => setMetric(option)} |
| 175 | className={cn( | 175 | className={cn( |
| 176 | "px-2.5 py-1 text-[10px] tracking-wide uppercase", | 176 | "cursor-pointer px-2.5 py-1 text-[10px] tracking-wide uppercase", |
| 177 | option === metric | 177 | option === metric |
| 178 | ? "bg-muted text-foreground" | 178 | ? "bg-muted text-foreground" |
| 179 | : "text-muted-foreground hover:text-foreground", | 179 | : "text-muted-foreground hover:text-foreground", |
| ... | @@ -233,7 +233,7 @@ export function UsagePage() { | ... | @@ -233,7 +233,7 @@ export function UsagePage() { |
| 233 | type="button" | 233 | type="button" |
| 234 | onClick={() => setBreakdown(option)} | 234 | onClick={() => setBreakdown(option)} |
| 235 | className={cn( | 235 | className={cn( |
| 236 | "px-2.5 py-1 text-[10px] tracking-wide uppercase", | 236 | "cursor-pointer px-2.5 py-1 text-[10px] tracking-wide uppercase", |
| 237 | option === breakdown | 237 | option === breakdown |
| 238 | ? "bg-muted text-foreground" | 238 | ? "bg-muted text-foreground" |
| 239 | : "text-muted-foreground hover:text-foreground", | 239 | : "text-muted-foreground hover:text-foreground", |