mirror of
https://github.com/purrgrammer/grimoire.git
synced 2026-04-10 07:27:23 +02:00
refactor: Improve premium gradient with glowy orange/yellow tones
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.
This commit is contained in:
@@ -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>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -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));
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user