1

src/app/page.tsx

@@ -598,57 +598,6 @@ export default function Home() {
             </div>
           </div>
         )}
-
-        {/* Grid Display Area */}
-        {mappedPixelData && gridDimensions && (
-          <div className="mt-8 p-4 bg-gray-200 rounded shadow-inner overflow-auto">
-            <h3 className="text-lg font-semibold mb-4 text-gray-700">拼豆图案 ({gridDimensions.M} x {gridDimensions.N})</h3>
-            <div
-              className="inline-grid border border-gray-400"
-              style={{
-                gridTemplateColumns: `repeat(${gridDimensions.N}, minmax(0, 1fr))`,
-                // Set a max width to prevent overly large grids from breaking layout
-                maxWidth: '100%',
-                // Calculate aspect ratio for the container itself
-                // aspectRatio: `${gridDimensions.N} / ${gridDimensions.M}` // Can cause layout issues if cells are small
-              }}
-            >
-              {mappedPixelData.flat().map((cell, index) => (
-                <div
-                  key={index}
-                  title={`${cell.key} (${cell.color})`}
-                  className="w-4 h-4 flex items-center justify-center text-xs font-mono leading-none" // Smaller size, flex center
-                  style={{
-                    backgroundColor: cell.color,
-                    color: getContrastColor(cell.color),
-                    // Add a subtle border to each cell
-                    border: '1px solid rgba(0,0,0,0.1)'
-                  }}
-                >
-                  {/* Optionally display the key inside */}
-                   {/* {cell.key} */}
-                </div>
-              ))}
-            </div>
-            {/* Download Buttons */}
-            <div className="mt-4 flex space-x-4">
-              <button
-                  onClick={handleDownloadImage}
-                  className="px-4 py-2 bg-green-500 text-white rounded hover:bg-green-600 transition duration-150"
-                  disabled={!mappedPixelData}
-              >
-                  下载 PNG 图案
-              </button>
-              <button
-                  onClick={handleDownloadJson}
-                  className="px-4 py-2 bg-blue-500 text-white rounded hover:bg-blue-600 transition duration-150"
-                  disabled={!mappedPixelData}
-              >
-                  下载 JSON 数据
-              </button>
-            </div>
-          </div>
-        )}
       </main>
 
       <footer className="w-full max-w-4xl mt-10 mb-6 py-4 text-center text-xs sm:text-sm text-gray-500 border-t border-gray-200">