refactor: style of tabs admin
This commit is contained in:
@@ -2,9 +2,15 @@
|
|||||||
|
|
||||||
import { Building2, Settings } from "lucide-react";
|
import { Building2, Settings } from "lucide-react";
|
||||||
import Link from "next/link";
|
import Link from "next/link";
|
||||||
|
import { usePathname } from "next/navigation";
|
||||||
import { Button } from "@/components/ui/button";
|
import { Button } from "@/components/ui/button";
|
||||||
|
|
||||||
export function AdminHeader() {
|
export function AdminHeader() {
|
||||||
|
const pathname = usePathname();
|
||||||
|
|
||||||
|
const isOverviewActive = pathname === "/admin";
|
||||||
|
const isManageActive = pathname === "/admin/manage";
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="text-center space-y-4 mb-12">
|
<div className="text-center space-y-4 mb-12">
|
||||||
<div className="inline-flex items-center gap-2 px-4 py-2 rounded-full bg-white/5 border border-white/10 backdrop-blur-sm">
|
<div className="inline-flex items-center gap-2 px-4 py-2 rounded-full bg-white/5 border border-white/10 backdrop-blur-sm">
|
||||||
@@ -22,24 +28,36 @@ export function AdminHeader() {
|
|||||||
</p>
|
</p>
|
||||||
|
|
||||||
<div className="flex justify-center gap-4 pt-4">
|
<div className="flex justify-center gap-4 pt-4">
|
||||||
<Link href="/admin">
|
<div className="bg-white/5 backdrop-blur-sm border border-white/10 rounded-2xl p-1">
|
||||||
<Button
|
<div className="flex">
|
||||||
variant="outline"
|
<Link href="/admin">
|
||||||
className="border-white/20 text-white hover:bg-white/10"
|
<Button
|
||||||
>
|
variant="ghost"
|
||||||
<Building2 className="w-4 h-4 mr-2" />
|
className={`px-4 py-2 rounded-xl transition-colors ${
|
||||||
Vue d'ensemble
|
isOverviewActive
|
||||||
</Button>
|
? "bg-white/20 text-white shadow-sm"
|
||||||
</Link>
|
: "text-slate-400 hover:text-white hover:bg-white/10"
|
||||||
<Link href="/admin/manage">
|
}`}
|
||||||
<Button
|
>
|
||||||
variant="outline"
|
<Building2 className="w-4 h-4 mr-2" />
|
||||||
className="border-white/20 text-white hover:bg-white/10"
|
Vue d'ensemble
|
||||||
>
|
</Button>
|
||||||
<Settings className="w-4 h-4 mr-2" />
|
</Link>
|
||||||
Gestion
|
<Link href="/admin/manage">
|
||||||
</Button>
|
<Button
|
||||||
</Link>
|
variant="ghost"
|
||||||
|
className={`px-4 py-2 rounded-xl transition-colors ${
|
||||||
|
isManageActive
|
||||||
|
? "bg-white/20 text-white shadow-sm"
|
||||||
|
: "text-slate-400 hover:text-white hover:bg-white/10"
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
<Settings className="w-4 h-4 mr-2" />
|
||||||
|
Gestion
|
||||||
|
</Button>
|
||||||
|
</Link>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|||||||
Reference in New Issue
Block a user