Websites/interactives
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Changes

Browse source
This commit is contained in:
gpt-engineer-app[bot] 2025-12-08 09:41:19 +00:00
parent c5d7901fa2
commit 56c73bf714
1 changed files with 13 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

12
src/components/DominoRetilingPuzzle.tsx
View file

@ -186,7 +186,7 @@ const DominoRetilingPuzzle: React.FC<DominoRetilingPuzzleProps> = ({ showSocialS
return 'bg-rose-400 border-rose-600'; return 'bg-rose-400 border-rose-600';
}; };
const cellSize = Math.min(50, 400 / boardSize); const cellSize = Math.max(32, Math.min(44, 480 / boardSize));
// Render the board // Render the board
const renderBoard = () => { const renderBoard = () => {
@ -422,10 +422,13 @@ const DominoRetilingPuzzle: React.FC<DominoRetilingPuzzleProps> = ({ showSocialS
{/* Board */} {/* Board */}
<Card> <Card>
<CardContent className="p-6"> <CardContent className="p-8">
<div className="flex justify-center overflow-x-auto"> <div className="flex justify-center">
<div <div
className="relative border-2 border-foreground/30 bg-background" className="relative bg-background rounded-lg border border-border shadow-sm p-3"
>
<div
className="relative"
style={{ style={{
width: BOARD_COLS * cellSize, width: BOARD_COLS * cellSize,
height: BOARD_ROWS * cellSize, height: BOARD_ROWS * cellSize,
@ -434,6 +437,7 @@ const DominoRetilingPuzzle: React.FC<DominoRetilingPuzzleProps> = ({ showSocialS
{renderBoard()} {renderBoard()}
</div> </div>
</div> </div>
</div>
{selectedDomino !== null && ( {selectedDomino !== null && (
<p className="text-center text-sm text-muted-foreground mt-4"> <p className="text-center text-sm text-muted-foreground mt-4">
Domino picked up. Hover over empty cells to preview placement, then click to place. Domino picked up. Hover over empty cells to preview placement, then click to place.