5bd314deb2
- Phase 1-5: UI framework, auth, weapon schemes, color filters, system optimization - Industrial/tech design style with Chinese localization - Points to gch3n.online/delta backend API - Hardware monitor, filter editor, and all module pages
26 lines
776 B
TypeScript
26 lines
776 B
TypeScript
import React from 'react';
|
|
|
|
type BadgeVariant = 'default' | 'vip' | 'success' | 'warning' | 'error';
|
|
|
|
interface BadgeProps {
|
|
children: React.ReactNode;
|
|
variant?: BadgeVariant;
|
|
className?: string;
|
|
}
|
|
|
|
const styleMap: Record<BadgeVariant, string> = {
|
|
default: 'border-[#333] text-[#555]',
|
|
vip: 'border-[#ff4500]/40 text-[#ff4500]',
|
|
success: 'border-[#ff4500]/40 text-[#ff4500]',
|
|
warning: 'border-[#ff4500]/40 text-[#ff4500]',
|
|
error: 'border-[#cc3300]/40 text-[#cc3300]',
|
|
};
|
|
|
|
export default function Badge({ children, variant = 'default', className = '' }: BadgeProps) {
|
|
return (
|
|
<span className={`inline-block px-1.5 py-0.5 text-[8px] font-semibold tracking-[0.08em] uppercase border ${styleMap[variant]} ${className}`}>
|
|
{children}
|
|
</span>
|
|
);
|
|
}
|