fix: keep admin sidebar actions visible
This commit is contained in:
+13
-4
@@ -1097,18 +1097,19 @@ function AppShell() {
|
||||
) : (
|
||||
<aside className={`sidebar ${sidebarCollapsed ? 'collapsed' : ''}`}>
|
||||
{!sidebarCollapsed && (
|
||||
<div className="sidebar-context-card">
|
||||
<div className={`sidebar-context-card ${isUserPage ? '' : 'sidebar-context-card-admin'}`.trim()}>
|
||||
<LocalAvatar
|
||||
className="sidebar-context-avatar"
|
||||
profile={userProfile}
|
||||
label={displayName}
|
||||
/>
|
||||
<div className="sidebar-context-copy">
|
||||
<span>{isUserPage ? t('用户工作台') : t('管理控制台')}</span>
|
||||
<strong>{displayName}</strong>
|
||||
<strong>{isUserPage ? displayName : t('管理控制台')}</strong>
|
||||
{isUserPage && <span>{t('用户工作台')}</span>}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
<nav className="sidebar-scroll" aria-label={t(isUserPage ? '用户工作台' : '管理控制台')}>
|
||||
{currentSidebarGroups.map((group) => (
|
||||
<div key={group.label} className="sidebar-group">
|
||||
{!sidebarCollapsed && <div className="sidebar-group-label">{t(group.label)}</div>}
|
||||
@@ -1127,12 +1128,20 @@ function AppShell() {
|
||||
))}
|
||||
</div>
|
||||
))}
|
||||
<button className="sidebar-collapse-btn" onClick={() => setSidebarCollapsed(!sidebarCollapsed)}>
|
||||
</nav>
|
||||
<div className="sidebar-footer">
|
||||
<button
|
||||
className="sidebar-collapse-btn"
|
||||
onClick={() => setSidebarCollapsed(!sidebarCollapsed)}
|
||||
aria-label={sidebarCollapsed ? t('展开侧边栏') : t('收起侧边栏')}
|
||||
type="button"
|
||||
>
|
||||
<svg width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="currentColor" style={{ transform: sidebarCollapsed ? 'rotate(180deg)' : 'none', transition: 'transform 0.3s ease', flexShrink: 0 }}>
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M11 19l-7-7 7-7m8 14l-7-7 7-7" />
|
||||
</svg>
|
||||
{!sidebarCollapsed && <span>{t('收起侧边栏')}</span>}
|
||||
</button>
|
||||
</div>
|
||||
</aside>
|
||||
)}
|
||||
<main className="main-content">
|
||||
|
||||
@@ -468,6 +468,7 @@ export const zhToEnSupplemental: Record<string, string> = {
|
||||
'收件人地址': 'Recipient address',
|
||||
'收起': 'close',
|
||||
'收起侧边栏': 'Collapse sidebar',
|
||||
'展开侧边栏': 'Expand sidebar',
|
||||
'收起高级参数': 'Close advanced parameters',
|
||||
'手动模式适合高级场景;自动路由仍会保持开启。': 'Manual mode is suitable for advanced scenarios; automatic routing will still remain on.',
|
||||
'手动增改路由': 'Manually add and modify routes',
|
||||
|
||||
@@ -169,6 +169,7 @@ const zhToEn: Record<string, string> = {
|
||||
'深色模式': 'Dark Mode',
|
||||
'退出登录': 'Sign Out',
|
||||
'收起侧边栏': 'Collapse Sidebar',
|
||||
'展开侧边栏': 'Expand Sidebar',
|
||||
'系统设置': 'System Settings',
|
||||
'站点管理': 'Site Management',
|
||||
'账号管理': 'Connection Management',
|
||||
|
||||
+41
-1
@@ -731,6 +731,7 @@ body {
|
||||
.sidebar-collapse-btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
gap: 8px;
|
||||
padding: 8px 12px;
|
||||
font-size: 13px;
|
||||
@@ -740,7 +741,6 @@ body {
|
||||
background: none;
|
||||
border-radius: var(--radius-sm);
|
||||
transition: all 0.2s ease;
|
||||
margin-top: auto;
|
||||
white-space: nowrap;
|
||||
width: 100%;
|
||||
}
|
||||
@@ -12686,6 +12686,10 @@ textarea:focus {
|
||||
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.52);
|
||||
}
|
||||
|
||||
.sidebar-context-card-admin {
|
||||
grid-template-columns: 34px minmax(0, 1fr);
|
||||
}
|
||||
|
||||
[data-theme="dark"] .sidebar-context-card {
|
||||
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
|
||||
}
|
||||
@@ -12729,15 +12733,51 @@ textarea:focus {
|
||||
font-weight: 820;
|
||||
}
|
||||
|
||||
.sidebar-context-card-admin .sidebar-context-copy strong {
|
||||
font-size: 13.5px;
|
||||
}
|
||||
|
||||
.sidebar-scroll {
|
||||
flex: 1 1 auto;
|
||||
min-height: 0;
|
||||
overflow-y: auto;
|
||||
overflow-x: visible;
|
||||
padding-bottom: 8px;
|
||||
scrollbar-width: thin;
|
||||
scrollbar-color: color-mix(in srgb, var(--color-primary) 24%, transparent) transparent;
|
||||
}
|
||||
|
||||
.sidebar-scroll::-webkit-scrollbar {
|
||||
width: 4px;
|
||||
}
|
||||
|
||||
.sidebar-scroll::-webkit-scrollbar-thumb {
|
||||
border-radius: 999px;
|
||||
background: color-mix(in srgb, var(--color-primary) 22%, transparent);
|
||||
}
|
||||
|
||||
.sidebar-group {
|
||||
padding-top: 4px;
|
||||
}
|
||||
|
||||
.sidebar-footer {
|
||||
flex: 0 0 auto;
|
||||
padding-top: 10px;
|
||||
margin-top: 10px;
|
||||
border-top: 1px solid color-mix(in srgb, var(--console-line) 72%, transparent);
|
||||
background: inherit;
|
||||
}
|
||||
|
||||
.sidebar-item {
|
||||
border-radius: 10px;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.sidebar.collapsed .sidebar-collapse-btn {
|
||||
justify-content: center;
|
||||
padding-inline: 0;
|
||||
}
|
||||
|
||||
.sidebar-item.active {
|
||||
box-shadow: inset 4px 0 0 color-mix(in srgb, var(--color-primary) 80%, transparent), 0 8px 18px rgba(20, 38, 68, 0.06);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user