authorgravatar for 97427849+flamboh@users.noreply.github.comoliver <97427849+flamboh@users.noreply.github.com> 2026-10-04 00:08:59-07:00
committergravatar for noreply@github.comGitHub <noreply@github.com> 2026-10-04 04:08:59-03:00
log6e0abd5a10a646337076a9baf7f6502dc4f0e74d
tree6779b292a8561e24b8621b8904e2b44da50c8032
parent0fe4fa40fe65ac9545621a65633f08d9fa29fd0d
signature Signed by PGP key B5690EEEBB952194

fix(web): unpin button shows the pin-off icon on hover (#15425)


1 files changed, 11 insertions(+), 2 deletions(-)

apps/web/src/components/Sidebar.tsx+11-2
......@@ -1712,11 +1712,20 @@ const SidebarThreadRow = memo(function SidebarThreadRow(props: {
17121712 type="button"
17131713 aria-label="Unpin thread"
17141714 onClick={handleUnpinClick}
1715 className="inline-flex cursor-pointer items-center rounded-sm text-muted-foreground/65 outline-none transition-colors hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring"
1715 className="group/unpin inline-flex cursor-pointer items-center rounded-sm text-muted-foreground/65 outline-none transition-colors hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring"
17161716 />
17171717 }
17181718 >
1719 <PinIcon aria-hidden className="size-3 shrink-0" />
1719 {/* Pin marks the pinned state at rest; hover and focus swap in pin-off so the
1720 icon reads as the action the button performs. */}
1721 <PinIcon
1722 aria-hidden
1723 className="size-3 shrink-0 group-hover/unpin:hidden group-focus-visible/unpin:hidden"
1724 />
1725 <PinOffIcon
1726 aria-hidden
1727 className="hidden size-3 shrink-0 group-hover/unpin:block group-focus-visible/unpin:block"
1728 />
17201729 </TooltipTrigger>
17211730 <TooltipPopup>Unpin thread</TooltipPopup>
17221731 </Tooltip>