40760aa884
- server:Go 网关(WS 流式识别中继/计费配额/微信登录支付 mock/反馈/埋点),gummy provider 已真实联调 - desktop:Tauri 2(全局快捷键 push-to-talk/浮层/托盘/设置/登录购买/反馈/首启引导) - android:Compose 主 App + IME(键盘内录音直传) - ios:App + 键盘扩展(1A spike 实证键盘内不可录音,走 deep link 听写) - design/design-pipeline:设计系统 + token 导出 iOS/Android 主题 - doc:前后端设计文档(HTML);web:官网宣传页;todo:任务看板 Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
114 lines
3.1 KiB
CSS
114 lines
3.1 KiB
CSS
/* ============================================================
|
|
dudu 语音输入法 · 颜色令牌
|
|
Light 为默认(:root),Dark 通过 [data-theme="dark"] 切换。
|
|
简约原则:单一品牌蓝 + 冷灰中性阶梯;绿=录音/成功,
|
|
琥珀=超额/警告,红=错误。识别浮层两种模式均为深色玻璃。
|
|
============================================================ */
|
|
|
|
:root {
|
|
/* ---- 品牌蓝阶梯 ---- */
|
|
--blue-50: #EEF1FE;
|
|
--blue-100: #DFE5FD;
|
|
--blue-200: #C4CFFB;
|
|
--blue-300: #9FB1F9;
|
|
--blue-400: #7590F8;
|
|
--blue-500: #4F6EF7;
|
|
--blue-600: #3D58DB;
|
|
--blue-700: #2F44B3;
|
|
--blue-800: #25368C;
|
|
--blue-900: #1E2B6B;
|
|
|
|
/* ---- 中性阶梯(冷灰)---- */
|
|
--gray-0: #FFFFFF;
|
|
--gray-25: #FCFCFD;
|
|
--gray-50: #F6F7FA;
|
|
--gray-100: #F0F1F4;
|
|
--gray-200: #E4E6EB;
|
|
--gray-300: #D2D5DD;
|
|
--gray-400: #A6ABB8;
|
|
--gray-500: #7A8090;
|
|
--gray-600: #5A6072;
|
|
--gray-700: #434957;
|
|
--gray-800: #2B2F3A;
|
|
--gray-900: #1B1E26;
|
|
--gray-950: #11131A;
|
|
|
|
/* ---- 功能色 ---- */
|
|
--green-500: #16A34A;
|
|
--green-100: #DCFCE7;
|
|
--amber-500: #E8890C;
|
|
--amber-100: #FCEFD7;
|
|
--red-500: #DC2626;
|
|
--red-100: #FEE2E2;
|
|
|
|
/* ============ 语义别名 · Light ============ */
|
|
--bg-app: var(--gray-50);
|
|
--surface-card: var(--gray-0);
|
|
--surface-2: var(--gray-100);
|
|
--surface-3: var(--gray-200);
|
|
--border-1: var(--gray-200);
|
|
--border-2: var(--gray-300);
|
|
|
|
--text-1: var(--gray-900);
|
|
--text-2: var(--gray-600);
|
|
--text-3: var(--gray-400);
|
|
--text-on-accent: #FFFFFF;
|
|
|
|
--accent: var(--blue-500);
|
|
--accent-hover: var(--blue-600);
|
|
--accent-press: var(--blue-700);
|
|
--accent-soft: var(--blue-50);
|
|
--accent-soft-2: var(--blue-100);
|
|
--accent-text: var(--blue-600);
|
|
|
|
--positive: var(--green-500);
|
|
--positive-soft: var(--green-100);
|
|
--warning: var(--amber-500);
|
|
--warning-soft: var(--amber-100);
|
|
--danger: var(--red-500);
|
|
--danger-soft: var(--red-100);
|
|
|
|
/* 识别浮层(两种模式均为深色玻璃)*/
|
|
--overlay-bg: rgba(24, 26, 34, 0.95);
|
|
--overlay-text: #F2F4FA;
|
|
--overlay-text-2: #9AA3BD;
|
|
--overlay-text-3: #646E8C;
|
|
|
|
--focus-ring: 0 0 0 3px var(--blue-200);
|
|
}
|
|
|
|
[data-theme="dark"] {
|
|
--bg-app: #0F1116;
|
|
--surface-card: #171A22;
|
|
--surface-2: #1E222C;
|
|
--surface-3: #262B37;
|
|
--border-1: #272C38;
|
|
--border-2: #343A49;
|
|
|
|
--text-1: #ECEEF4;
|
|
--text-2: #9AA1B2;
|
|
--text-3: #5F6678;
|
|
--text-on-accent: #FFFFFF;
|
|
|
|
--accent: #5C77E8;
|
|
--accent-hover: #6E89F9;
|
|
--accent-press: #4A63D6;
|
|
--accent-soft: rgba(92, 119, 232, 0.16);
|
|
--accent-soft-2: rgba(92, 119, 232, 0.26);
|
|
--accent-text: #7D95F7;
|
|
|
|
--positive: #34C46A;
|
|
--positive-soft: rgba(52, 196, 106, 0.16);
|
|
--warning: #F2A33C;
|
|
--warning-soft: rgba(242, 163, 60, 0.16);
|
|
--danger: #F05B5B;
|
|
--danger-soft: rgba(240, 91, 91, 0.16);
|
|
|
|
--overlay-bg: rgba(30, 33, 43, 0.96);
|
|
--overlay-text: #F2F4FA;
|
|
--overlay-text-2: #9AA3BD;
|
|
--overlay-text-3: #646E8C;
|
|
|
|
--focus-ring: 0 0 0 3px rgba(92, 119, 232, 0.4);
|
|
}
|