47 lines
1.7 KiB
TypeScript
47 lines
1.7 KiB
TypeScript
import { cn } from '@/lib/utils'
|
||
import { formatVersion } from '@/lib/version'
|
||
|
||
interface LogoAreaProps {
|
||
sidebarOpen: boolean
|
||
}
|
||
|
||
export function LogoArea({ sidebarOpen }: LogoAreaProps) {
|
||
return (
|
||
<div className="flex h-20 items-center border-b px-4">
|
||
<div
|
||
className={cn(
|
||
'relative flex items-center justify-center flex-1 transition-all overflow-hidden',
|
||
// 移动端始终完整显示,桌面端根据 sidebarOpen 切换
|
||
'lg:flex-1',
|
||
!sidebarOpen && 'lg:flex-none lg:w-8'
|
||
)}
|
||
>
|
||
{/* 移动端始终显示完整 Logo，桌面端根据 sidebarOpen 切换 */}
|
||
<div className={cn(
|
||
"flex min-w-0 flex-col items-start justify-center gap-1",
|
||
!sidebarOpen && "lg:hidden"
|
||
)}>
|
||
<span className="max-w-full truncate whitespace-nowrap text-xl font-bold text-primary-gradient">
|
||
MaiBot WebUI
|
||
</span>
|
||
<div className="flex max-w-full items-center gap-2 overflow-hidden">
|
||
<span className="shrink-0 whitespace-nowrap text-sm font-semibold text-primary/70">
|
||
{formatVersion()}
|
||
</span>
|
||
</div>
|
||
<div className="hidden">
|
||
<span className="font-bold text-xl text-primary-gradient whitespace-nowrap">MaiBot WebUI</span>
|
||
<span className="text-base font-semibold text-primary/70 whitespace-nowrap">
|
||
{formatVersion()}
|
||
</span>
|
||
</div>
|
||
</div>
|
||
{/* 折叠时的 Logo - 仅桌面端显示 */}
|
||
{!sidebarOpen && (
|
||
<span className="hidden lg:block font-bold text-primary-gradient text-2xl">M</span>
|
||
)}
|
||
</div>
|
||
</div>
|
||
)
|
||
}
|