留言/回复卡片 — 状态变体

共 8 个变体,覆盖普通读者留言 + 两位作者回复(蓝/粉色区分)。

普通读者留言

游客小明 2026-06-28 14:30

博客设计得很好看!特别喜欢宠物小窝的功能,阿喵和阿汪太可爱了。

默认
白底 + 灰边框,读者紫色头像
技术爱好者 2026-06-27 09:15

看了你的 NestJS 实战文章,受益匪浅!不过有个问题,你在文中提到的 JWT 刷新 Token 方案,在实际项目中有没有遇到 Token 过期导致请求失败的情况?我最近也在做类似的功能,想参考一下你的实现思路。如果能出一期详细的教程就更好了!

长留言
内容较多,自然换行,无截断
小红 2026-06-26 20:00
@游客小明:博客设计得很好看!

是的!我也觉得宠物功能超有趣,期待 AI 对话版本~

回复引用
浅灰引用框 + 左侧边框线
匿名用户 待审核 2026-06-29 08:00

这条留言还在审核中,只有作者可见...

待审核
半透明 + 待审核角标,仅作者可见

作者回复

宁白久 作者 2026-06-28 15:00

谢谢支持!宠物功能还在持续开发中,后续会加入更多互动玩法~

宁白久回复(蓝色系)
浅蓝背景 + 蓝色边框 + 蓝色头像环 + 作者标签
Q
刘小Q 作者 2026-06-28 16:30

阿喵和阿汪会继续努力卖萌的!🐱🐶

刘小Q 回复(粉色系)
浅粉背景 + 粉色边框 + 粉色头像环 + 作者标签
宁白久 作者 2026-06-27 10:00
@技术爱好者:JWT 刷新 Token 方案...

好问题!在实际项目中确实遇到过,后续我会出一期详细的教程,包括踩坑经验。可以先关注我~

作者回复 + 引用
引用框用白色半透明 + 蓝色左边框
宁白久 作者 📌 置顶 2026-06-20 12:00

博客正在持续优化中,欢迎提建议和反馈 bug!如果你有好的内容想要分享,也可以联系我们投稿。

作者置顶回复
加粗边框 + 置顶标签,始终显示在留言区顶部

留言区空态

💬
还没有留言
来做第一个留言的人吧!
空留言区
无人留言时的引导提示

设计 Tokens

Token 普通留言 宁白久回复 刘小Q 回复
背景色 white blue-50 pink-50
边框色 #e5e5e5 blue-100 pink-100
头像环 ring-2 ring-blue-200 ring-2 ring-pink-200
作者标签 blue-100 bg + blue-600 text pink-100 bg + pink-600 text
引用框 bg-[#f5f5f5] + border-l-2 border-[#d4d4d4](普通)/ border-blue-200(蓝作者)