diff --git a/media.db b/media.db index b413cb2..f6177db 100644 Binary files a/media.db and b/media.db differ diff --git a/screenshot/image copy.png b/screenshot/image copy.png new file mode 100644 index 0000000..011dca8 Binary files /dev/null and b/screenshot/image copy.png differ diff --git a/screenshot/image.png b/screenshot/image.png deleted file mode 100644 index feba794..0000000 Binary files a/screenshot/image.png and /dev/null differ diff --git a/src/app/globals.css b/src/app/globals.css index 5782631..2b4d657 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -4,65 +4,48 @@ @layer base { :root { - --background: 0 0% 100%; - --foreground: 222.2 84% 4.9%; - + --background: 0 0% 98%; + --foreground: 240 10% 3.9%; --card: 0 0% 100%; - --card-foreground: 222.2 84% 4.9%; - + --card-foreground: 240 10% 3.9%; --popover: 0 0% 100%; - --popover-foreground: 222.2 84% 4.9%; - + --popover-foreground: 240 10% 3.9%; --primary: 222.2 47.4% 11.2%; --primary-foreground: 210 40% 98%; - - --secondary: 210 40% 96.1%; - --secondary-foreground: 222.2 47.4% 11.2%; - - --muted: 210 40% 96.1%; - --muted-foreground: 215.4 16.3% 46.9%; - - --accent: 210 40% 96.1%; - --accent-foreground: 222.2 47.4% 11.2%; - + --secondary: 240 4.8% 95.9%; + --secondary-foreground: 240 5.9% 10%; + --muted: 240 4.8% 95.9%; + --muted-foreground: 240 3.8% 46.1%; + --accent: 240 4.8% 95.9%; + --accent-foreground: 240 5.9% 10%; --destructive: 0 84.2% 60.2%; - --destructive-foreground: 210 40% 98%; - - --border: 214.3 31.8% 91.4%; - --input: 214.3 31.8% 91.4%; - --ring: 222.2 84% 4.9%; - + --destructive-foreground: 0 0% 98%; + --border: 240 5.9% 90%; + --input: 240 5.9% 90%; + --ring: 240 10% 3.9%; --radius: 0.5rem; } .dark { - --background: 222.2 84% 4.9%; - --foreground: 210 40% 98%; - - --card: 222.2 84% 4.9%; - --card-foreground: 210 40% 98%; - - --popover: 222.2 84% 4.9%; - --popover-foreground: 210 40% 98%; - + --background: 240 10% 3.9%; + --foreground: 0 0% 98%; + --card: 240 10% 3.9%; + --card-foreground: 0 0% 98%; + --popover: 240 10% 3.9%; + --popover-foreground: 0 0% 98%; --primary: 210 40% 98%; --primary-foreground: 222.2 47.4% 11.2%; - - --secondary: 217.2 32.6% 17.5%; - --secondary-foreground: 210 40% 98%; - - --muted: 217.2 32.6% 17.5%; - --muted-foreground: 215 20.2% 65.1%; - - --accent: 217.2 32.6% 17.5%; - --accent-foreground: 210 40% 98%; - + --secondary: 240 3.7% 15.9%; + --secondary-foreground: 0 0% 98%; + --muted: 240 3.7% 15.9%; + --muted-foreground: 240 5% 64.9%; + --accent: 240 3.7% 15.9%; + --accent-foreground: 0 0% 98%; --destructive: 0 62.8% 30.6%; - --destructive-foreground: 210 40% 98%; - - --border: 217.2 32.6% 17.5%; - --input: 217.2 32.6% 17.5%; - --ring: 212.7 26.8% 83.9%; + --destructive-foreground: 0 0% 98%; + --border: 240 3.7% 15.9%; + --input: 240 3.7% 15.9%; + --ring: 215 20.2% 65.1%; } } @@ -74,4 +57,4 @@ background-color: hsl(var(--background)); color: hsl(var(--foreground)); } -} \ No newline at end of file +} diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 7c915df..b596576 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -1,15 +1,10 @@ import type { Metadata } from "next"; -import { Geist, Geist_Mono } from "next/font/google"; +import { Inter } from "next/font/google"; import "./globals.css"; import Sidebar from "@/components/sidebar"; -const geistSans = Geist({ - variable: "--font-geist-sans", - subsets: ["latin"], -}); - -const geistMono = Geist_Mono({ - variable: "--font-geist-mono", +const inter = Inter({ + variable: "--font-inter", subsets: ["latin"], }); @@ -26,7 +21,7 @@ export default function RootLayout({ return (
diff --git a/src/app/page.tsx b/src/app/page.tsx index a932894..06f9155 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,103 +1,13 @@ -import Image from "next/image"; +import { Header } from "@/components/ui/header"; export default function Home() { return ( -
-
- Next.js logo -
    -
  1. - Get started by editing{" "} - - src/app/page.tsx - - . -
    2. -
  2. - Save and see your changes instantly. -
    3. -
- -
- - Vercel logomark - Deploy now - - - Read our docs - -
-
- +
+
+
+

Welcome to NextAV

+

Select a library from the sidebar to get started.

+
); -} +} \ No newline at end of file diff --git a/src/app/settings/page.tsx b/src/app/settings/page.tsx index c4ca9d4..b7ef136 100644 --- a/src/app/settings/page.tsx +++ b/src/app/settings/page.tsx @@ -5,6 +5,7 @@ import { useState, useEffect } from "react"; import { Button } from "@/components/ui/button"; import { Input } from "@/components/ui/input"; import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"; +import { Header } from "@/components/ui/header"; interface Library { id: number; @@ -64,7 +65,7 @@ const SettingsPage = () => { return (
-

Settings

+
diff --git a/src/app/videos/page.tsx b/src/app/videos/page.tsx index 5ac4757..d2e8a94 100644 --- a/src/app/videos/page.tsx +++ b/src/app/videos/page.tsx @@ -9,6 +9,7 @@ import { CardHeader, CardTitle, } from "@/components/ui/card"; +import { Header } from "@/components/ui/header"; interface Video { id: number; @@ -33,7 +34,7 @@ const VideosPage = () => { return (
-

Videos

+
{videos.map((video) => ( diff --git a/src/components/sidebar.tsx b/src/components/sidebar.tsx index cce05c8..5fef9b1 100644 --- a/src/components/sidebar.tsx +++ b/src/components/sidebar.tsx @@ -13,10 +13,13 @@ import { Folder, } from "lucide-react"; import Link from "next/link"; +import { usePathname } from "next/navigation"; +import { cn } from "@/lib/utils"; const Sidebar = () => { const [isCollapsed, setIsCollapsed] = useState(false); const [libraries, setLibraries] = useState<{ id: number; path: string }[]>([]); + const pathname = usePathname(); useEffect(() => { fetchLibraries(); @@ -32,50 +35,70 @@ const Sidebar = () => { setIsCollapsed(!isCollapsed); }; + const navItems = [ + { href: "/", label: "Home", icon: Home }, + { href: "/settings", label: "Settings", icon: Settings }, + { href: "/videos", label: "Videos", icon: Video }, + { href: "/photos", label: "Photos", icon: Image }, + ]; + return (
+ className={cn( + "flex flex-col bg-gray-100 dark:bg-gray-900 text-gray-700 dark:text-gray-200 border-r border-gray-200 dark:border-gray-800 transition-all duration-300", + isCollapsed ? "w-20" : "w-64" + )} + >
- {!isCollapsed &&

NextAV

} + {!isCollapsed && ( +

NextAV

+ )}
-