feat: reduce font size and split sentences into two lines

- Reduce font size from 32px to 20px for sentences/paragraphs mode
- Add breakTextIntoLines helper to split sentences naturally at spaces
- Render sentences across two lines with proper color progression
- Add space character to allowed input regex
This commit is contained in:
2025-11-04 17:14:58 +00:00
parent c271d1c4bf
commit 9ed9a0510c
3 changed files with 97 additions and 28 deletions
+7 -3
View File
@@ -41,15 +41,19 @@ export function useGameStatus(onGameLoopTick?: (deltaTime: number, letters: Fall
if (currentTime - lastSpawnRef.current > SPAWN_INTERVAL && lettersRef.current.length < MAX_ACTIVE_LETTERS) {
const fullText = getRandomWord(gameModeRef.current);
const firstChar = fullText[0].toUpperCase();
// For sentences/paragraphs, spawn centered. For letters/words, spawn randomly
const isCenteredMode = gameModeRef.current === 'sentences' || gameModeRef.current === 'paragraphs';
const spawnWidth = CANVAS_WIDTH - MARGIN_LEFT - MARGIN_RIGHT;
const randomX = MARGIN_LEFT + Math.random() * spawnWidth;
const spawnX = isCenteredMode ? CANVAS_WIDTH / 2 : (MARGIN_LEFT + Math.random() * spawnWidth);
const randomY = Math.random() * 150; // Between 0-150 (top half of screen)
const newLetter: FallingLetter = {
id: `${currentTime}-${randomX}`,
id: `${currentTime}-${spawnX}`,
letter: firstChar,
fullText: fullText.toUpperCase(),
charIndex: 0,
x: randomX,
x: spawnX,
y: randomY,
state: 'normal',
};