From 3eb6968de0811b0f8b30b13f2b50b04e2c132af1 Mon Sep 17 00:00:00 2001
From: Jure <44338+hoornet@users.noreply.github.com>
Date: Thu, 9 Apr 2026 15:47:12 +0200
Subject: [PATCH] =?UTF-8?q?Polish=20pass=204=20=E2=80=94=20remove=20remain?=
 =?UTF-8?q?ing=20hard-coded=20colors=20and=20inline=20styles?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Fix bg-white toggle thumbs in V4VSettings and V4VIndicator
- Replace hard-coded amber nudge colors with theme 'warning' token
- Remove redundant gridTemplateRows and move aspectRatio to Tailwind
- Replace MarkdownToolbar inline font styles with conditional classes
---
 src/components/article/MarkdownToolbar.tsx | 3 +--
 src/components/feed/NoteContent.tsx        | 5 ++---
 src/components/podcast/V4VIndicator.tsx    | 5 ++---
 src/components/v4v/V4VSettings.tsx         | 2 +-
 4 files changed, 6 insertions(+), 9 deletions(-)

diff --git a/src/components/article/MarkdownToolbar.tsx b/src/components/article/MarkdownToolbar.tsx
index af0722f..60e6a98 100644
--- a/src/components/article/MarkdownToolbar.tsx
+++ b/src/components/article/MarkdownToolbar.tsx
@@ -180,8 +180,7 @@ export function MarkdownToolbar({ textareaRef, content, setContent, setUploading
           key={action}
           onClick={() => handleClick(action)}
           title={title}
-          className="px-2 py-0.5 text-[11px] text-text-muted hover:text-text hover:bg-bg-hover transition-colors rounded-sm"
-          style={{ fontWeight: bold ? "bold" : undefined, fontStyle: italic ? "italic" : undefined }}
+          className={`px-2 py-0.5 text-[11px] text-text-muted hover:text-text hover:bg-bg-hover transition-colors rounded-sm ${bold ? "font-bold" : ""} ${italic ? "italic" : ""}`}
         >
           {label}
         </button>
diff --git a/src/components/feed/NoteContent.tsx b/src/components/feed/NoteContent.tsx
index 137f217..e3cfac8 100644
--- a/src/components/feed/NoteContent.tsx
+++ b/src/components/feed/NoteContent.tsx
@@ -53,13 +53,12 @@ function ImageGrid({ images, onImageClick }: { images: string[]; onImageClick: (
 
   if (count === 3) {
     return (
-      <div className="mt-2 grid grid-cols-2 grid-rows-2 gap-1" style={{ gridTemplateRows: "1fr 1fr" }}>
+      <div className="mt-2 grid grid-cols-2 grid-rows-2 gap-1">
         <img
           src={visible[0]}
           alt="Posted image"
           loading="lazy"
-          className="w-full h-full rounded-sm object-cover bg-bg-raised border border-border cursor-zoom-in row-span-2"
-          style={{ aspectRatio: "3/4" }}
+          className="w-full h-full rounded-sm object-cover bg-bg-raised border border-border cursor-zoom-in row-span-2 aspect-[3/4]"
           onClick={(e) => { e.stopPropagation(); onImageClick(0); }}
           onError={(e) => { (e.target as HTMLImageElement).style.display = "none"; }}
         />
diff --git a/src/components/podcast/V4VIndicator.tsx b/src/components/podcast/V4VIndicator.tsx
index bc06f16..e275636 100644
--- a/src/components/podcast/V4VIndicator.tsx
+++ b/src/components/podcast/V4VIndicator.tsx
@@ -137,9 +137,8 @@ export function V4VIndicator() {
       {/* Brief nudge when V4V episode starts — once per episode per session */}
       {showNudge && (
         <div
-          className="absolute bottom-full right-0 mb-2 px-3 py-2 bg-amber-500/15 border border-amber-500/30 rounded-sm text-[10px] text-amber-300 whitespace-nowrap z-50 animate-fade-in"
+          className="absolute bottom-full right-0 mb-2 px-3 py-2 bg-warning/15 border border-warning/30 rounded-sm text-[10px] text-warning whitespace-nowrap z-50 animate-fade-in cursor-pointer"
           onClick={() => { setShowNudge(false); setOpen(true); }}
-          style={{ cursor: "pointer" }}
         >
           ⚡ This episode supports V4V — stream sats to the creators
         </div>
@@ -181,7 +180,7 @@ export function V4VIndicator() {
                   }`}
                 >
                   <span
-                    className={`absolute top-0.5 w-3 h-3 rounded-full bg-white transition-transform ${
+                    className={`absolute top-0.5 w-3 h-3 rounded-full bg-bg transition-transform ${
                       v4vStreaming ? "left-4" : "left-0.5"
                     }`}
                   />
diff --git a/src/components/v4v/V4VSettings.tsx b/src/components/v4v/V4VSettings.tsx
index b05c265..16d0363 100644
--- a/src/components/v4v/V4VSettings.tsx
+++ b/src/components/v4v/V4VSettings.tsx
@@ -35,7 +35,7 @@ export function V4VSettings() {
             }`}
           >
             <span
-              className={`absolute top-0.5 w-4 h-4 rounded-full bg-white transition-transform ${
+              className={`absolute top-0.5 w-4 h-4 rounded-full bg-bg transition-transform ${
                 autoEnabled ? "left-4.5" : "left-0.5"
               }`}
             />