freedak/TurboHR
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: 平台管理端改为浅色主题，与企业端配色一致

Browse Source
This commit is contained in:
selfrelease
2026-07-29 12:16:44 +08:00
parent 0c6cb8d6cb
commit fa6cacb824
6 changed files with 157 additions and 158 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/layout/PlatformSidebar.tsx
+15 -15
View File
@@ -1,6 +1,6 @@
/**
* 平台管理端侧边栏导航
* 深色主题，amber 主色，区别于企业端
* 浅色主题，与企业端配色一致
*/
import { Link, useLocation, useNavigate } from 'react-router-dom'
import { useState } from 'react'
@@ -60,20 +60,20 @@ export default function PlatformSidebar({ mobileOpen, onClose }: { mobileOpen: b
className={clsx(
'fixed md:sticky top-0 left-0 z-50 md:z-auto',
'w-56 h-screen flex-shrink-0',
'bg-slate-950 border-r border-slate-800',
'bg-white border-r border-gray-200',
'flex flex-col',
'transition-transform duration-200',
mobileOpen ? 'translate-x-0' : '-translate-x-full md:translate-x-0',
)}
>
{/* Logo 区 */}
<div className="h-14 flex items-center gap-2 px-4 border-b border-slate-800 shrink-0">
<div className="w-7 h-7 rounded-md bg-amber-400 flex items-center justify-center">
<Shield className="w-4 h-4 text-slate-950" />
<div className="h-14 flex items-center gap-2 px-4 border-b border-gray-200 shrink-0">
<div className="w-7 h-7 rounded-md bg-primary flex items-center justify-center">
<Shield className="w-4 h-4 text-white" />
</div>
<div>
<div className="font-bold text-sm text-white">用工专家平台</div>
<div className="text-[10px] text-amber-400 tracking-wider">ADMIN</div>
<div className="font-bold text-sm text-gray-900">用工专家平台</div>
<div className="text-[10px] text-primary tracking-wider">ADMIN</div>
</div>
</div>
@@ -89,7 +89,7 @@ export default function PlatformSidebar({ mobileOpen, onClose }: { mobileOpen: b
onClick={() => toggleGroup(group.title)}
className={clsx(
'flex items-center justify-between w-full px-2 py-1.5 text-xs font-medium rounded-md transition-colors',
hasActiveItem ? 'text-slate-200' : 'text-slate-400 hover:text-slate-200',
hasActiveItem ? 'text-gray-800' : 'text-gray-500 hover:text-gray-700',
)}
>
<span>{group.title}</span>
@@ -109,8 +109,8 @@ export default function PlatformSidebar({ mobileOpen, onClose }: { mobileOpen: b
className={clsx(
'flex items-center gap-2 px-2 py-1.5 rounded-md text-sm transition-colors',
active
? 'bg-amber-400/10 text-amber-400 font-medium'
: 'text-slate-400 hover:bg-slate-800 hover:text-slate-200',
? 'bg-primary/10 text-primary font-medium'
: 'text-gray-600 hover:bg-gray-100 hover:text-gray-800',
)}
>
<Icon className="w-4 h-4 flex-shrink-0" />
@@ -126,19 +126,19 @@ export default function PlatformSidebar({ mobileOpen, onClose }: { mobileOpen: b
</nav>
{/* 底部用户区 */}
<div className="border-t border-slate-800 p-3 shrink-0">
<div className="border-t border-gray-200 p-3 shrink-0">
<div className="flex items-center gap-2 mb-2">
<div className="w-8 h-8 rounded-full bg-slate-800 flex items-center justify-center text-amber-400 text-sm font-medium">
<div className="w-8 h-8 rounded-full bg-gray-100 flex items-center justify-center text-primary text-sm font-medium">
{user?.name?.charAt(0) || 'A'}
</div>
<div className="flex-1 min-w-0">
<div className="text-sm text-white truncate">{user?.name}</div>
<div className="text-[10px] text-amber-400">SUPER_ADMIN</div>
<div className="text-sm text-gray-900 truncate">{user?.name}</div>
<div className="text-[10px] text-primary">SUPER_ADMIN</div>
</div>
</div>
<button
onClick={handleLogout}
className="flex items-center gap-2 w-full px-2 py-1.5 rounded-md text-sm text-slate-400 hover:bg-slate-800 hover:text-slate-200 transition-colors"
className="flex items-center gap-2 w-full px-2 py-1.5 rounded-md text-sm text-gray-500 hover:bg-gray-100 hover:text-gray-700 transition-colors"
>
<LogOut className="w-4 h-4" />
<span>退出登录</span>