- 新增事件总线式toast通知系统 - 新增头像、阅读进度、404/500错误页等基础组件 - 重构页脚、布局、分页、点赞按钮等现有组件 - 新增用户个人页、通知中心、帖子编辑/发布/置顶/推荐管理功能 - 优化登录注册页面样式与交互 - 修复路径类型文件引用,更新站点元信息与字体配置
36 lines
976 B
TypeScript
36 lines
976 B
TypeScript
// 柔和多色头像:按用户名确定性取色,圆形软底,浅/暗主题在 globals.css 各自配色
|
|
function hash(s: string) {
|
|
let h = 0;
|
|
for (let i = 0; i < s.length; i++) h = (h * 31 + s.charCodeAt(i)) >>> 0;
|
|
return h;
|
|
}
|
|
|
|
export default function Avatar({
|
|
name,
|
|
size = 36,
|
|
src,
|
|
className = "",
|
|
}: {
|
|
name: string;
|
|
size?: number;
|
|
src?: string | null;
|
|
className?: string;
|
|
}) {
|
|
const idx = hash(name || "?") % 8;
|
|
const initial = (name || "?").trim().charAt(0).toUpperCase();
|
|
return (
|
|
<span
|
|
className={`inline-flex items-center justify-center shrink-0 select-none font-bold rounded-full overflow-hidden av-${idx} ${className}`}
|
|
style={{ width: size, height: size, fontSize: size * 0.42 }}
|
|
aria-hidden="true"
|
|
>
|
|
{src ? (
|
|
// eslint-disable-next-line @next/next/no-img-element
|
|
<img src={src} alt="" className="w-full h-full object-cover" />
|
|
) : (
|
|
initial
|
|
)}
|
|
</span>
|
|
);
|
|
}
|