feat(frontend): 实现新手引导功能
- 添加 Guide 组件和引导步骤配置 - 实现 useOnboardingTour 和 useTourStepDescription composables - 添加 onboarding store 管理引导状态 - 更新多个视图和组件以支持引导功能 - 添加国际化支持(中英文) - 删除旧的实现指南文档
This commit is contained in:
@@ -518,6 +518,43 @@
|
||||
@apply overflow-x-auto rounded-xl p-4;
|
||||
}
|
||||
|
||||
/* ============ Tour Description ============ */
|
||||
.tour-step-description {
|
||||
@apply space-y-3 text-sm leading-relaxed text-gray-700 dark:text-gray-200;
|
||||
}
|
||||
|
||||
.tour-step-description ul {
|
||||
@apply list-disc pl-5;
|
||||
}
|
||||
|
||||
.tour-step-description ol {
|
||||
@apply list-decimal pl-5;
|
||||
}
|
||||
|
||||
.tour-step-description li + li {
|
||||
@apply mt-1;
|
||||
}
|
||||
|
||||
.tour-info-box {
|
||||
@apply rounded-md border-l-4 border-blue-500 bg-blue-50 px-3 py-2 text-xs text-blue-900;
|
||||
@apply dark:border-blue-400 dark:bg-blue-950/40 dark:text-blue-200;
|
||||
}
|
||||
|
||||
.tour-success-box {
|
||||
@apply rounded-md border-l-4 border-emerald-500 bg-emerald-50 px-3 py-2 text-xs text-emerald-900;
|
||||
@apply dark:border-emerald-400 dark:bg-emerald-950/40 dark:text-emerald-200;
|
||||
}
|
||||
|
||||
.tour-warning-box {
|
||||
@apply rounded-md border-l-4 border-amber-500 bg-amber-50 px-3 py-2 text-xs text-amber-900;
|
||||
@apply dark:border-amber-400 dark:bg-amber-950/40 dark:text-amber-200;
|
||||
}
|
||||
|
||||
.tour-error-box {
|
||||
@apply rounded-md border-l-4 border-red-500 bg-red-50 px-3 py-2 text-xs text-red-900;
|
||||
@apply dark:border-red-400 dark:bg-red-950/40 dark:text-red-200;
|
||||
}
|
||||
|
||||
/* ============ 表格页面布局优化 ============ */
|
||||
/* 表格容器 - 默认仅支持水平滚动 */
|
||||
.table-wrapper {
|
||||
|
||||
Reference in New Issue
Block a user