ob/tsos
1
0
Fork 0
mirror of https://github.com/hex248/tsos.git synced 2026-02-07 18:23:05 +00:00
Code Issues Packages Projects Releases Wiki Activity

minor sidebar + buttons adjustments

Browse Source
This commit is contained in:
Oliver Bryan
2026-01-07 23:43:05 +00:00
parent bce2623727
commit 77a9b32841
3 changed files with 31 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
src/Layout.tsx
View File

@@ -1,16 +1,38 @@
import ThemeToggle from "@/components/theme-toggle";
import { Link, useLocation } from "react-router-dom";
import { Home, Settings } from "lucide-react";
import { Button } from "@/components/ui/button";
export default function Layout({ children }: { children: React.ReactNode }) {
const location = useLocation();
return (
<div className="flex h-screen w-full">
{/* sidebar - fixed width */}
<aside className="w-80 border-r bg-card p-6 flex flex-col gap-4">
<div className="w-80 border-r bg-card p-4 flex flex-col gap-4">
<div className="flex items-center justify-between">
<h1 className="text-2xl font-semibold">The Shape of Sound</h1>
<ThemeToggle />
</div>
<div className="flex-1">{/* controls will go here in later phases */}</div>
</aside>
<div className="flex items-center gap-4">
<ThemeToggle className="rounded-lg" />
{location.pathname !== "/settings" && (
<Link to="/settings">
<Button variant="ghost" size="icon" className="rounded-lg">
<Settings className="size-6" />
</Button>
</Link>
)}
{location.pathname !== "/" && (
<Link to="/">
<Button variant="ghost" size="icon" className="rounded-lg">
<Home className="size-6" />
</Button>
</Link>
)}
</div>
</div>
{/* canvas area - flex-1 */}
<main className="flex-1 flex items-center justify-center bg-background">{children}</main>