Files
clawpanel/index.html
晴天 860218fa09 feat: 新增 AI 助手页面 + 图片识别功能 + 更新宣传素材
- 新增 AI 助手页面 (assistant.js/assistant.css/assistant.rs)
- 新增图片识别截图 (13.png) 并加入官网和 README
- 更新宣传视频 (promo-web.mp4) 含 AI 助手+工具调用+图片识别场景
- 更新视频封面 (video-cover.png/video-cover-light.png) 突出 AI 助手
- 更新 AI 助手演示 GIF (ai-assistant-demo.gif) 作为 README 首图
- 更新功能矩阵 GIF (feature-showcase.gif) AI 助手为 star 卡片
- 官网新增图片识别 showcase 区块
- README 新增图片识别特性和截图
- 视频封面改用专业设计版本
- 演示视频时长 badge 更新为 50 秒
2026-03-06 04:33:43 +08:00

81 lines
3.3 KiB
HTML

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>ClawPanel</title>
<link rel="icon" href="/favicon.ico">
<!-- 样式由 main.js 通过 Vite 统一加载 -->
<style>
/* 启动加载屏(内联,零依赖,立即渲染) */
#splash {
position: fixed; inset: 0; z-index: 99999;
display: flex; flex-direction: column; align-items: center; justify-content: center;
background: #f8f9fb;
transition: opacity 0.4s ease, visibility 0.4s ease;
}
@media (prefers-color-scheme: dark) { #splash { background: #0f0f14; } }
#splash.hide { opacity: 0; visibility: hidden; pointer-events: none; }
#splash .sp-logo {
width: 56px; height: 56px; margin-bottom: 20px;
color: #6366f1; animation: sp-pulse 2s ease-in-out infinite;
}
#splash .sp-name {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
font-size: 18px; font-weight: 600; letter-spacing: 0.5px;
color: #18181b; margin-bottom: 28px;
}
@media (prefers-color-scheme: dark) { #splash .sp-name { color: #e4e4e7; } }
#splash .sp-bar {
width: 120px; height: 3px; border-radius: 2px; overflow: hidden;
background: rgba(99, 102, 241, 0.15);
}
#splash .sp-bar-inner {
width: 40%; height: 100%; border-radius: 2px;
background: #6366f1;
animation: sp-slide 1.2s ease-in-out infinite;
}
#splash .sp-site {
margin-top: 24px;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
font-size: 12px; color: #a1a1aa; letter-spacing: 0.3px;
}
#splash .sp-site a {
color: #6366f1; text-decoration: none;
}
#splash .sp-site a:hover { text-decoration: underline; }
@keyframes sp-slide {
0% { transform: translateX(-100%); }
50% { transform: translateX(200%); }
100% { transform: translateX(-100%); }
}
@keyframes sp-pulse {
0%, 100% { opacity: 0.7; transform: scale(1); }
50% { opacity: 1; transform: scale(1.05); }
}
</style>
</head>
<body>
<!-- 启动加载屏 -->
<div id="splash">
<svg class="sp-logo" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
<path d="M9.813 15.904L9 18.75l-.813-2.846a4.5 4.5 0 00-3.09-3.09L2.25 12l2.846-.813a4.5 4.5 0 003.09-3.09L9 5.25l.813 2.846a4.5 4.5 0 003.09 3.09L15.75 12l-2.846.813a4.5 4.5 0 00-3.09 3.09z"/>
<path d="M18.259 8.715L18 9.75l-.259-1.035a3.375 3.375 0 00-2.455-2.456L14.25 6l1.036-.259a3.375 3.375 0 002.455-2.456L18 2.25l.259 1.035a3.375 3.375 0 002.456 2.456L21.75 6l-1.035.259a3.375 3.375 0 00-2.456 2.456z"/>
</svg>
<div class="sp-name">ClawPanel</div>
<div class="sp-bar"><div class="sp-bar-inner"></div></div>
<div class="sp-site"><a href="https://qt.cool" target="_blank">qt.cool</a></div>
</div>
<script>setTimeout(function(){var s=document.getElementById('splash');if(s){s.classList.add('hide');setTimeout(function(){s.remove()},500)}},6000)</script>
<div id="app">
<aside id="sidebar"></aside>
<div id="main-col">
<div id="gw-banner" class="gw-banner gw-banner-hidden"></div>
<main id="content"></main>
</div>
</div>
<script type="module" src="/src/main.js"></script>
</body>
</html>