WebUI: 前端视觉与交互统一化（RemixIcon/配色/安全页/按钮态）Webui frontend unify

[massif-01]

Pull Request: WebUI 前端视觉与交互统一化修改

本 PR 对 TianshanOS WebUI 进行仅视觉与图标层面的统一化修改，不改变任何布局、不删除任何功能，便于上游审阅与合并。

---

一、修改原则（承诺）

原则	说明
布局不变	绝对不改变任何元素的位置和布局
功能不删	绝对不删除任何功能按钮或函数
文档同步	每次修改后已同步更新 frontend_modification.md

所有改动均遵循以上原则，仅涉及：Emoji → RemixIcon 图标替换、按钮/标签样式类统一、部分布尔判断显式化，以及编译与打包相关注意事项的文档化。

---

二、UI 配色规范（新增/统一）

为保持 OTA、登出、组件管理等「服务型」操作与危险/成功/警告类操作在视觉上一致，统一采用以下规范：

类型	背景色	文字色	边框色	用途
btn-service-style	#f0f8ff	#007bff	#d0e8ff	OTA、登出、组件管理、安全页服务型按钮
btn-danger	#ffebee	#c62828	#ef9a9a	删除、已关闭
btn-success	#e8f5e9	#2e7d32	#a5d6a7	运行中、添加
btn-warning	#fff8e1	#f57c00	#ffd54f	测试、检测中
灰色小按钮	-	#666	-	服务、USB、同步等
背景色	#f5f6fa	-	-	曲线点、预览图、模态框底色

• 安全页内密钥管理、主机部署、已知主机、HTTPS 密钥等标签统一为 badge-service-style（与上表浅蓝一致）。
• 安全页按钮尺寸统一为 btn-sm，区块/表格/弹窗内一致，.page-security 内 .btn / .btn-sm 的 padding 与 font-size 已统一。

---

三、主要修改内容概览

1. Emoji → RemixIcon 图标替换

• 范围：登录、设备、风扇、内存、网络、文件、终端、Toast、OTA、LED、Matrix、数据监控、安全页等全站。
• 方式：界面可见的 Emoji 替换为 RemixIcon 图标类（如 ri-xxx-line），图标 Unicode 来自 components/ts_webui/web/fonts/remixicon.css，确保先定义再使用，避免未定义类导致方框。
• 示例：数据监控空态使用 <i class="ri-box-3-line"></i>；风扇/曲线、色彩校正、保存/下载/上传等使用对应 ri-*-line；安全页 CSR/证书/安装 CA 链等弹窗去 Emoji，统一 RemixIcon。
• 已清理：删除死代码 getEffectIcon()（原 LED 效果 emoji 映射），界面统一使用 getEffectIconRemix()。

2. 按钮可点击性与按下态

• 刷新、保存、同步、文件选择器确定等按钮：保证可点击，并具备 :active 蓝色按下态。
• 安全页私钥操作、复制到剪贴板、配置包列表刷新等使用 btn-service-style，与 OTA/登出等保持一致。

3. 安全页专项

• 弹窗：CSR、查看证书、安装证书、安装 CA 链等弹窗去除 Emoji，改为 RemixIcon + 统一 cc 风格。
• 标签：密钥管理（SSH/HTTPS 备注）、已部署主机、已知主机指纹类型、HTTPS 未生成密钥等，统一为 badge-service-style（浅蓝）；.badge-info 同款浅蓝。
• 按钮：全部改为 btn-sm，区块/表格/弹窗内一致。
• 私钥 exportable：使用显式判断 key.exportable === false ? 'disabled' : ''，避免 API 未返回 exportable（undefined）时误禁用按钮。
• 导出加密配置包：列表去 Emoji，采用 flex 排版（复选框 | 图标 | 文件名 | 大小对齐）。

4. 风扇与曲线

• 风扇编辑曲线/状态 tag 使用 RemixIcon；曲线迟滞、导入导出配置使用 ri-check-line 等。
• 色彩校正导出/导入左移、btn-sm、ri-save-line 等统一。

5. 数据监控

• 新组件面板 Emoji → RemixIcon；空态使用 ri-box-3-line；宽度等使用 ri-ruler-line。
• 列表删除钮右固定；类型/核心 badge 使用 btn-service-style；编辑面板图标与颜色行对齐。

6. 其他

• LED/Matrix cc 布局、程序动画/色彩校正 RemixIcon、USB Mux AGX 按钮改为 btn-service-style。
• 固件与版权相关说明的文档/文案与 upstream 保持一致，无功能删减。

---

四、编译与版本说明（供维护者参考）

• WebUI 更新后：需先 rm -f build/www.bin 再编译，否则 www.bin 可能不会重新打包。
• 版本号/元数据：修改代码或 version.txt 后，建议 idf.py reconfigure 再 idf.py build，避免 CMake 缓存导致固件版本元数据（Git Hash/时间戳）未更新，影响 OTA 检测。
• 环境：ESP-IDF v5.5+，source ~/esp/v5.5.2/esp-idf/export.sh 后执行上述命令。

---

五、修改历史（版本摘要）

版本范围	日期	关键修改
v1–v46	01-31–02-08	RemixIcon/emoji 清理；登录/设备/风扇/内存/网络/文件/终端/Toast/OTA；LED/Matrix cc 布局、btn-service-style、色彩校正/动画/文本/QR/滤镜；指令与自动化 RemixIcon；USB Mux；固件与版权
v47–v54	02-08	按钮可点与按下态；曲线/色彩校正 ri-save-line、ri-download/upload；文件刷新灰、同步 :active 蓝；安全页 RemixIcon 与五弹窗 cc 风格；服务型按钮 btn-service-style，登录保留 btn-primary
v55–v58	02-08–02-09	私钥 exportable 显式判断；风扇编辑曲线/状态 tag RemixIcon；风扇曲线迟滞、导入导出配置 ri-check-line；色彩校正导出/导入左移、btn-sm、ri-save-line
v59–v61	02-09	数据监控：新组件面板 emoji→RemixIcon、空态 ri-box-3-line、宽度 ri-ruler-line；列表删除钮右固定、类型/核心 badge btn-service-style；编辑面板图标+颜色行对齐
v62–v64	02-09	安全页 CSR/证书/安装 CA 链弹窗去 emoji；复制与配置包列表刷新 btn-service-style；导出加密配置包列表去 emoji、flex 排版；安全页浅蓝标签与 btn-sm 统一

---

六、测试建议

• 登录、OTA、登出、组件管理、风扇曲线、色彩校正、数据监控、安全页（密钥/证书/配置包/复制）等关键路径的 UI 与功能均未删减，建议做一次完整 UI 回归。
• 在不同分辨率下确认按钮与标签样式一致、无布局错位。

---

本 PR 仅包含上述前端与文档修改，不改变任何 Core API、配置结构或后端行为。