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

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

@ -5,6 +5,7 @@ import Tile from "../tile/Tile";
function DiceTile({ dice, isSelected, onDiceSelect, onDone }) { function DiceTile({ dice, isSelected, onDiceSelect, onDone }) {
return ( return (
<div style={{ cursor: "pointer" }}>
<Tile <Tile
title={dice.name} title={dice.name}
isSelected={isSelected} isSelected={isSelected}
@ -13,6 +14,7 @@ function DiceTile({ dice, isSelected, onDiceSelect, onDone }) {
> >
<Image src={dice.preview}></Image> <Image src={dice.preview}></Image>
</Tile> </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