feat: 为 desktop/server 添加 Tailwind CSS 支持和 Biome 集成

- desktop renderer 接入 @tailwindcss/vite,loading 页面改用 Tailwind 类
- 两个 app 添加 biome.json 继承配置:tailwindDirectives + useSortedClasses
This commit is contained in:
2026-02-08 19:17:53 +08:00
parent 6cc1bc6834
commit d69a573a33
7 changed files with 95 additions and 32 deletions

View File

@@ -4,37 +4,16 @@
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Furtherverse</title>
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
background: #0a0a0a;
color: #fafafa;
display: flex;
align-items: center;
justify-content: center;
height: 100vh;
}
.loader {
text-align: center;
}
.spinner {
width: 32px;
height: 32px;
border: 3px solid #333;
border-top-color: #fafafa;
border-radius: 50%;
animation: spin 0.8s linear infinite;
margin: 0 auto 16px;
}
@keyframes spin { to { transform: rotate(360deg); } }
p { font-size: 14px; color: #888; }
</style>
<link rel="stylesheet" href="./styles.css" />
</head>
<body>
<div class="loader">
<div class="spinner"></div>
<p>Starting server</p>
<body class="m-0 h-screen bg-[#050505] text-white font-sans flex flex-col items-center justify-center overflow-hidden cursor-default select-none">
<div class="absolute w-[80vw] h-[80vw] bg-[radial-gradient(circle,rgba(255,255,255,0.06)_0%,transparent_60%)] rounded-full animate-breathe pointer-events-none"></div>
<div class="flex flex-col items-center gap-7 z-10 animate-appear">
<h1 class="m-0 text-[32px] font-medium tracking-[-0.03em] bg-[linear-gradient(to_bottom_right,#ffffff_30%,#a1a1aa)] bg-clip-text text-transparent">Furtherverse</h1>
<div class="w-30 h-px bg-white/8 rounded-[1px] overflow-hidden relative">
<div class="absolute inset-y-0 left-0 w-2/5 bg-[linear-gradient(90deg,transparent,#fff,transparent)] animate-slide opacity-60"></div>
</div>
<div class="text-[11px] uppercase tracking-[0.2em] text-zinc-600 font-medium animate-pulse-subtle">Starting</div>
</div>
</body>
</html>