import { Dropdown } from 'antd'; import { BgColorsOutlined } from '@ant-design/icons'; import { useAppStore, THEME_OPTIONS } from '../stores/app'; export default function ThemeSwitcher() { const theme = useAppStore((s) => s.theme); const setTheme = useAppStore((s) => s.setTheme); const content = (
{THEME_OPTIONS.map((opt) => { const active = theme === opt.key; return (
setTheme(opt.key)} style={{ display: 'flex', alignItems: 'center', gap: 12, padding: '10px 12px', borderRadius: 8, cursor: 'pointer', border: `2px solid ${active ? opt.preview.primary : 'transparent'}`, background: active ? `${opt.preview.primary}08` : 'transparent', transition: 'all 0.15s ease', }} > {/* 色块预览 */}
{opt.label}
{opt.desc}
{active && (
)}
); })}
); return ( content} trigger={['click']} placement="bottomRight">
); }