feat: snake color now changes dynamically based on position

This commit is contained in:
Flatlogic Bot 2025-09-17 20:45:31 +00:00
parent 1324f424e4
commit 68527227eb

View File

@ -113,14 +113,14 @@ document.addEventListener('DOMContentLoaded', () => {
} }
function draw() { function draw() {
const accentColor = getComputedStyle(document.body).getPropertyValue('--accent-color').trim();
const canvasBg = getComputedStyle(document.body).getPropertyValue('--canvas-bg').trim(); const canvasBg = getComputedStyle(document.body).getPropertyValue('--canvas-bg').trim();
ctx.fillStyle = canvasBg; ctx.fillStyle = canvasBg;
ctx.fillRect(0, 0, canvas.width, canvas.height); ctx.fillRect(0, 0, canvas.width, canvas.height);
snake.forEach((segment, index) => { snake.forEach((segment, index) => {
ctx.fillStyle = accentColor; const hue = (segment.x * 5 + segment.y * 5) % 360;
ctx.fillStyle = `hsl(${hue}, 100%, 50%)`;
if (index === 0) { if (index === 0) {
ctx.fillRect(segment.x * gridSize, segment.y * gridSize, gridSize, gridSize); ctx.fillRect(segment.x * gridSize, segment.y * gridSize, gridSize, gridSize);
} else { } else {