yml2213
3ffa9ddc89
- 工作台改为设计稿三栏：320 会话列表 + 聊天区 + 320 客户信息 - 会话列表展示头像色条、最后消息预览、相对时间与未读角标 - 消息方向对齐设计（访客左、客服右）并补系统会话条 - 访客 Widget 还原欢迎语、快捷问题、输入状态动画与实色顶栏 - 会话列表 API 返回 last_message 供列表预览
58 lines
1.4 KiB
CSS
58 lines
1.4 KiB
CSS
@import 'tailwindcss';
|
|
|
|
:root {
|
|
--brand-primary: #2563eb;
|
|
--brand-primary-hover: #1d4ed8;
|
|
--brand-primary-light: #dbeafe;
|
|
--brand-primary-lighter: #eff6ff;
|
|
--neutral-0: #ffffff;
|
|
--neutral-50: #f8fafc;
|
|
--neutral-100: #f1f5f9;
|
|
--neutral-200: #e2e8f0;
|
|
--neutral-300: #cbd5e1;
|
|
--neutral-400: #94a3b8;
|
|
--neutral-500: #64748b;
|
|
--neutral-600: #475569;
|
|
--neutral-700: #334155;
|
|
--neutral-800: #1e293b;
|
|
--neutral-900: #0f172a;
|
|
--neutral-950: #020617;
|
|
--success: #16a34a;
|
|
--success-bg: #f0fdf4;
|
|
--warning: #d97706;
|
|
--warning-bg: #fffbeb;
|
|
--error: #dc2626;
|
|
--error-bg: #fef2f2;
|
|
--info: #0891b2;
|
|
--info-bg: #ecfeff;
|
|
--sidebar-width: 240px;
|
|
--panel-width: 320px;
|
|
--header-height: 56px;
|
|
--shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.03);
|
|
--shadow-floating: 0 8px 24px rgba(0, 0, 0, 0.12);
|
|
}
|
|
|
|
body {
|
|
margin: 0;
|
|
font-family: 'Inter', 'PingFang SC', 'Microsoft YaHei', -apple-system, BlinkMacSystemFont, sans-serif;
|
|
-webkit-font-smoothing: antialiased;
|
|
background: var(--neutral-50);
|
|
color: var(--neutral-900);
|
|
}
|
|
|
|
@keyframes typingDot {
|
|
0%, 60%, 100% { opacity: 0.3; transform: translateY(0); }
|
|
30% { opacity: 1; transform: translateY(-3px); }
|
|
}
|
|
|
|
.typing-dot {
|
|
width: 6px;
|
|
height: 6px;
|
|
border-radius: 9999px;
|
|
background: var(--neutral-400);
|
|
animation: typingDot 1.4s infinite;
|
|
}
|
|
|
|
.no-scrollbar::-webkit-scrollbar { display: none; }
|
|
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
|