Aran Roig
bd1148aeab
All checks were successful
Build and Deploy Nuxt / build (push) Successful in 36s
38 lines
713 B
Vue
38 lines
713 B
Vue
<template>
|
|
<img ref="sprite" v-show="loaded"
|
|
class="sprite pixelated"
|
|
:src="props.path"
|
|
:width="props.width">
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { ref, onMounted } from 'vue';
|
|
|
|
const props = defineProps<{
|
|
path: string,
|
|
top?: string,
|
|
right?: string,
|
|
left?: string,
|
|
bottom?: string,
|
|
width: string
|
|
}>();
|
|
|
|
const sprite = ref(null);
|
|
const loaded = ref(false);
|
|
|
|
onMounted(() => {
|
|
sprite.value.style.top = props.top;
|
|
sprite.value.style.left = props.left;
|
|
sprite.value.style.bottom = props.bottom;
|
|
sprite.value.style.right = props.right;
|
|
|
|
loaded.value = true;
|
|
});
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.sprite {
|
|
position: absolute;
|
|
z-index: 1;
|
|
}
|
|
</style> |