From b0d6817c542189800a5643d71f3bb2fef9286505 Mon Sep 17 00:00:00 2001 From: Brian Fertig Date: Sun, 31 May 2026 08:24:35 -0600 Subject: [PATCH] Rounded Tutorial Buttons --- public/src/scenes/GameMenuScene.js | 20 ++++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/public/src/scenes/GameMenuScene.js b/public/src/scenes/GameMenuScene.js index c7f5701..e8020f6 100644 --- a/public/src/scenes/GameMenuScene.js +++ b/public/src/scenes/GameMenuScene.js @@ -8,16 +8,16 @@ import { TutorialModal } from '../ui/TutorialModal.js'; const CATEGORIES = [ { key: 'tabletop', label: 'Tabletop' }, - { key: 'cards', label: 'Cards' }, - { key: 'casino', label: 'Casino' }, - { key: 'word', label: 'Word' }, + { key: 'cards', label: 'Cards' }, + { key: 'casino', label: 'Casino' }, + { key: 'word', label: 'Word' }, ]; const TAB_ICON_FRAMES = { tabletop: 0, cards: 1, casino: 2, word: 3 }; -const ICON_INACTIVE = 56; -const ICON_ACTIVE = 72; +const ICON_INACTIVE = 56; +const ICON_ACTIVE = 72; const ICON_OVERSHOOT = 86; -const ICON_X_OFFSET = -125; +const ICON_X_OFFSET = -125; export default class GameMenuScene extends Phaser.Scene { constructor() { super('GameMenu'); } @@ -202,9 +202,9 @@ export default class GameMenuScene extends Phaser.Scene { const drawQ = (hover) => { qg.clear(); qg.fillStyle(0x1e1a12, 0.9); - qg.fillRect(qx - QBTN_SIZE / 2, qy - QBTN_SIZE / 2, QBTN_SIZE, QBTN_SIZE); + qg.fillRoundedRect(qx - QBTN_SIZE / 2, qy - QBTN_SIZE / 2, QBTN_SIZE, QBTN_SIZE, 8); qg.lineStyle(2, hover ? COLORS.gold : COLORS.accent, 1); - qg.strokeRect(qx - QBTN_SIZE / 2, qy - QBTN_SIZE / 2, QBTN_SIZE, QBTN_SIZE); + qg.strokeRoundedRect(qx - QBTN_SIZE / 2, qy - QBTN_SIZE / 2, QBTN_SIZE, QBTN_SIZE, 8); }; drawQ(false); @@ -217,8 +217,8 @@ export default class GameMenuScene extends Phaser.Scene { new Phaser.Geom.Rectangle(qx - QBTN_SIZE / 2, qy - QBTN_SIZE / 2, QBTN_SIZE, QBTN_SIZE), Phaser.Geom.Rectangle.Contains, ); - qg.on('pointerover', () => { drawQ(true); showTooltip(`Tutorial for ${game.name}`); }); - qg.on('pointerout', () => { drawQ(false); hideTooltip(); }); + qg.on('pointerover', () => { drawQ(true); showTooltip(`Instructions: ${game.name}`); }); + qg.on('pointerout', () => { drawQ(false); hideTooltip(); }); qg.on('pointerdown', () => new TutorialModal(game).open()); this._gameObjects.push(qg, qLabel);