jason/polaris-task-force
1
0
Fork 0
Code Issues Wiki Activity

fix(minesweeper): prevent default context menu on right-click for game board

Browse source
This commit is contained in:
Jason Fraley 2026-08-28 20:04:15 -04:00
parent 18e48243b3
commit 6d9b0ed8d8
1 changed files with 21 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

34
src/components/frontend/eod/MinesweeperBoard.tsx
View file

@ -504,6 +504,7 @@ export function MinesweeperBoard({
: "flex items-center justify-center p-2",
)}
style={{ containerType: "inline-size" }}
onContextMenu={(event) => event.preventDefault()}
>
<div
className="grid min-w-max grid-cols-[repeat(var(--board-cols),var(--cell-size))] gap-1"
@ -611,7 +612,10 @@ export function MinesweeperBoard({
</LoginLink>
</div>
)}
<div className="flex select-none flex-col gap-4 rounded-xl border border-border bg-card p-4 shadow">
<div
className="flex select-none flex-col gap-4 rounded-xl border border-border bg-card p-4 shadow"
onContextMenu={(event) => event.preventDefault()}
>
<div className="flex flex-wrap items-start justify-between gap-4">
<div className="flex flex-col gap-1">
<div className="flex items-center gap-2 text-sm font-semibold">
@ -651,9 +655,14 @@ export function MinesweeperBoard({
/>
</label>
{phase !== "playing" && (
<>
<div className="grid gap-2 md:grid-cols-3">
<fieldset
disabled={phase === "playing"}
className={cn(
"m-0 flex min-w-0 flex-col gap-4 border-0 p-0 transition-opacity duration-300",
phase === "playing" && "pointer-events-none opacity-40",
)}
>
<div className="grid gap-2 md:grid-cols-3">
{DIFFICULTY_KEYS.map((key) => {
const option = DIFFICULTIES[key];
return (
@ -675,8 +684,8 @@ export function MinesweeperBoard({
</Button>
);
})}
</div>
{customUnlocked ? (
</div>
{customUnlocked ? (
<div className="rounded-lg border border-emerald-500/40 bg-emerald-500/5 p-3">
<div className="flex flex-wrap items-end gap-3">
<div className="flex flex-col gap-1">
@ -783,13 +792,12 @@ export function MinesweeperBoard({
{CUSTOM_MAX_SIZE}×{CUSTOM_MAX_SIZE} field.
</p>
</div>
) : (
<p className="text-xs text-muted-foreground">
Clear all three standard locations to unlock custom minefields.
</p>
)}
</>
)}
) : (
<p className="text-xs text-muted-foreground">
Clear all three standard locations to unlock custom minefields.
</p>
)}
</fieldset>
<div
className={cn(