granblue.team/hensei-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Make GridRep more consistent

Browse source 
The mainhand is still slightly taller than the 9 grid weapons but this will do for now
This commit is contained in:
Justin Edmund 2022-12-28 23:15:09 -08:00
parent ae456c0ba6
commit 5e8939cddf
1 changed files with 3 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
components/GridRep/index.scss
View file

@ -38,10 +38,6 @@
aspect-ratio: 2/1; aspect-ratio: 2/1;
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 3fr; /* left column takes up 1 fraction, right column takes up 3 fractions */
grid-template-rows: repeat(
3,
1fr
); /* create 3 rows, each taking up 1 fraction */
grid-gap: $unit; /* add a gap of 8px between grid items */ grid-gap: $unit; /* add a gap of 8px between grid items */
.Weapon { .Weapon {
@ -50,6 +46,8 @@
} }
.Mainhand.Weapon { .Mainhand.Weapon {
aspect-ratio: 73/153;
display: grid;
grid-column: 1 / 2; /* spans one column */ grid-column: 1 / 2; /* spans one column */
} }
@ -67,7 +65,7 @@
} }
.Grid.Weapon { .Grid.Weapon {
aspect-ratio: 160 / 92; aspect-ratio: 280 / 160;
display: grid; display: grid;
} }
@ -75,7 +73,6 @@
.Grid.Weapon img[src*='jpg'] { .Grid.Weapon img[src*='jpg'] {
border-radius: 4px; border-radius: 4px;
width: 100%; width: 100%;
height: 100%;
} }
} }