crypto/bemarket
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改武器信息字段的展示

Browse Source
This commit is contained in:
cebgcontract 2022-04-23 21:56:04 +08:00
parent e43be13019
commit 416d556b1d
1 changed files with 35 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
src/components/market/NftInfo.vue
View File

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