Polish pass — consistency, a11y, theme correctness

- Fix bg-white toggle thumbs in Settings (broke on dark themes)
- Eliminate 2px layout shift when switching Media feed tabs
- Unify "Follow"/"Mute" capitalization in NoteCard context menu
- Replace ASCII "..." with unicode ellipsis across compose/search/article
- Add rounded-sm to dropdowns, emoji picker, post/reply buttons
- Add aria-labels to sidebar toggle and onboarding copy buttons
- Add role=tablist/tab/aria-selected to login mode tabs
- Replace inline width/height styles with Tailwind w-16 h-16 in ProfileView
- Replace inline transform style with rotate-90 class in SettingsView
- Unify sidebar active state opacity (bg-accent/8 → bg-accent/10)
- Pad sidebar badges with py-0.5 for consistent pill height
- Match thread reply button sizing to compose post button
- Use var(--font-reading) on non-zen article title for consistency
- Format 'saved Xs ago' as minutes/hours after 60s
- Unify expand chevron to ▶ + rotate-90 pattern
- PollWidget: transition-all → transition-colors (no layout animation)
- Remove cryptic 'Ctrl+Enter' hint from compose and thread reply
This commit is contained in:
Jure
2026-04-09 13:32:59 +02:00
parent acd5a5979b
commit d134702da7
15 changed files with 49 additions and 35 deletions
+3 -4
View File
@@ -270,7 +270,7 @@ export function ComposeBox({ onPublished, onNoteInjected }: { onPublished?: () =
)}
<button
onClick={() => removeAttachment(i)}
className="absolute -top-1.5 -right-1.5 w-4 h-4 bg-danger text-accent-text text-[10px] rounded-full flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity"
className="absolute -top-1.5 -right-1.5 w-4 h-4 bg-danger text-white text-[10px] rounded-full flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity"
title="Remove"
>
x
@@ -328,15 +328,14 @@ export function ComposeBox({ onPublished, onNoteInjected }: { onPublished?: () =
<button
onClick={() => setIsPoll((v) => !v)}
title={isPoll ? "Cancel poll" : "Create poll"}
className={`text-[14px] transition-colors ${isPoll ? "text-accent" : "text-text-dim hover:text-text"}`}
className={`text-[16px] transition-colors ${isPoll ? "text-accent" : "text-text-dim hover:text-text"}`}
>
&#9634;&#9634;
</button>
<span className="text-text-dim text-[10px]">Ctrl+Enter to post</span>
<button
onClick={handlePublish}
disabled={!canPost}
className="px-3 py-1 text-[11px] bg-accent hover:bg-accent-hover text-accent-text transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
className="px-3 py-1 text-[11px] bg-accent hover:bg-accent-hover text-accent-text rounded-sm transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
>
{publishing ? "posting…" : isPoll ? "post poll" : "post"}
</button>