[verified] Snake 0.8: circular arena and larger 32px tiles

This commit is contained in:
2026-09-12 13:18:15 +01:00
parent 5a7081b933
commit 18a6ef7d72
31 changed files with 272 additions and 70 deletions
+17 -17
View File
@@ -10,7 +10,7 @@
</div>
<div class="footer">
<text class="modeLabel">{{ modeText }}</text>
<text class="hint">swipe / tap to pause</text>
<text class="hint">swipe / tap pause</text>
</div>
<div class="overlay" show="{{ paused && !over }}">
<text class="overText">PAUSED</text>
@@ -40,14 +40,14 @@ import snake from '../../common/snake.js'
import storage from '@system.storage'
import best from '../../common/best.js'
const CELL = 20
const GRID = 16
const OFFSET = 73
const CELL = snake.ARENA.cell
const GRID = snake.ARENA
const OFFSET = snake.ARENA.offset
export default {
private: {
snake: [],
food: { left: '73px', top: '73px' },
food: { left: '57px', top: '57px' },
hasFood: true,
endText: 'GAME OVER',
scoreText: 'SCORE 0',
@@ -195,41 +195,41 @@ export default {
width: 466px; height: 466px;
}
.board {
position: absolute; left: 73px; top: 73px;
width: 320px; height: 320px;
position: absolute; left: 49px; top: 49px;
width: 368px; height: 368px;
}
.seg {
position: absolute;
width: 20px; height: 20px;
width: 32px; height: 32px;
}
.food {
position: absolute;
width: 20px; height: 20px;
width: 32px; height: 32px;
}
.score {
width: 188px; height: 22px;
width: 152px; height: 20px;
color: #d8edce; font-size: 18px; text-align: center;
}
.best {
width: 188px; height: 22px;
width: 152px; height: 20px;
color: #f3bd60; font-size: 17px; text-align: center;
}
.hud {
position: absolute; left: 139px; top: 24px;
width: 188px; height: 44px;
position: absolute; left: 157px; top: 16px;
width: 152px; height: 40px;
flex-direction: column; align-items: center;
}
.footer {
position: absolute; left: 135px; top: 400px;
width: 196px; height: 40px;
position: absolute; left: 143px; top: 410px;
width: 180px; height: 36px;
flex-direction: column; align-items: center;
}
.modeLabel {
width: 196px; height: 20px;
width: 180px; height: 18px;
color: #cee4bd; font-size: 17px; text-align: center;
}
.hint {
width: 196px; height: 20px;
width: 180px; height: 18px;
color: #adb7c6; font-size: 16px; text-align: center;
}
.overlay {