0520发布文章

2026-05-21 00:27:35 +08:00
1 parent 993ac5581d
commit 013dce4f9f
@@ -0,0 +1,63 @@
+"use client";
+
+import Link from "next/link";
+import { usePathname } from "next/navigation";
+import { FileText, PenSquare, MessageSquare, Trash2, Rss, Link2, MessageCircle, Image } from "lucide-react";
+
+const navItems = [
+  { href: "/", label: "文章", icon: FileText },
+  { href: "/edit", label: "撰写", icon: PenSquare },
+  { href: "/comments", label: "评论", icon: MessageSquare },
+  { href: "/feeds", label: "订阅源", icon: Rss },
+  { href: "/links", label: "友链", icon: Link2 },
+  { href: "/images", label: "图片", icon: Image },
+  { href: "/wechat", label: "公众号", icon: MessageCircle },
+  { href: "/recycle", label: "回收站", icon: Trash2 },
+];
+
+export default function Sidebar() {
+  const pathname = usePathname();
+
+  const isActive = (href: string) => {
+    if (href === "/") return pathname === "/";
+    return pathname.startsWith(href);
+  };
+
+  return (
+    <aside className="w-1/4 min-w-[200px] max-w-[260px] bg-surface border-r border-line flex flex-col shrink-0">
+      {/* Logo */}
+      <div className="px-5 py-5 border-b border-line">
+        <h1 className="text-[15px] font-bold text-accent tracking-wider">
+          写作后台
+        </h1>
+        <p className="text-[11px] text-muted/70 mt-0.5">优世界</p>
+      </div>
+
+      {/* Nav */}
+      <nav className="flex-1 px-2.5 py-3 space-y-0.5">
+        {navItems.map((item) => {
+          const active = isActive(item.href);
+          return (
+            <Link
+              key={item.href}
+              href={item.href}
+              className={`flex items-center gap-2.5 px-3 py-2 rounded-md text-[13px] transition-colors ${
+                active
+                  ? "bg-accent text-white font-medium"
+                  : "text-text/80 hover:bg-bg hover:text-accent"
+              }`}
+            >
+              <item.icon size={15} strokeWidth={active ? 2.5 : 1.8} />
+              {item.label}
+            </Link>
+          );
+        })}
+      </nav>
+
+      {/* Footer */}
+      <div className="px-4 py-3 border-t border-line">
+        <p className="text-[10px] text-muted/50">localhost:8016</p>
+      </div>
+    </aside>
+  );
+}