fix: remove emoji from UI, fix JSX structure, add microanimations
Some checks failed
Deploy Fediversion / deploy (push) Failing after 1s
Some checks failed
Deploy Fediversion / deploy (push) Failing after 1s
This commit is contained in:
parent
0c7df04b92
commit
0f571864e0
2 changed files with 13 additions and 11 deletions
|
|
@ -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"
|
||||
}`}
|
||||
|
|
|
|||
|
|
@ -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"
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue