sigonasr2/ngsplanner
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

item details window changes

Browse Source
This commit is contained in:
dudleycu 2021-08-31 01:12:26 +00:00
parent 4945bc99fc
commit b86c378fba
2 changed files with 32 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/TestPanel.js
View File

@ -518,12 +518,15 @@ ELEMENT<br />
EQUIP CONDITIONS<br />
NOT TRADABLE
</div>
<div className="itemPotential">POTENTIAL</div><div className="itemPreset">PRESET</div>
<div className="itemAbility"><div className="itemPotential"><span className="pot">Soulspring Unit Lv.3</span></div><div className="itemFixa"><span className="fixa">Fixa Attack Lv.3</span></div></div>
<div className="itemDetailsAugment">
AUGMENT
<span className="aug">Augment</span>
<div className="itemDetailsAugmentWrapper">
<div>test</div>
<div>test</div>
<div>test</div>
<div>test</div>
</div>
</div>
</div>

29
src/style.css
View File

@ -1494,7 +1494,7 @@ p.adminNav hr {
display: grid;
grid-template-areas:
"icon properties"
"potential preset"
"ability ability"
"augment augment";
grid-template-columns: 128px minmax(0,1fr);
grid-template-rows: auto;
@ -1506,16 +1506,35 @@ p.adminNav hr {
grid-area: icon;
}
.itemDetailsProperties {
margin: 0 0 0 10px;
grid-area: properties;
}
.itemDetailsAugment {
margin: 15px 0 0 0;
grid-area: augment;
}
.itemPotential {
grid-area: potential;
.itemDetailsAugmentWrapper {
margin: 10px 0 0 0;
display: grid;
grid-template-columns: repeat(auto-fit,minmax(150px,200px));
gap: 10px 30px;
}
.itemPreset {
grid-area: preset;
.itemDetailsAugmentWrapper > div {
background-color:rgba(0,0,0,0.33);
padding: 2px 10px;
border-radius: 0 10px 0 0;
}
.itemAbility {
grid-area: ability;
display: grid;
grid-template-columns: minmax(0,1fr) minmax(0,1fr);
margin: 20px 0 0 0;
}
.itemPotential {
text-align: left;
}
.itemFixa {
text-align: left;
}
.itemDetailsIcon img {
background: radial-gradient(rgb(196,196,196),rgb(128,128,128));