From 9b3783b640152dd3fe686bb0c9cb4f2288c43b23 Mon Sep 17 00:00:00 2001
From: Jure <44338+hoornet@users.noreply.github.com>
Date: Thu, 9 Apr 2026 19:27:22 +0200
Subject: [PATCH] =?UTF-8?q?Polish=20pass=2010=20=E2=80=94=20hover=20titles?=
 =?UTF-8?q?,=20focus=20rings,=20disabled=20states?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- NoteCard: title tooltip on truncated name and NIP-05
- NoteActions: emoji pill buttons dim (opacity-50) while disabled
- DMView: title tooltip on truncated conv name; focus ring on send button
- RelaysView: title tooltip on truncated relay URL
- OnboardingFlow: title tooltips on npub/nsec (nsec only when revealed)
- ArticleEditor: visible focus indicator on title and body textareas
---
 src/components/article/ArticleEditor.tsx     | 4 ++--
 src/components/dm/DMView.tsx                 | 4 ++--
 src/components/feed/NoteActions.tsx          | 2 +-
 src/components/feed/NoteCard.tsx             | 3 ++-
 src/components/onboarding/OnboardingFlow.tsx | 4 ++--
 src/components/shared/RelaysView.tsx         | 2 +-
 6 files changed, 10 insertions(+), 9 deletions(-)

diff --git a/src/components/article/ArticleEditor.tsx b/src/components/article/ArticleEditor.tsx
index c3fe015..959c83d 100644
--- a/src/components/article/ArticleEditor.tsx
+++ b/src/components/article/ArticleEditor.tsx
@@ -405,7 +405,7 @@ export function ArticleEditor() {
             value={title}
             onChange={(e) => setTitle(e.target.value)}
             placeholder="Title"
-            className="w-full bg-transparent text-text text-2xl font-bold placeholder:text-text-dim focus:outline-none"
+            className="w-full bg-transparent text-text text-2xl font-bold placeholder:text-text-dim focus:outline-none focus:border-b focus:border-accent/40"
             style={{ fontFamily: "var(--font-reading)" }}
           />
         </div>
@@ -473,7 +473,7 @@ export function ArticleEditor() {
                 if (Array.from(e.dataTransfer.types).includes("Files")) e.preventDefault();
               }}
               placeholder="Write your article in Markdown… (paste or drop images)"
