mirror of
https://github.com/purrgrammer/grimoire.git
synced 2026-04-13 17:07:27 +02:00
refine: improve gradients to match theme colors and work across themes
Updates both Grimoire member gradients to better align with their non-member equivalents while ensuring visibility in both light and dark themes: **Logged-in gradient** (orange-dominant to match highlight color): - Changed: yellow-500 → orange-500 → orange-600 - To: orange-400 → orange-500 → amber-600 - Matches highlight (HSL 25 90% 35% light, 27 96% 61% dark) **Non-logged-in gradient** (purple-dominant to match accent color): - Changed: blue-400 → purple-400 → purple-500 - To: violet-500 → purple-500 → fuchsia-600 - Matches accent (HSL 270 100% 70% dark) - More saturated to stand out in light theme Both gradients now maintain their primary colors while being more visible and consistent across light and dark themes.
This commit is contained in:
@@ -14,10 +14,10 @@ interface UserNameProps {
|
||||
* Component that displays a user's name from their Nostr profile
|
||||
* Shows placeholder derived from pubkey while loading or if no profile exists
|
||||
* Clicking opens the user's profile
|
||||
* Uses highlight color for the logged-in user (themeable amber)
|
||||
* Uses highlight color for the logged-in user (themeable orange)
|
||||
* Shows Grimoire members with gradient styling:
|
||||
* - Orange-yellow gradient for logged-in Grimoire member
|
||||
* - Purple-blue gradient for other Grimoire members
|
||||
* - Orange gradient for logged-in Grimoire member (matches highlight)
|
||||
* - Purple-pink gradient for other Grimoire members (matches accent)
|
||||
*/
|
||||
export function UserName({ pubkey, isMention, className }: UserNameProps) {
|
||||
const { addWindow, state } = useGrimoire();
|
||||
@@ -40,8 +40,8 @@ export function UserName({ pubkey, isMention, className }: UserNameProps) {
|
||||
"font-semibold cursor-crosshair hover:underline hover:decoration-dotted",
|
||||
isGrimoire
|
||||
? isActiveAccount
|
||||
? "bg-gradient-to-br from-yellow-500 via-orange-500 to-orange-600 bg-clip-text text-transparent"
|
||||
: "bg-gradient-to-br from-blue-400 via-purple-400 to-purple-500 bg-clip-text text-transparent"
|
||||
? "bg-gradient-to-br from-orange-400 via-orange-500 to-amber-600 bg-clip-text text-transparent"
|
||||
: "bg-gradient-to-br from-violet-500 via-purple-500 to-fuchsia-600 bg-clip-text text-transparent"
|
||||
: isActiveAccount
|
||||
? "text-highlight"
|
||||
: "text-accent",
|
||||
|
||||
Reference in New Issue
Block a user