af233e1628
All checks were successful
Build and Deploy (tool.xpcool.com) / build-and-deploy (push) Successful in 1m6s
视觉体系（核心是「令牌 → TDesign 桥接」） - 新增 tokens.scss：--tk-* 设计令牌（青玉 Jade 单一强调色、冷调中性色阶、 圆角/间距/字号/z-index/动效规范、按语言切换字体栈） - 新增 tdesign-theme.scss：--tk-* → --td-* 桥接（含完整冷调灰阶 1-14） → 60+ 个未改动的存量工具页零成本继承新配色与圆角 - index.scss 重写：只过渡颜色、统一 focus-visible、reduced-motion 降级 - 新增 v-reveal 滚动进入指令 布局与交互 - MainLayout 重写：毛玻璃 sticky 顶栏 + 三区布局 + 页脚（含备案号） - 新增 CommandPalette（⌘K/Ctrl+K）、LocaleSwitch（显示语言代码不用国旗）、 ThemeSwitch（三态；图标显示生效 mode、菜单勾选用户偏好 preference） - SideNav 重写：内联筛选、可折叠分组持久化、活动态指示条、需联网标记 - HomeView 重写：左对齐 Hero + 真实可用搜索 + 概览数字条 + 服务端工具专区 国际化与主题 - vue-i18n 11 + zh-CN/en-US/ja-JP/ko-KR 完整语言包（58 个工具名与描述全译） - helpers 取词带中文兜底；index.html 防闪烁内联脚本与 store 三处同步 - 主题三态 light/dark/auto，preference 与 mode 分离 服务端对接（service.xpcool.com /api/service/open/tools/*） - 新增 openTools.ts：接口元数据与调用函数共用同一份路径定义 - 改造/新建 6 页：ip-info、uuid、hash（服务端 MD5 两端口径对比）、 timestamp（服务端时钟 + 时钟偏移）、random-string、api-status - 均为「本机 / 服务端」双模式，默认本机、不自动打网络请求 - 后端未实现的 5 个接口用 BackendPending 如实标注，不伪装可用 修复 - 空分类渲染缺陷（health/study/travel 无工具却渲染空区块），分类 9 → 6 - UnoCSS panel 快捷类补内边距；IpInfoView 漏 onBeforeUnmount； SideNav 末尾 import；HomeView 错误导入 SUPPORTED_LOCALES 其他 - 新增 src/config.ts 集中站点常量，页脚展示备案号并链工信部核验 - docs/api-contract.md 按线上实际重写；PROJECT_STATE.md 全面更新 - 构建通过：vue-tsc --noEmit + vite build
66 lines
2.6 KiB
HTML
66 lines
2.6 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN" theme-mode="light">
|
||
<head>
|
||
<meta charset="UTF-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
|
||
<meta
|
||
name="description"
|
||
content="纯前端在线工具箱：图片压缩与裁剪、二维码、JSON 格式化、时间戳、Base64、JWT、Cron、进制转换、哈希、身份证解析、OCR 等 56 个实用工具，支持中英日韩四种语言与日间夜间主题，数据全部在浏览器本地处理。"
|
||
/>
|
||
<meta name="theme-color" content="#f6f8f8" media="(prefers-color-scheme: light)" />
|
||
<meta name="theme-color" content="#0c100f" media="(prefers-color-scheme: dark)" />
|
||
<title>在线工具箱 · Tool</title>
|
||
<!--
|
||
防闪烁（FOUC）内联脚本：必须在样式与模块加载之前同步执行。
|
||
1) 主题：TDesign 依赖 html[theme-mode] 属性，"auto" 或不合法值按系统偏好解析，
|
||
解析结果回写 theme-mode，保证首屏就是正确配色。
|
||
2) 语言：把 html[lang] 先设对，字体栈（见 tokens.scss）才不会先按中文渲染再跳变。
|
||
这段脚本与 src/stores/theme.ts、src/i18n/index.ts 中的读取逻辑保持一致，
|
||
改动存储 key 或取值规则时三处必须同步。
|
||
-->
|
||
<script>
|
||
;(function () {
|
||
var SUPPORTED = ['zh-CN', 'en-US', 'ja-JP', 'ko-KR']
|
||
|
||
function readStorage(key) {
|
||
try {
|
||
return localStorage.getItem(key)
|
||
} catch (e) {
|
||
return null
|
||
}
|
||
}
|
||
|
||
// ---- 主题 ----
|
||
var pref = readStorage('tool-theme')
|
||
var dark = false
|
||
try {
|
||
dark = !!(window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches)
|
||
} catch (e) {
|
||
dark = false
|
||
}
|
||
var mode = pref === 'light' || pref === 'dark' ? pref : dark ? 'dark' : 'light'
|
||
document.documentElement.setAttribute('theme-mode', mode)
|
||
|
||
// ---- 语言 ----
|
||
var locale = readStorage('tool-locale')
|
||
if (SUPPORTED.indexOf(locale) === -1) {
|
||
var nav = (navigator.language || 'zh-CN').toLowerCase()
|
||
var primary = nav.split('-')[0]
|
||
locale = 'zh-CN'
|
||
for (var i = 0; i < SUPPORTED.length; i++) {
|
||
if (SUPPORTED[i].toLowerCase().split('-')[0] === primary) {
|
||
locale = SUPPORTED[i]
|
||
break
|
||
}
|
||
}
|
||
}
|
||
document.documentElement.setAttribute('lang', locale)
|
||
})()
|
||
</script>
|
||
</head>
|
||
<body>
|
||
<div id="app"></div>
|
||
<script type="module" src="/src/main.ts"></script>
|
||
</body>
|
||
</html>
|