|
export interface RankingBadge { |
|
className: string; |
|
icon: string | null; |
|
} |
|
|
|
export const getRankingBadge = (rank: number): RankingBadge => { |
|
if (rank === 1) { |
|
return { |
|
className: "absolute -top-4 -left-4 w-12 h-12 bg-gradient-to-br from-yellow-400 via-yellow-500 to-yellow-600 text-white rounded-full flex items-center justify-center text-lg font-bold shadow-2xl border-4 border-yellow-300", |
|
icon: "π" |
|
}; |
|
} else if (rank === 2) { |
|
return { |
|
className: "absolute -top-4 -left-4 w-10 h-10 bg-gradient-to-br from-gray-300 via-gray-400 to-gray-500 text-white rounded-full flex items-center justify-center text-base font-bold shadow-xl border-3 border-gray-200", |
|
icon: "π₯" |
|
}; |
|
} else if (rank === 3) { |
|
return { |
|
className: "absolute -top-4 -left-4 w-10 h-10 bg-gradient-to-br from-amber-600 via-amber-700 to-amber-800 text-white rounded-full flex items-center justify-center text-base font-bold shadow-xl border-3 border-amber-400", |
|
icon: "π₯" |
|
}; |
|
} else { |
|
return { |
|
className: "absolute -top-3 -left-3 w-8 h-8 bg-gradient-to-br from-blue-500 to-blue-600 text-white rounded-full flex items-center justify-center text-sm font-bold shadow-lg", |
|
icon: null |
|
}; |
|
} |
|
}; |