soroushdes/flatrender
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(admin): sidebar invisible (CSS specificity) + /admin lands on dashboard

Browse Source 
- AdminShell: the rtl:/ltr: translate variants ([dir] selector) out-specified
  lg:translate-x-0, so the sidebar stayed off-screen on desktop and the mobile
  drawer couldn't open. Pin physically right + plain translate-x-full/0; content
  uses lg:mr-60.
- /admin now redirects to /admin/stats (overview) instead of /admin/nodes.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
soroush.asadi
2026-06-03 08:20:46 +03:30
parent 43780f94f6
commit b270ef438d
2 changed files with 9 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/[locale]/admin/page.tsx
+2 -1
View File
@@ -1,5 +1,6 @@
import { redirect } from "next/navigation"; import { redirect } from "next/navigation";
export default function AdminRootPage() { export default function AdminRootPage() {
redirect("/admin/nodes"); // Land on the dashboard overview, not an arbitrary section.
redirect("/admin/stats");
} }
src/components/admin/AdminShell.tsx
+7 -4
View File
@@ -28,10 +28,13 @@ export function AdminShell({
return ( return (
<div className="min-h-screen bg-[#0c0e1a] text-gray-200"> <div className="min-h-screen bg-[#0c0e1a] text-gray-200">
{/* Sidebar */} {/* Sidebar — pinned to the right (admin is RTL-primary). lg:translate-x-0
keeps it visible on desktop; on mobile it slides off the right edge.
(Avoid rtl:/ltr: translate variants — their [dir] selector out-specifies
lg: and would keep the panel off-screen.) */}
<aside <aside
className={`fixed inset-y-0 start-0 z-40 flex w-60 flex-col border-e border-[#1e2235] bg-[#0d0f1c] transition-transform lg:translate-x-0 ${ className={`fixed inset-y-0 right-0 z-40 flex w-60 flex-col border-l border-[#1e2235] bg-[#0d0f1c] transition-transform lg:translate-x-0 ${
open ? "translate-x-0" : "rtl:translate-x-full ltr:-translate-x-full" open ? "translate-x-0" : "translate-x-full"
}`} }`}
> >
<div className="flex h-14 items-center gap-2 border-b border-[#1e2235] px-5"> <div className="flex h-14 items-center gap-2 border-b border-[#1e2235] px-5">
@@ -75,7 +78,7 @@ export function AdminShell({
{open && <div className="fixed inset-0 z-30 bg-black/50 lg:hidden" onClick={() => setOpen(false)} />} {open && <div className="fixed inset-0 z-30 bg-black/50 lg:hidden" onClick={() => setOpen(false)} />}
{/* Main column */} {/* Main column */}
<div className="lg:ms-60"> <div className="lg:mr-60">
<header className="sticky top-0 z-20 flex h-14 items-center gap-3 border-b border-[#1e2235] bg-[#0f1120]/90 px-5 backdrop-blur"> <header className="sticky top-0 z-20 flex h-14 items-center gap-3 border-b border-[#1e2235] bg-[#0f1120]/90 px-5 backdrop-blur">
<button <button
className="rounded-lg border border-[#262b40] p-1.5 text-gray-300 hover:bg-[#161a2e] lg:hidden" className="rounded-lg border border-[#262b40] p-1.5 text-gray-300 hover:bg-[#161a2e] lg:hidden"