修改武器信息字段的展示

This commit is contained in:
cebgcontract 2022-04-23 21:56:04 +08:00
parent e43be13019
commit 416d556b1d

View File

@ -37,15 +37,13 @@
</div>
</div>
<div class="attr-div" v-if="!nftData.hideAttr && nftData.type === 2">
<div class="one-col-info">
<div class="one-info">
<div class="all-col-info" >
<div class="half-info">
<div class="info-title w50">Level</div>
<div class="info-val">{{nftData.level}}</div>
</div>
</div>
<div class="one-col-info" v-for="(data, index) in nftData.extAttrList" :key="data.key+index">
<div class="one-info">
<div class="info-title w50">{{data.key}}</div>
<div class="half-info" v-for="(data, index) in nftData.extAttrList" :key="data.key+index">
<div class="info-title">{{data.key.replace(/_/g, ' ')}}</div>
<div class="info-val">{{data.value}}</div>
</div>
</div>
@ -157,6 +155,25 @@ export default class extends Vue {
width: 40%;
}
}
.all-col-info {
display: flex;
flex-wrap: wrap;
.half-info{
width: 50%;
display: flex;
flex-direction: row;
justify-content: space-between;
.info-title{
width: 60%;
text-transform: capitalize;
}
.info-val{
width: 40%;
margin-left: 10px;
color: #3CF562;
}
}
}
}
}
@media (max-width: 767px) {
@ -199,6 +216,18 @@ export default class extends Vue {
display: flex;
}
}
.all-col-info {
.half-info{
width: 100%;
margin-bottom: 8px;
.info-title{
width: 60%;
}
.info-val{
width: 40%;
}
}
}
.coming{
color: #6B6E91;
text-align: center;