GridRep adjustments
* Properly unset mainhand when cells get reused and the new team doesnt have one * Slightly better styling to make the grid more correct
This commit is contained in:
parent
7b633a6c25
commit
d623431386
2 changed files with 14 additions and 4 deletions
|
|
@ -35,9 +35,9 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
& > .Grid {
|
& > .Grid {
|
||||||
aspect-ratio: 2/1;
|
aspect-ratio: 2/0.95;
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: 1fr 3fr; /* left column takes up 1 fraction, right column takes up 3 fractions */
|
grid-template-columns: 1fr 3.36fr; /* left column takes up 1 fraction, right column takes up 3 fractions */
|
||||||
grid-gap: $unit; /* add a gap of 8px between grid items */
|
grid-gap: $unit; /* add a gap of 8px between grid items */
|
||||||
|
|
||||||
.Weapon {
|
.Weapon {
|
||||||
|
|
@ -49,6 +49,7 @@
|
||||||
aspect-ratio: 73/153;
|
aspect-ratio: 73/153;
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-column: 1 / 2; /* spans one column */
|
grid-column: 1 / 2; /* spans one column */
|
||||||
|
max-height: 140px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.GridWeapons {
|
.GridWeapons {
|
||||||
|
|
@ -62,6 +63,8 @@
|
||||||
1fr
|
1fr
|
||||||
); /* create 3 rows, each taking up 1 fraction */
|
); /* create 3 rows, each taking up 1 fraction */
|
||||||
gap: $unit;
|
gap: $unit;
|
||||||
|
// column-gap: $unit;
|
||||||
|
// row-gap: $unit-2x;
|
||||||
}
|
}
|
||||||
|
|
||||||
.Grid.Weapon {
|
.Grid.Weapon {
|
||||||
|
|
|
||||||
|
|
@ -62,14 +62,21 @@ const GridRep = (props: Props) => {
|
||||||
const newWeapons = Array(numWeapons)
|
const newWeapons = Array(numWeapons)
|
||||||
const gridWeapons = Array(numWeapons)
|
const gridWeapons = Array(numWeapons)
|
||||||
|
|
||||||
|
let foundMainhand = false
|
||||||
for (const [key, value] of Object.entries(props.grid)) {
|
for (const [key, value] of Object.entries(props.grid)) {
|
||||||
if (value.position == -1) setMainhand(value.object)
|
if (value.position == -1) {
|
||||||
else if (!value.mainhand && value.position != null) {
|
setMainhand(value.object)
|
||||||
|
foundMainhand = true
|
||||||
|
} else if (!value.mainhand && value.position != null) {
|
||||||
newWeapons[value.position] = value.object
|
newWeapons[value.position] = value.object
|
||||||
gridWeapons[value.position] = value
|
gridWeapons[value.position] = value
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (!foundMainhand) {
|
||||||
|
setMainhand(undefined)
|
||||||
|
}
|
||||||
|
|
||||||
setWeapons(newWeapons)
|
setWeapons(newWeapons)
|
||||||
setGrid(gridWeapons)
|
setGrid(gridWeapons)
|
||||||
}, [props.grid])
|
}, [props.grid])
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue