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:
@@ -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">
|
||||
|
||||
@@ -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>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user