freefire
1eaf3903d4
- 新增事件总线式toast通知系统 - 新增头像、阅读进度、404/500错误页等基础组件 - 重构页脚、布局、分页、点赞按钮等现有组件 - 新增用户个人页、通知中心、帖子编辑/发布/置顶/推荐管理功能 - 优化登录注册页面样式与交互 - 修复路径类型文件引用，更新站点元信息与字体配置
85 lines
2.0 KiB
TypeScript
85 lines
2.0 KiB
TypeScript
// 统一的细线统计图标（避免 emoji 渲染不一致）
|
|
interface IconProps {
|
|
size?: number;
|
|
filled?: boolean;
|
|
className?: string;
|
|
}
|
|
|
|
export function IconComment({ size = 14, className }: IconProps) {
|
|
return (
|
|
<svg
|
|
width={size}
|
|
height={size}
|
|
viewBox="0 0 24 24"
|
|
fill="none"
|
|
stroke="currentColor"
|
|
strokeWidth={2}
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
className={className}
|
|
aria-hidden
|
|
>
|
|
<path d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z" />
|
|
</svg>
|
|
);
|
|
}
|
|
|
|
export function IconEye({ size = 14, className }: IconProps) {
|
|
return (
|
|
<svg
|
|
width={size}
|
|
height={size}
|
|
viewBox="0 0 24 24"
|
|
fill="none"
|
|
stroke="currentColor"
|
|
strokeWidth={2}
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
className={className}
|
|
aria-hidden
|
|
>
|
|
<path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z" />
|
|
<circle cx="12" cy="12" r="3" />
|
|
</svg>
|
|
);
|
|
}
|
|
|
|
export function IconHeart({ size = 14, filled, className }: IconProps) {
|
|
return (
|
|
<svg
|
|
width={size}
|
|
height={size}
|
|
viewBox="0 0 24 24"
|
|
fill={filled ? "currentColor" : "none"}
|
|
stroke="currentColor"
|
|
strokeWidth={2}
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
className={className}
|
|
aria-hidden
|
|
>
|
|
<path d="M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z" />
|
|
</svg>
|
|
);
|
|
}
|
|
|
|
export function StatItem({
|
|
icon,
|
|
value,
|
|
accent,
|
|
}: {
|
|
icon: React.ReactNode;
|
|
value: number | string;
|
|
accent?: boolean;
|
|
}) {
|
|
return (
|
|
<span
|
|
className="inline-flex items-center gap-1.5 meta"
|
|
style={accent ? { color: "var(--accent)" } : undefined}
|
|
>
|
|
{icon}
|
|
{value}
|
|
</span>
|
|
);
|
|
}
|