Add grid helper

.gitignore

@@ -1,30 +1,3 @@
-# Nix/Direnv
 /.direnv/
-
-# Logs
-logs
-*.log
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
-pnpm-debug.log*
-lerna-debug.log*
-
-# Dependencies
-node_modules
-
-# Build output
-dist
-dist-ssr
-*.local
-
-# Editor directories and files
-.vscode/*
-!.vscode/extensions.json
-.idea
-.DS_Store
-*.suo
-*.ntvs*
-*.njsproj
-*.sln
-*.sw?
+/node_modules/
+/dist/

TODO.md

@@ -36,7 +36,7 @@ A step-by-step checklist for porting MatterControl's design features to a Vue +
 - [x] Add basic lighting (ambient + two directional)
 
 ### Scene Helpers
-- [ ] Add ground grid helper (XZ plane)
+- [x] Add ground grid helper (XZ plane)
 - [ ] Add axis helper (RGB arrows for X/Y/Z)
 - [ ] Add option to toggle grid visibility
 - [ ] Add option to toggle axis visibility

src/components/Viewport.vue

@@ -32,6 +32,9 @@ function initScene() {
   // Add lighting
   addLighting()
 
+  // Add grid helper
+  addGridHelper()
+
   // Add a test cube to verify rendering
   addTestCube()
 
@@ -42,6 +45,11 @@ function initScene() {
   animate()
 }
 
+function addGridHelper() {
+  const gridHelper = new THREE.GridHelper(10, 10, 0x444444, 0x333333)
+  scene.add(gridHelper)
+}
+
 function addLighting() {
   // Ambient light for base illumination
   const ambientLight = new THREE.AmbientLight(0xffffff, 0.4)