From 05fbcacb0821e2fe27469a30bab7e2505e530781 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Wed, 14 Jan 2026 10:33:40 +0000
Subject: [PATCH] refactor: Improve premium gradient with glowy orange/yellow
 tones
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Changes:
- Replace rainbow gradient with warm orange/yellow gradient (amber-400 → orange-400 → orange-500)
- Add glow effects with text-shadow and drop-shadow for a luminous appearance
- Remove gradient from NIP-05 display, keep it plain with orange checkmark badge
- Gradient now only applies to username, not NIP-05 identifier

The new gradient focuses on warm tones that create a subtle glow effect, making premium users stand out without being overwhelming.
---
 src/components/nostr/nip05.tsx | 12 ++----------
 src/index.css                  | 11 ++++++-----
 2 files changed, 8 insertions(+), 15 deletions(-)

diff --git a/src/components/nostr/nip05.tsx b/src/components/nostr/nip05.tsx
index 6aa0d50..43c6f00 100644
--- a/src/components/nostr/nip05.tsx
+++ b/src/components/nostr/nip05.tsx
@@ -1,7 +1,6 @@
 import { useNip05 } from "@/hooks/useNip05";
 import { ProfileContent } from "applesauce-core/helpers";
 import { isGrimoirePremium, isGrimoireNip05 } from "@/lib/nip05-grimoire";
-import { cn } from "@/lib/utils";
 import { Check } from "lucide-react";
 
 export function QueryNip05({
@@ -21,16 +20,9 @@ export function QueryNip05({
   const displayNip05 = nip05.replace(/^_@/, "");
 
   return (
-    <span
-      className={cn(
-        "flex items-center gap-1",
-        isPremium && "text-grimoire-gradient font-semibold",
-      )}
-    >
+    <span className="flex items-center gap-1">
       {displayNip05}
-      {isPremium && (
-        <Check className="inline-block h-3 w-3 text-grimoire-gradient" />
-      )}
+      {isPremium && <Check className="inline-block h-3 w-3 text-orange-400" />}
     </span>
   );
 }
diff --git a/src/index.css b/src/index.css
index d6c47f4..88795e8 100644
--- a/src/index.css
+++ b/src/index.css
@@ -105,15 +105,16 @@
 
   .text-grimoire-gradient {
     background: linear-gradient(
-      to bottom,
-      rgb(250 204 21),
-      /* yellow-400 */ rgb(251 146 60),
-      /* orange-400 */ rgb(168 85 247),
-      /* purple-500 */ rgb(34 211 238) /* cyan-400 */
+      135deg,
+      rgb(251 191 36) 0%,
+      /* amber-400 */ rgb(251 146 60) 50%,
+      /* orange-400 */ rgb(249 115 22) 100% /* orange-500 */
     );
     background-clip: text;
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
+    text-shadow: 0 0 20px rgba(251, 146, 60, 0.5);
+    filter: drop-shadow(0 0 8px rgba(251, 146, 60, 0.4));
   }
 }