diff --git a/server/templates/dashboard.html b/server/templates/dashboard.html index fff8cc8..18f5f0b 100644 --- a/server/templates/dashboard.html +++ b/server/templates/dashboard.html @@ -1776,10 +1776,11 @@ if (snakeBody.has(key)) { const hasHeadIcon = headIconByCell.has(key); const hasTailIcon = tailIconByCell.has(key); + const bodyColor = snakeBody.get(key); if (hasHeadIcon || hasTailIcon) { //cell.style.background = "var(--cell)"; } else { - cell.style.background = snakeBody.get(key); + cell.style.background = bodyColor; } if (selectedSnakeId && snakeIdByCell.get(key) !== selectedSnakeId) { cell.style.opacity = "0.2"; @@ -1796,24 +1797,33 @@ if (up && right && !down && !left) { cell.classList.add("snake-turn-cell"); cell.classList.add("snake-turn-dl"); - cell.style.setProperty("--turn-color", snakeBody.get(key)); + cell.style.setProperty("--turn-color", bodyColor); cell.style.background = "var(--cell)"; } else if (up && left && !down && !right) { cell.classList.add("snake-turn-cell"); cell.classList.add("snake-turn-dr"); - cell.style.setProperty("--turn-color", snakeBody.get(key)); + cell.style.setProperty("--turn-color", bodyColor); cell.style.background = "var(--cell)"; } else if (down && right && !up && !left) { cell.classList.add("snake-turn-cell"); cell.classList.add("snake-turn-ul"); - cell.style.setProperty("--turn-color", snakeBody.get(key)); + cell.style.setProperty("--turn-color", bodyColor); cell.style.background = "var(--cell)"; } else if (down && left && !up && !right) { cell.classList.add("snake-turn-cell"); cell.classList.add("snake-turn-ur"); - cell.style.setProperty("--turn-color", snakeBody.get(key)); + cell.style.setProperty("--turn-color", bodyColor); cell.style.background = "var(--cell)"; } + + const bridgeShadows = []; + if (up) bridgeShadows.push(`0 -1px 0 ${bodyColor}`); + if (down) bridgeShadows.push(`0 1px 0 ${bodyColor}`); + if (left) bridgeShadows.push(`-1px 0 0 ${bodyColor}`); + if (right) bridgeShadows.push(`1px 0 0 ${bodyColor}`); + if (bridgeShadows.length > 0) { + cell.style.boxShadow = bridgeShadows.join(", "); + } } } }