1 files changed, 25 insertions, 0 deletions
diff --git a/js/pixel-art/pixel/app.js b/js/pixel-art/pixel/app.js
index 087801c..e4a2235 100644
--- a/js/pixel-art/pixel/app.js
+++ b/js/pixel-art/pixel/app.js
@@ -10,6 +10,9 @@ let currentColor = '#000000';
 let grid = Array(gridWidth).fill().map(() => Array(gridHeight).fill(null));
 let offsetX = 0;
 let offsetY = 0;
+const paletteToggle = document.getElementById('palette-toggle');
+const palette = document.getElementById('palette');
+let isPaletteVisible = true;
 
 // Event Listeners
 canvas.addEventListener('click', handleCanvasClick);
@@ -19,6 +22,7 @@ document.getElementById('gridHeight').addEventListener('change', updateGridSize)
 document.getElementById('resetBtn').addEventListener('click', handleReset);
 document.getElementById('exportBtn').addEventListener('click', exportToPNG);
 window.addEventListener('keydown', handlePan);
+paletteToggle.addEventListener('click', togglePalette);
 
 // Initialization
 resizeCanvas();
@@ -122,6 +126,7 @@ function saveToLocalStorage() {
         colorHistory: colorHistory,
         currentColor: currentColor,
         grid: grid,
+        isPaletteVisible: isPaletteVisible
     };
     localStorage.setItem('pixelArtConfig', JSON.stringify(gridData));
 }
@@ -141,6 +146,12 @@ function loadFromLocalStorage() {
         document.getElementById('colorPicker').value = currentColor;
         centerGrid();
         drawGrid();
+        isPaletteVisible = gridData.isPaletteVisible ?? true;
+        if (!isPaletteVisible) {
+            palette.classList.add('hidden');
+            paletteToggle.classList.add('hidden');
+            paletteToggle.innerHTML = '🎨';
+        }
     } else {
         initializeGrid();
         centerGrid();
@@ -183,4 +194,18 @@ function handleCanvasClick(e) {
         drawGrid();
         saveToLocalStorage();
     }
+}
+
+function togglePalette() {
+    isPaletteVisible = !isPaletteVisible;
+    
+    if (isPaletteVisible) {
+        palette.classList.remove('hidden');
+        paletteToggle.classList.remove('hidden');
+        paletteToggle.innerHTML = '☰';
+    } else {
+        palette.classList.add('hidden');
+        paletteToggle.classList.add('hidden');
+        paletteToggle.innerHTML = '🎨';
+    }
 }
\ No newline at end of file