Files
front/components/PlayerStats.vue
T

66 lines
1.4 KiB
Vue

<script setup lang="ts">
import type { Player } from '~/netcode/Player';
export interface Props {
player: Player
}
const props = defineProps<Props>()
</script>
<template>
<div class="turn_icon">
<img src="/images/champion-shield.png" class="icon_img" draggable="false" />
<span class="turn_icon_number">
{{ player.team?.health }}
</span>
</div>
<!-- <div class="turn_icon" v-if="showTurnData">
<img src="/images/gold.png" class="icon_img" draggable="false" />
<span class="turn_icon_number">
{{ player.turn?.gold_reserve }}
</span>
</div>
<div class="turn_icon" v-if="showTurnData">
<img src="/images/damage.png" class="icon_img" draggable="false" />
<span class="turn_icon_number">
{{ player.turn?.damage_reserve }}
</span>
</div> -->
<div class="turn_icon">
<img src="/images/fuck.svg" class="icon_img" draggable="false" />
<span class="turn_icon_number">{{ (player.turn?.discard_markers ?? 0) + (player.turn?.fuck_u_markers ?? 0)
}}</span>
</div>
</template>
<style scoped>
.turn_icon {
position: relative;
display: flex;
justify-content: center;
align-items: center;
}
img.icon_img {
height: 50px;
width: 50px;
}
span.icon_img {
font-size: 50px;
}
.turn_icon_number {
position: absolute;
text-shadow: white 0 0 1px;
}
</style>