-              className="w-full h-full min-h-[400px] bg-transparent text-text text-[14px] leading-relaxed placeholder:text-text-dim resize-none focus:outline-none font-mono"
+              className="w-full h-full min-h-[400px] bg-transparent text-text text-[14px] leading-relaxed placeholder:text-text-dim resize-none focus:outline-none focus:border-b focus:border-accent/40 font-mono"
             />
           ) : (
             <div
diff --git a/src/components/dm/DMView.tsx b/src/components/dm/DMView.tsx
index 94c9289..3b6f4f2 100644
--- a/src/components/dm/DMView.tsx
+++ b/src/components/dm/DMView.tsx
@@ -66,7 +66,7 @@ function ConvRow({
       )}
       <div className="flex-1 min-w-0">
         <div className="flex items-baseline justify-between gap-1">
-          <span className="text-text text-[12px] font-medium truncate">{name}</span>
+          <span title={name} className="text-text text-[12px] font-medium truncate">{name}</span>
           <span className="text-text-dim text-[10px] shrink-0">{time}</span>
         </div>
         <div className="text-text-dim text-[11px] truncate">
@@ -225,7 +225,7 @@ function ThreadPanel({
           <button
             onClick={handleSend}
             disabled={!text.trim() || sending}
-            className="px-3 self-end py-2 text-[11px] bg-accent hover:bg-accent-hover text-accent-text transition-colors disabled:opacity-30 disabled:cursor-not-allowed shrink-0"
+            className="px-3 self-end py-2 text-[11px] bg-accent hover:bg-accent-hover text-accent-text transition-colors disabled:opacity-30 disabled:cursor-not-allowed shrink-0 focus-visible:ring-1 focus-visible:ring-accent"
           >
             {sending ? "…" : "send"}
           </button>
diff --git a/src/components/feed/NoteActions.tsx b/src/components/feed/NoteActions.tsx
index 16d9d98..2e2d46e 100644
--- a/src/components/feed/NoteActions.tsx
+++ b/src/components/feed/NoteActions.tsx
@@ -102,7 +102,7 @@ export function NoteActions({ event, onReplyToggle, showReply }: NoteActionsProp
                 myReactions.has(emoji)
                   ? "border-accent/40 bg-accent/10 text-accent"
                   : "border-border hover:border-accent/40 hover:bg-accent/5 text-text-dim"
-              } disabled:cursor-default`}
+              } disabled:cursor-default disabled:opacity-50`}
             >
               <span className="text-[13px] leading-none">{emoji}</span>
               <span>{count}</span>
diff --git a/src/components/feed/NoteCard.tsx b/src/components/feed/NoteCard.tsx
index a712663..fba91e3 100644
--- a/src/components/feed/NoteCard.tsx
+++ b/src/components/feed/NoteCard.tsx
@@ -100,9 +100,10 @@ export const NoteCard = memo(function NoteCard({ event, focused, onReplyInThread
             <button
               className="text-text font-medium truncate text-[13px] cursor-pointer hover:text-accent transition-colors text-left"
               onClick={() => openProfile(event.pubkey)}
+              title={name}
             >{name}</button>
             {nip05 && (
-              <span className={`text-[10px] truncate max-w-40 ${verified === "valid" ? "text-success" : "text-text-dim"}`}>
+              <span title={nip05} className={`text-[10px] truncate max-w-40 ${verified === "valid" ? "text-success" : "text-text-dim"}`}>
                 {verified === "valid" ? "✓ " : ""}{nip05}
               </span>
             )}
diff --git a/src/components/onboarding/OnboardingFlow.tsx b/src/components/onboarding/OnboardingFlow.tsx
index 4969b18..4703220 100644
--- a/src/components/onboarding/OnboardingFlow.tsx
+++ b/src/components/onboarding/OnboardingFlow.tsx
@@ -88,7 +88,7 @@ function CreateStep({ onNext }: { onNext: (signer: NDKPrivateKeySigner) => void
           <span className="text-text-dim text-[10px] uppercase tracking-widest">Your public key (npub)</span>
         </div>
         <div className="flex items-center gap-2 px-3 py-2">
-          <span className="text-text font-mono text-[11px] truncate flex-1 select-all">{signer.npub}</span>
+          <span title={signer.npub} className="text-text font-mono text-[11px] truncate flex-1 select-all">{signer.npub}</span>
           <button
             onClick={handleCopy}
             aria-label="Copy public key"
@@ -148,7 +148,7 @@ function BackupStep({ signer, onComplete }: { signer: NDKPrivateKeySigner; onCom
           <span className="text-danger text-[10px] uppercase tracking-widest">Secret key (nsec) — keep private</span>
         </div>
         <div className="flex items-center gap-2 px-3 py-2">
-          <span className={`font-mono text-[11px] truncate flex-1 ${revealed ? "text-text select-all" : "text-text-dim"}`}>
+          <span title={revealed ? signer.nsec : undefined} className={`font-mono text-[11px] truncate flex-1 ${revealed ? "text-text select-all" : "text-text-dim"}`}>
             {revealed ? signer.nsec : "••••••••••••••••••••••••••••••••••••••••••••••••"}
           </span>
           <button
diff --git a/src/components/shared/RelaysView.tsx b/src/components/shared/RelaysView.tsx
index 41bd758..628ad6d 100644
--- a/src/components/shared/RelaysView.tsx
+++ b/src/components/shared/RelaysView.tsx
@@ -56,7 +56,7 @@ function RelayHealthCard({ result, poolConnected, onRemove }: { result: RelayHea
         />
         <div className="flex-1 min-w-0">
           <div className="flex items-center gap-2">
-            <span className="text-text truncate font-mono">{result.url}</span>
+            <span title={result.url} className="text-text truncate font-mono">{result.url}</span>
             {nip11?.name && (
               <span className="text-text-dim text-[10px] truncate">({nip11.name})</span>
             )}