style(feedback): 选类型副标题换成轮转动态提示
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful

step 1 标题下的「选一个最贴近的类型」改成 RotatingFooterHint,
6 条文案 4 秒一轮(含「数字背后还有故事,等下一次上线揭晓」等)。

RotatingFooterHint 兼容自定义对齐:传 className 就完全覆盖
默认 mt-1 + justify-center;不传则保持底部居中(其他模块的用法)。

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
kkfluous
2026-04-30 14:34:21 +08:00
parent 2aeff0c2f4
commit bdefb878a5
2 changed files with 4 additions and 3 deletions

View File

@@ -9,6 +9,7 @@ import { fetchJson } from '../auth/api-client';
import { useAuth } from '../auth/useAuth';
import { canManageFeedback } from '../shared/auth/roles';
import FeedbackHistoryDrawer from './FeedbackHistoryDrawer';
import RotatingFooterHint from './RotatingFooterHint';
const MAX_SCREENSHOTS = 6;
const MAX_IMG_SIZE_MB = 5;
@@ -320,8 +321,8 @@ export default function FeedbackFab({ module: moduleProp }: Props = {}) {
<AnimatePresence mode="wait">
{step === 1 && (
<motion.div key="s1" initial={{ opacity: 0, x: 12 }} animate={{ opacity: 1, x: 0 }} exit={{ opacity: 0, x: -12 }} transition={{ duration: 0.2 }}>
<p className="text-[13px] font-bold text-slate-700 mb-1"></p>
<p className="text-[11px] text-slate-400 font-bold mb-4"></p>
<p className="text-[13px] font-bold text-slate-700 mb-1.5"></p>
<RotatingFooterHint className="justify-start mb-4" />
<div className="grid grid-cols-1 gap-2">
{TYPE_OPTIONS.map((opt, i) => {
const Icon = opt.icon;

View File

@@ -30,7 +30,7 @@ export default function RotatingFooterHint({ hints = FOOTER_HINTS, intervalMs =
return (
<div
className={`mt-1 flex items-center justify-center gap-1.5 text-[11px] text-slate-400 font-bold ${onClick ? 'cursor-pointer hover:text-blue-500 transition-colors' : ''} ${className}`}
className={`flex items-center gap-1.5 text-[11px] text-slate-400 font-bold ${onClick ? 'cursor-pointer hover:text-blue-500 transition-colors' : ''} ${className || 'mt-1 justify-center'}`}
onClick={onClick}
>
<span className="inline-block w-1.5 h-1.5 rounded-full bg-blue-400 animate-pulse" />