From ea280c9389dffcad1dbc03fb2da47dbad9099222 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Fri, 23 Jan 2026 12:37:41 +0000
Subject: [PATCH] style(nip56): use dotted underline hover, reduce spacing

- Remove background highlight on hover
- Use underline dotted with cursor crosshair (consistent with app)
- Reduce gap between header and quoted event

https://claude.ai/code/session_012ux81GyM8iZ1GLnKHC7esJ
---
 src/components/nostr/kinds/ReportRenderer.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/components/nostr/kinds/ReportRenderer.tsx b/src/components/nostr/kinds/ReportRenderer.tsx
index 3359a98..1255a8a 100644
--- a/src/components/nostr/kinds/ReportRenderer.tsx
+++ b/src/components/nostr/kinds/ReportRenderer.tsx
@@ -77,11 +77,11 @@ export function ReportRenderer({ event }: BaseEventProps) {
 
   return (
     <BaseEventContainer event={event}>
-      <div className="flex flex-col gap-3">
+      <div className="flex flex-col gap-2">
         {/* Report header: "Reported <username> for <reason>" - whole line clickable */}
         <button
           onClick={openReportDetail}
-          className="flex items-center gap-1.5 flex-wrap text-sm text-left hover:bg-muted/30 -mx-1 px-1 py-0.5 rounded cursor-pointer"
+          className="flex items-center gap-1.5 flex-wrap text-sm text-left hover:underline decoration-dotted cursor-crosshair"
         >
           <Flag className="size-4 text-muted-foreground flex-shrink-0" />
           <span className="text-muted-foreground">Reported</span>
@@ -97,6 +97,7 @@ export function ReportRenderer({ event }: BaseEventProps) {
             eventPointer={{ id: report.reportedEventId }}
             depth={2}
             hidePreview
+            className="mt-0"
           />
         )}