24 lines
855 B
JavaScript
24 lines
855 B
JavaScript
import React from 'react'
|
|
|
|
const TONE_CLASSNAMES = {
|
|
slate: 'border-white/12 bg-white/[0.06] text-slate-100',
|
|
sky: 'border-sky-300/25 bg-sky-400/12 text-sky-100',
|
|
emerald: 'border-emerald-300/25 bg-emerald-400/12 text-emerald-100',
|
|
amber: 'border-amber-300/25 bg-amber-400/12 text-amber-100',
|
|
rose: 'border-rose-300/25 bg-rose-400/12 text-rose-100',
|
|
violet: 'border-violet-300/25 bg-violet-400/12 text-violet-100',
|
|
}
|
|
|
|
export default function WorldChallengeStatusBadge({ label, tone = 'slate', className = '' }) {
|
|
if (!label) {
|
|
return null
|
|
}
|
|
|
|
const toneClassName = TONE_CLASSNAMES[tone] || TONE_CLASSNAMES.slate
|
|
|
|
return (
|
|
<span className={`inline-flex items-center gap-1.5 rounded-full border px-3 py-1 text-[11px] font-semibold uppercase tracking-[0.16em] ${toneClassName} ${className}`.trim()}>
|
|
{label}
|
|
</span>
|
|
)
|
|
} |