feat(about): 增强 Artalk 评论系统 UI 和配置

- 为移动端和桌面端添加不同的样式适配
- 实现评论内容截断显示及展开/收起功能
- 将 JavaScript 和 TypeScript 分类调整为前端技术栈
- 新增 RocketMQ、多种前端框架和技术到技能配置中
- 添加 UI 增强逻辑以提升用户体验
- 优化夜间模式下的按钮样式和阴影效果
This commit is contained in:
hehh
2025-11-24 02:41:36 +08:00
parent c59655a585
commit 27420c555f
3 changed files with 56 additions and 3 deletions

View File

@@ -1384,6 +1384,16 @@ body {
transition: opacity 0.2s;
}
#artalk-container.atk-mobile .atk-main-editor { padding: 12px; font-size: 0.95rem; }
#artalk-container.atk-mobile .atk-comment-wrap { padding: 12px 14px; font-size: 0.95rem; }
#artalk-container.atk-mobile .atk-avatar { width: 28px; height: 28px; }
#artalk-container.atk-mobile .atk-meta { font-size: 12px; }
#artalk-container.atk-desktop .atk-main-editor { padding: 18px 22px; }
#artalk-container.atk-desktop .atk-comment-wrap { padding: 18px 22px; line-height: 1.7; }
#artalk-container .atk-content.clamped { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
#artalk-container .atk-expand-btn { margin-top: 8px; padding: 6px 10px; border-radius: 14px; border: none; cursor: pointer; background: var(--accent); color: #fff; box-shadow: 0 4px 10px rgba(108,92,231,0.25); }
[data-theme="night"] #artalk-container .atk-expand-btn { background: linear-gradient(135deg, #a1c4fd, #6c5ce7); box-shadow: 0 4px 12px rgba(108,92,231,0.35); }
.fab-menu.open {
display: flex;
}