feat: 品牌改版 v2 — 跟随霓虹数据流 logo

- logo 矢量化:青→蓝→紫渐变 S 数据流(logo.tsx + favicon.svg,web/admin 共用)
- 全站配色跟随 logo:强调色青瓷绿 → 青蓝(浅 #0284C7 / 暗 #38BDF8),中性色转冷蓝,终端窗深岩蓝底
- 紫色克制使用:仅 logo 与 .text-brand-gradient(Hero 标题"AI Agent 工作台"渐变字)
- 导航/页脚/admin 顶栏/登录页挂载 logo 标记
- 终端窗与代码块的提示符、光标、事件标签同步换色

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
Blizzard
2026-07-17 11:44:20 +08:00
parent 4423a770e2
commit 7e21036faf
13 changed files with 260 additions and 90 deletions
+3 -1
View File
@@ -2,6 +2,7 @@ import { Link, Outlet, useNavigate } from 'react-router-dom'
import { LogOut, Moon, Sun } from 'lucide-react'
import { logout } from '@/api/auth'
import { useTheme } from '@/components/theme-provider'
import { LogoMark } from '@/components/logo'
export function AdminLayout() {
const navigate = useNavigate()
@@ -11,7 +12,8 @@ export function AdminLayout() {
<div className="flex min-h-screen flex-col">
<header className="sticky top-0 z-40 border-b border-hairline bg-ground/85 backdrop-blur">
<div className="mx-auto flex h-14 max-w-5xl items-center justify-between px-6">
<Link to="/" className="font-mono text-[14px] font-semibold">
<Link to="/" className="flex items-center gap-2.5 font-mono text-[14px] font-semibold">
<LogoMark size={24} />
sundynix <em className="not-italic text-accent">admin</em>
</Link>
<div className="flex items-center gap-3">
+57
View File
@@ -0,0 +1,57 @@
interface LogoMarkProps {
size?: number
className?: string
}
/** 品牌 Logo:霓虹数据流 S(青→蓝→紫),深岩底方形 */
export function LogoMark({ size = 28, className }: LogoMarkProps) {
return (
<svg
width={size}
height={size}
viewBox="0 0 64 64"
className={className}
aria-hidden="true"
>
<defs>
<linearGradient id="logo-g" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stopColor="#34E5E0" />
<stop offset="0.5" stopColor="#3B82F6" />
<stop offset="1" stopColor="#A855F7" />
</linearGradient>
</defs>
<rect width="64" height="64" rx="14" fill="#0B1117" />
<g fill="none" strokeLinecap="round">
<path
d="M22 15 C41 15 41 31 32 32 C23 33 23 49 42 49"
stroke="url(#logo-g)"
strokeWidth="9"
opacity="0.22"
/>
<path
d="M22 15 C41 15 41 31 32 32 C23 33 23 49 42 49"
stroke="url(#logo-g)"
strokeWidth="6"
opacity="0.45"
/>
<path
d="M22 15 C41 15 41 31 32 32 C23 33 23 49 42 49"
stroke="url(#logo-g)"
strokeWidth="3.6"
/>
</g>
<g fill="#34E5E0">
<circle cx="15" cy="13" r="1.4" />
<circle cx="10" cy="17" r="1" />
<circle cx="14" cy="20" r="0.8" />
</g>
<g stroke="#A855F7" strokeWidth="0.9" opacity="0.75">
<path d="M42 49 L50 46 M42 49 L53 51 M50 46 L53 51" fill="none" />
</g>
<g fill="#C084FC">
<circle cx="50" cy="46" r="1.5" />
<circle cx="53" cy="51" r="1.2" />
</g>
</svg>
)
}