better equipment display and fix for safari

This commit is contained in:
Alberto Xamin 2021-01-25 12:57:34 +01:00
parent 50fa4f0ab5
commit 9e5adbc02f
No known key found for this signature in database
GPG Key ID: 4F026F48309500A2
2 changed files with 10 additions and 4 deletions

View File

@ -29,7 +29,9 @@
<tiny-hand :ncards="p.ncards" @click.native="drawFromPlayer(p.name)" :ismyturn="p.pending_action === 2"/>
<span style="position:absolute;top:10pt;" class="center-stuff">{{getActionEmoji(p)}}</span>
<div class="tiny-equipment">
<Card v-for="card in p.equipment" v-bind:key="card.name+card.number" :card="card" @click.native="selectedInfo = p.equipment"/>
<Card v-for="(card, i) in p.equipment" v-bind:key="card.name+card.number"
:card="card" @click.native="selectedInfo = p.equipment"
:style="`margin-top: ${i<1?10:-(Math.min((p.equipment.length+1)*12,80))}pt`"/>
</div>
<div v-if="p.is_bot" style="position:absolute;bottom:57%;" class="center-stuff">
<span>🤖</span>
@ -356,9 +358,6 @@ export default {
transform: scale(0.8);
margin-bottom: -4pt;
}
.tiny-equipment .card:nth-child(n+2) {
margin-top: -60pt;
}
.tiny-equipment .card:hover {
transform: translateY(10px) scale(1.1);
z-index: 1;

View File

@ -423,6 +423,13 @@ export default {
border-radius: 4pt;
min-height: 40pt;
}
@media not all and (min-resolution:.001dpcm)
{ @supports (-webkit-appearance:none) and (stroke-color:transparent) {
.hand {
border-radius: 0;
}
}}
.hand>.card{
margin-left: -30pt;
}