tour/word
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

inital-release

Browse Source
This commit is contained in:
mike
2025-12-16 14:14:26 +01:00
parent 24cb98e75c
commit 1744f1b210
2 changed files with 15 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
public/game.js
View File

@@ -243,15 +243,15 @@ class KruiswoordProGame {
const isMobile = window.innerWidth < 768 const isMobile = window.innerWidth < 768
const headerHeight = isMobile ? 70 : 80 const headerHeight = isMobile ? 70 : 80
const progressHeight = isMobile ? 50 : 60 const progressHeight = isMobile ? 50 : 60
const controlsHeight = isMobile ? 90 : 120 const controlsHeight = isMobile ? 100 : 120
const gridPadding = isMobile ? 5 : 10 // padding inside grid-container const gridPadding = isMobile ? 5 : 10 // padding inside grid-container
const sectionPadding = isMobile ? 10 : 20 // padding of puzzle-section const sectionPadding = isMobile ? 5 : 20 // padding of puzzle-section
const mainPadding = isMobile ? 10 : 20 // game-main padding const mainPadding = isMobile ? 10 : 20 // game-main padding
const totalPadding = (gridPadding * 2) + (sectionPadding * 2) + (mainPadding * 2) const totalPadding = (gridPadding * 2) + (sectionPadding * 2) + (mainPadding * 2) + (isMobile ? 20 : 0)
const gap = isMobile ? 1 : 2 const gap = isMobile ? 1 : 2
const availableHeight = window.innerHeight - headerHeight - progressHeight - controlsHeight - totalPadding - 20 // 20px safety margin const availableHeight = window.innerHeight - headerHeight - progressHeight - controlsHeight - totalPadding
const availableWidth = window.innerWidth - totalPadding - 10 // 10px safety margin const availableWidth = window.innerWidth - totalPadding
// Calculate max cell size based on available space // Calculate max cell size based on available space
// Account for gaps between cells // Account for gaps between cells
@@ -264,9 +264,9 @@ class KruiswoordProGame {
// Use the smaller dimension // Use the smaller dimension
let cellSize = Math.floor(Math.min(maxCellFromHeight, maxCellFromWidth)) let cellSize = Math.floor(Math.min(maxCellFromHeight, maxCellFromWidth))
// Set min/max bounds based on device // Set min/max bounds based on device - more conservative on mobile
const minSize = isMobile ? 30 : 40 const minSize = isMobile ? 28 : 40
const maxSize = isMobile ? 50 : 120 const maxSize = isMobile ? 45 : 120
cellSize = Math.max(minSize, Math.min(maxSize, cellSize)) cellSize = Math.max(minSize, Math.min(maxSize, cellSize))
console.log('Grid calculation:', { console.log('Grid calculation:', {

8
public/styles_v3.css
View File

@@ -181,10 +181,13 @@ body {
} }
.puzzle-section { .puzzle-section {
padding: 10px; padding: 5px;
border-radius: 10px; border-radius: 10px;
overflow: hidden; overflow: hidden;
width: 100%; width: 100%;
display: flex;
justify-content: center;
align-items: center;
} }
} }
@@ -206,6 +209,9 @@ body {
padding: 5px; padding: 5px;
gap: 1px; gap: 1px;
width: fit-content; width: fit-content;
margin: 0 auto;
display: grid;
place-items: center;
} }
} }