From 34b9a2a327df1022a0fa13afeddd394a90f2adc0 Mon Sep 17 00:00:00 2001
From: Ruben Beltran del Rio <jj@r.bdr.sh>
Date: Fri, 30 Jan 2026 13:32:03 +0100
Subject: Adjust theme

---
 src/components/Sidebar.tsx | 15 +++++++++++++--
 1 file changed, 13 insertions(+), 2 deletions(-)

(limited to 'src/components')

diff --git a/src/components/Sidebar.tsx b/src/components/Sidebar.tsx
index 97d923b..441ced5 100644
--- a/src/components/Sidebar.tsx
+++ b/src/components/Sidebar.tsx
@@ -4,14 +4,25 @@ import { useStore } from "../store/store.ts";
 export const Sidebar: React.FC = () => {
   const availableModels = useStore((state) => state.availableModels);
   const addModel = useStore((state) => state.addModel);
+  const sidebarOpen = useStore((state) => state.sidebarOpen);
+  const closeSidebar = useStore((state) => state.closeSidebar);
 
   const handleAdd = (modelId: string) => {
     addModel(modelId, { x: 0, y: 0, z: 0 });
   };
 
   return (
-    <section className="sidebar">
-      <h2 className="sidebar-title">Models</h2>
+    <section className={`sidebar ${sidebarOpen ? "sidebar--open" : ""}`}>
+      <div className="sidebar-header">
+        <h2 className="sidebar-title">Models</h2>
+        <button
+          className="sidebar-close"
+          onClick={closeSidebar}
+          aria-label="Close sidebar"
+        >
+          &times;
+        </button>
+      </div>
       <nav className="model-list">
         {availableModels.map((model) => (
           <article key={model.id} className="model-item">
-- 
cgit