Atlas48/grungnet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix dice tile rendering

Browse Source
This commit is contained in:
Mitchell McCaffrey 2021-06-12 14:31:09 +10:00
parent 458feeec9e
commit 870d2de5de
2 changed files with 12 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/components/dice/DiceTile.js
View File

@ -5,14 +5,16 @@ import Tile from "../tile/Tile";
function DiceTile({ dice, isSelected, onDiceSelect, onDone }) { function DiceTile({ dice, isSelected, onDiceSelect, onDone }) {
return ( return (
<Tile <div style={{ cursor: "pointer" }}>
title={dice.name} <Tile
isSelected={isSelected} title={dice.name}
onSelect={() => onDiceSelect(dice)} isSelected={isSelected}
onDoubleClick={() => onDone(dice)} onSelect={() => onDiceSelect(dice)}
> onDoubleClick={() => onDone(dice)}
<Image src={dice.preview}></Image> >
</Tile> <Image src={dice.preview}></Image>
</Tile>
</div>
); );
} }

6
src/components/dice/DiceTiles.js
View File

@ -10,9 +10,7 @@ function DiceTiles({ dice, onDiceSelect, selectedDice, onDone }) {
const layout = useResponsiveLayout(); const layout = useResponsiveLayout();
return ( return (
<SimpleBar <SimpleBar style={{ height: layout.tileContainerHeight }}>
style={{ height: layout.screenSize === "large" ? "600px" : "400px" }}
>
<Grid <Grid
p={2} p={2}
pb={4} pb={4}
@ -22,7 +20,7 @@ function DiceTiles({ dice, onDiceSelect, selectedDice, onDone }) {
minHeight: layout.screenSize === "large" ? "600px" : "400px", minHeight: layout.screenSize === "large" ? "600px" : "400px",
}} }}
gap={2} gap={2}
columns={`repeat${layout.tileGridColumns}, 1fr`} columns={`repeat(${layout.tileGridColumns}, 1fr)`}
> >
{dice.map((dice) => ( {dice.map((dice) => (
<DiceTile <DiceTile