39 lines
908 B
Vue
39 lines
908 B
Vue
<template>
|
|
<div class="rewards-wrapper">
|
|
<div class="rewards-headline low-mid-text">
|
|
{{ props.title }}
|
|
</div>
|
|
<div class="rewards-inner">
|
|
<token-name-price name="$BLOOD" :price="props.amount"></token-name-price>
|
|
<token-logo :img="props.image" :alt="'vampire'"></token-logo>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import TokenNamePrice from "@/components/TokenNamePrice.vue";
|
|
import TokenLogo from "@/components/TokenLogo.vue";
|
|
|
|
const props = defineProps({
|
|
title: String,
|
|
info: String,
|
|
amount: [String, Number],
|
|
image: String,
|
|
});
|
|
</script>
|
|
|
|
<style lang="sass">
|
|
.rewards-wrapper
|
|
display: flex
|
|
flex-direction: column
|
|
gap: 8px
|
|
padding: 6px 0
|
|
.rewards-inner
|
|
display: flex
|
|
padding: 0 6px 6px 6px
|
|
border-bottom: 1px solid var(--grey, #858585)
|
|
justify-content: space-between
|
|
height: 56px
|
|
box-sizing: content-box
|
|
</style>
|