fix: remove emoji from UI, fix JSX structure, add microanimations
Some checks failed
Deploy Fediversion / deploy (push) Failing after 1s

This commit is contained in:
fullsizemalt 2025-12-29 21:56:31 -08:00
parent 0c7df04b92
commit 0f571864e0
2 changed files with 13 additions and 11 deletions

View file

@ -272,16 +272,18 @@ function BandGrid({
return (
<Card
key={band.id}
className={`relative overflow-hidden transition-all ${tier === "headliner" ? "ring-2 ring-yellow-500 bg-yellow-500/5" :
className={`relative overflow-hidden transition-all duration-200 hover:scale-[1.02] hover:shadow-lg ${tier === "headliner" ? "ring-2 ring-yellow-500 bg-yellow-500/5" :
tier === "ignored" ? "opacity-60 grayscale" :
tier ? "ring-1 ring-primary/30" : ""
}`}
>
<CardHeader className="p-4 pb-2">
<div className="flex items-start justify-between">
<div>
<span className="text-2xl">{band.emoji || "🎵"}</span>
<CardTitle className="text-base mt-1">{band.name}</CardTitle>
<div className="flex items-start justify-between gap-2">
<div className="flex items-center gap-3">
<div className="w-10 h-10 rounded-lg bg-primary/10 flex items-center justify-center text-primary font-bold text-sm transition-colors">
{band.name.substring(0, 2).toUpperCase()}
</div>
<CardTitle className="text-base">{band.name}</CardTitle>
</div>
{isUpdating && (
<Loader2 className="h-4 w-4 animate-spin" />
@ -294,7 +296,7 @@ function BandGrid({
<button
onClick={() => setTier(band.id, tier === "headliner" ? "main_stage" : "headliner")}
disabled={isUpdating}
className={`flex-1 p-2 rounded-lg text-xs font-medium transition-all ${tier === "headliner"
className={`flex-1 p-2 rounded-lg text-xs font-medium transition-all duration-150 active:scale-95 ${tier === "headliner"
? "bg-yellow-500 text-black"
: "bg-muted hover:bg-yellow-500/20"
}`}
@ -307,7 +309,7 @@ function BandGrid({
<button
onClick={() => setTier(band.id, tier === "main_stage" ? null : "main_stage")}
disabled={isUpdating}
className={`flex-1 p-2 rounded-lg text-xs font-medium transition-all ${tier === "main_stage" || tier === "supporting"
className={`flex-1 p-2 rounded-lg text-xs font-medium transition-all duration-150 active:scale-95 ${tier === "main_stage" || tier === "supporting"
? "bg-primary text-primary-foreground"
: "bg-muted hover:bg-primary/20"
}`}
@ -320,7 +322,7 @@ function BandGrid({
<button
onClick={() => setTier(band.id, tier === "ignored" ? null : "ignored")}
disabled={isUpdating}
className={`flex-1 p-2 rounded-lg text-xs font-medium transition-all ${tier === "ignored"
className={`flex-1 p-2 rounded-lg text-xs font-medium transition-all duration-150 active:scale-95 ${tier === "ignored"
? "bg-destructive text-destructive-foreground"
: "bg-muted hover:bg-destructive/20"
}`}

View file

@ -451,7 +451,7 @@ function ProfileSection({
<div className="grid gap-4 md:grid-cols-3">
<div className="space-y-2">
<Label htmlFor="bluesky" className="flex items-center gap-2">
<span className="text-sky-500">🦋</span> BlueSky
BlueSky
</Label>
<Input
id="bluesky"
@ -462,7 +462,7 @@ function ProfileSection({
</div>
<div className="space-y-2">
<Label htmlFor="mastodon" className="flex items-center gap-2">
<span className="text-purple-500">🐘</span> Mastodon
Mastodon
</Label>
<Input
id="mastodon"
@ -473,7 +473,7 @@ function ProfileSection({
</div>
<div className="space-y-2">
<Label htmlFor="instagram" className="flex items-center gap-2">
<span className="text-pink-500">📷</span> Instagram
Instagram
</Label>
<Input
id="instagram"