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: {...@@ -1712,11 +1712,20 @@ const SidebarThreadRow = memo(function SidebarThreadRow(props: {
1712 type="button"1712 type="button"
1713 aria-label="Unpin thread"1713 aria-label="Unpin thread"
1714 onClick={handleUnpinClick}1714 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"
1716 />1716 />
1717 }1717 }
1718 >1718 >
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 />
1720 </TooltipTrigger>1729 </TooltipTrigger>
1721 <TooltipPopup>Unpin thread</TooltipPopup>1730 <TooltipPopup>Unpin thread</TooltipPopup>
1722 </Tooltip>1731 </Tooltip>