polish(frontend): 侧栏与徽章可读性,智能悬停提示
降权全站字重;优化右栏公告/数据块;类型状态徽章用固定浅色区分;TipHost 仅在文案不一致、非文字或省略时显示。 Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
@@ -2,14 +2,14 @@ import Link from "next/link";
|
||||
import { ArrowLeft } from "lucide-react";
|
||||
import type { PostListItem } from "@/lib/api";
|
||||
import { formatRelative } from "@/lib/format";
|
||||
import { normalizePostType, postTypeLabel, contentAccessLabel, typeStatusLabel } from "@/lib/postMeta";
|
||||
import { normalizePostType, postTypeLabel, contentAccessLabel, typeStatusLabel, typeStatusClass } from "@/lib/postMeta";
|
||||
import LikeButton from "./LikeButton";
|
||||
import Avatar from "./Avatar";
|
||||
import { IconComment, IconEye } from "./Icons";
|
||||
|
||||
/**
|
||||
* 帖子列表行(参考社区信息流样式):
|
||||
* 大头像 + 加粗标题(徽章内联)+ 第二行「板块 · 作者 · 发布时间 ← 最后回复」+
|
||||
* 大头像 + 标题(徽章内联)+ 第二行「板块 · 作者 · 发布时间 ← 最后回复」+
|
||||
* 右侧评论数等统计垂直居中。用于首页/板块页/搜索结果。
|
||||
*/
|
||||
export default function PostRow({
|
||||
@@ -31,6 +31,7 @@ export default function PostRow({
|
||||
const replied = lastReply && new Date(lastReply.created_at).getTime() > new Date(post.created_at).getTime() + 60_000;
|
||||
const pt = normalizePostType(post.post_type);
|
||||
const statusBadge = pt !== "discussion" ? typeStatusLabel(pt, post.type_status) : "";
|
||||
const statusClass = statusBadge ? typeStatusClass(pt, post.type_status) : "";
|
||||
|
||||
return (
|
||||
<div
|
||||
@@ -65,9 +66,7 @@ export default function PostRow({
|
||||
aria-label={post.title}
|
||||
>
|
||||
<h3
|
||||
className={`font-bold leading-snug truncate transition-colors group-hover:text-[var(--accent)] ${
|
||||
compact ? "text-[15px]" : "text-[16px] sm:text-[17px]"
|
||||
}`}
|
||||
className="text-[15px] font-normal leading-snug truncate transition-colors group-hover:text-[var(--accent)]"
|
||||
style={{ color: "var(--ink)" }}
|
||||
>
|
||||
{post.title}
|
||||
@@ -78,8 +77,8 @@ export default function PostRow({
|
||||
{pt !== "discussion" && pt !== "question" && (
|
||||
<span className="badge-type shrink-0">{postTypeLabel(post.post_type)}</span>
|
||||
)}
|
||||
{statusBadge && (
|
||||
<span className="badge-access shrink-0">{statusBadge}</span>
|
||||
{statusBadge && statusClass && (
|
||||
<span className={`${statusClass} shrink-0`}>{statusBadge}</span>
|
||||
)}
|
||||
{post.content_access && post.content_access !== "public" && (
|
||||
<span className="badge-access shrink-0">{contentAccessLabel(post.content_access)}</span>
|
||||
@@ -98,7 +97,7 @@ export default function PostRow({
|
||||
)}
|
||||
<Link
|
||||
href={`/u/${post.user.id}`}
|
||||
className="font-semibold hover:text-[var(--accent)] transition-colors"
|
||||
className="hover:text-[var(--accent)] transition-colors"
|
||||
style={{ color: "var(--ink-2)" }}
|
||||
>
|
||||
{post.user.nickname}
|
||||
|
||||
Reference in New Issue
Block a user