38 lines
647 B
Vue
38 lines
647 B
Vue
<script setup lang="ts">
|
|
import type { Effect } from "~/netcode/interfaces";
|
|
|
|
type Props = {
|
|
token: Effect;
|
|
};
|
|
const props = defineProps<Props>();
|
|
|
|
const emit = defineEmits(["useToken"]);
|
|
|
|
function onClick(e: MouseEvent) {
|
|
emit("useToken", props.token);
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div @click.stop="onClick" @mousedown.left.stop="" id="token">
|
|
{{ props.token.effect }}
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
#token {
|
|
width: 50px;
|
|
height: 50px;
|
|
background: white;
|
|
border: 1px solid white;
|
|
cursor: pointer;
|
|
box-sizing: border-box;
|
|
transition: 0.2s all;
|
|
border-radius: 15px;
|
|
}
|
|
|
|
#token:hover {
|
|
border: 1px solid red;
|
|
}
|
|
</style>
|