fix: 修复后台管理面板 UI 问题 — 移除多余分隔符竖线,用 flex 布局替代 calc() 高度计算
This commit is contained in:
@@ -1,6 +1,5 @@
|
|||||||
import { createFileRoute, Outlet } from '@tanstack/react-router'
|
import { createFileRoute, Outlet } from '@tanstack/react-router'
|
||||||
import { AdminSidebar } from '@/components/AdminSidebar'
|
import { AdminSidebar } from '@/components/AdminSidebar'
|
||||||
import { Separator } from '@/components/ui/separator'
|
|
||||||
import { SidebarInset, SidebarProvider, SidebarTrigger } from '@/components/ui/sidebar'
|
import { SidebarInset, SidebarProvider, SidebarTrigger } from '@/components/ui/sidebar'
|
||||||
|
|
||||||
export const Route = createFileRoute('/_protected/admin' as never)({
|
export const Route = createFileRoute('/_protected/admin' as never)({
|
||||||
@@ -14,11 +13,10 @@ function AdminLayout() {
|
|||||||
<SidebarInset>
|
<SidebarInset>
|
||||||
<header className="flex h-14 items-center gap-2 border-b px-6">
|
<header className="flex h-14 items-center gap-2 border-b px-6">
|
||||||
<SidebarTrigger />
|
<SidebarTrigger />
|
||||||
<Separator orientation="vertical" className="h-4" />
|
|
||||||
</header>
|
</header>
|
||||||
<main className="flex-1 p-6">
|
<div className="flex min-h-0 flex-1 flex-col p-6">
|
||||||
<Outlet />
|
<Outlet />
|
||||||
</main>
|
</div>
|
||||||
</SidebarInset>
|
</SidebarInset>
|
||||||
</SidebarProvider>
|
</SidebarProvider>
|
||||||
)
|
)
|
||||||
|
|||||||
@@ -32,13 +32,13 @@ function BookmarksAdmin() {
|
|||||||
const selectedCategory = data.find((category: { id: string }) => category.id === selectedCategoryId)
|
const selectedCategory = data.find((category: { id: string }) => category.id === selectedCategoryId)
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="space-y-6">
|
<div className="flex min-h-0 flex-1 flex-col gap-6">
|
||||||
<div>
|
<div>
|
||||||
<h1 className="text-2xl font-bold tracking-tight">书签管理</h1>
|
<h1 className="text-2xl font-bold tracking-tight">书签管理</h1>
|
||||||
<p className="text-muted-foreground">管理你的书签分类、图标和排序</p>
|
<p className="text-muted-foreground">管理你的书签分类、图标和排序</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="flex h-[calc(100vh-8rem)] gap-6">
|
<div className="flex min-h-0 flex-1 gap-6">
|
||||||
<div className="w-80 shrink-0">
|
<div className="w-80 shrink-0">
|
||||||
<CategoryManager
|
<CategoryManager
|
||||||
categories={data}
|
categories={data}
|
||||||
|
|||||||
Reference in New Issue
Block a user