cindylouwho/ImmortalClanVue
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update m issues + e frontend improvements

Browse Source
This commit is contained in:
EmberSpirit
2023-10-23 21:35:38 +02:00
parent 44df04cc23
commit 6e58bc6319
24 changed files with 305 additions and 312 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/assets/img/tokenomics_footer.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 722 KiB

After

Width:  |  Height:  |  Size: 68 KiB

src/App.vue
+16 -3
View File
@@ -105,7 +105,7 @@ onMounted(async () => {
<div class="footer"> <div class="footer">
<div class="footer-inner"> <div class="footer-inner">
<div class="footer-headline">Join Bloodline</div> <div class="footer-headline" v-if="!isMobile">Join Bloodline</div>
<div class="footer-social-links"> <div class="footer-social-links">
<div class="social-bloodline-badge"> <div class="social-bloodline-badge">
@@ -123,6 +123,11 @@ onMounted(async () => {
<font-awesome-icon icon="fa-brands fa-twitter" /> <font-awesome-icon icon="fa-brands fa-twitter" />
</div> </div>
</div> </div>
<div class="social-bloodline-badge">
<div class="social-bloodline-badge-icon">
<font-awesome-icon icon="fa-solid fa-blog" />
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
@@ -149,22 +154,30 @@ onMounted(async () => {
.footer .footer
height: auto height: auto
background-color: var(--midnight-black) background-color: #2D2D2D
padding-bottom: 72px
@media (min-width: 992px) @media (min-width: 992px)
background-color: var(--midnight-black)
height: 150px height: 150px
min-height: 150px min-height: 150px
display: flex display: flex
flex-direction: column flex-direction: column
justify-content: center justify-content: center
padding-bottom: unset
margin-top: auto
.footer-inner .footer-inner
padding: 16px 0 24px 0 padding: 24px 0
font-size: 24px font-size: 24px
display: flex display: flex
flex-direction: column flex-direction: column
gap: 16px gap: 16px
align-items: center align-items: center
border-top: 1px solid #000
@media (min-width: 992px) @media (min-width: 992px)
padding: 16px 0 24px 0
justify-content: center justify-content: center
border-top: unset
background-color: transparent
.footer-headline .footer-headline
font-size: 16px font-size: 16px
.footer-social-links .footer-social-links
src/assets/contracts/Bloodline.json
+1 -1
View File
@@ -1,6 +1,6 @@
{ {
"contractName": "Bloodline", "contractName": "Bloodline",
"contractAddress": "0xfB97A4a863d75F72E6d3DCef4a47413E811c9D2E", "contractAddress": "0x51bF3df58D123e8EA43fb2189f18027FD36a08Af",
"abi": [ "abi": [
{ {
"inputs": [ "inputs": [
src/assets/contracts/LiquidityOwner.json
+1 -97
View File
@@ -1,6 +1,6 @@
{ {
"contractName": "LiquidityOwner", "contractName": "LiquidityOwner",
"contractAddress": "0x0f18b2D23278E1f1d92cc2cE10a75604bDBE9Ad1", "contractAddress": "0xF8bc4Ce13263DD4e12070e3192be50310eF7C95a",
"abi": [ "abi": [
{ {
"inputs": [ "inputs": [
@@ -132,35 +132,6 @@
"stateMutability": "pure", "stateMutability": "pure",
"type": "function" "type": "function"
}, },
{
"inputs": [
{
"internalType": "int24",
"name": "tick",
"type": "int24"
},
{
"internalType": "int24",
"name": "tickLower",
"type": "int24"
},
{
"internalType": "int24",
"name": "tickUpper",
"type": "int24"
}
],
"name": "_liquidityCanBeProvided",
"outputs": [
{
"internalType": "bool",
"name": "",
"type": "bool"
}
],
"stateMutability": "view",
"type": "function"
},
{ {
"inputs": [ "inputs": [
{ {
@@ -198,54 +169,6 @@
"stateMutability": "view", "stateMutability": "view",
"type": "function" "type": "function"
}, },
{
"inputs": [
{
"internalType": "int24",
"name": "tickCycle",
"type": "int24"
}
],
"name": "calculateTicksForRange1",
"outputs": [
{
"internalType": "int24",
"name": "tickLower",
"type": "int24"
},
{
"internalType": "int24",
"name": "tickUpper",
"type": "int24"
}
],
"stateMutability": "pure",
"type": "function"
},
{
"inputs": [
{
"internalType": "int24",
"name": "tickCycle",
"type": "int24"
}
],
"name": "calculateTicksForRange2",
"outputs": [
{
"internalType": "int24",
"name": "tickLower",
"type": "int24"
},
{
"internalType": "int24",
"name": "tickUpper",
"type": "int24"
}
],
"stateMutability": "pure",
"type": "function"
},
{ {
"inputs": [ "inputs": [
{ {
@@ -288,25 +211,6 @@
"stateMutability": "view", "stateMutability": "view",
"type": "function" "type": "function"
}, },
{
"inputs": [
{
"internalType": "uint256",
"name": "",
"type": "uint256"
}
],
"name": "cycleTicks",
"outputs": [
{
"internalType": "int24",
"name": "",
"type": "int24"
}
],
"stateMutability": "view",
"type": "function"
},
{ {
"inputs": [], "inputs": [],
"name": "memeAltar", "name": "memeAltar",
src/assets/contracts/MemeAltar.json
+102 -42
View File
@@ -1,6 +1,6 @@
{ {
"contractName": "MemeAltar", "contractName": "MemeAltar",
"contractAddress": "0x5368264F18DD0e09ea074a79F3F8B504e2363d84", "contractAddress": "0xE4F42F3f8B0E57b1054D457fe3b49a1A10B1aCEa",
"abi": [ "abi": [
{ {
"inputs": [ "inputs": [
@@ -53,11 +53,6 @@
"name": "CycleCompletedRegistrationFailed", "name": "CycleCompletedRegistrationFailed",
"type": "error" "type": "error"
}, },
{
"inputs": [],
"name": "GoalCannotBeZero",
"type": "error"
},
{ {
"inputs": [], "inputs": [],
"name": "InsufficientOutputAmount", "name": "InsufficientOutputAmount",
@@ -220,16 +215,42 @@
"anonymous": false, "anonymous": false,
"inputs": [ "inputs": [
{ {
"indexed": true, "components": [
"internalType": "uint64", {
"name": "b", "internalType": "uint40",
"type": "uint64" "name": "b1",
"type": "uint40"
}, },
{ {
"indexed": true, "internalType": "uint40",
"internalType": "uint64", "name": "m1",
"name": "m", "type": "uint40"
"type": "uint64" },
{
"internalType": "uint40",
"name": "b2",
"type": "uint40"
},
{
"internalType": "uint40",
"name": "m2",
"type": "uint40"
},
{
"internalType": "uint40",
"name": "b3",
"type": "uint40"
},
{
"internalType": "uint40",
"name": "m4",
"type": "uint40"
}
],
"indexed": false,
"internalType": "struct MemeAltar.BM",
"name": "_bm",
"type": "tuple"
} }
], ],
"name": "NewBM", "name": "NewBM",
@@ -288,14 +309,41 @@
{ {
"inputs": [ "inputs": [
{ {
"internalType": "uint64", "components": [
"name": "newB", {
"type": "uint64" "internalType": "uint40",
"name": "b1",
"type": "uint40"
}, },
{ {
"internalType": "uint64", "internalType": "uint40",
"name": "newM", "name": "m1",
"type": "uint64" "type": "uint40"
},
{
"internalType": "uint40",
"name": "b2",
"type": "uint40"
},
{
"internalType": "uint40",
"name": "m2",
"type": "uint40"
},
{
"internalType": "uint40",
"name": "b3",
"type": "uint40"
},
{
"internalType": "uint40",
"name": "m4",
"type": "uint40"
}
],
"internalType": "struct MemeAltar.BM",
"name": "newBM",
"type": "tuple"
} }
], ],
"name": "adjustBM", "name": "adjustBM",
@@ -362,12 +410,12 @@
}, },
{ {
"inputs": [], "inputs": [],
"name": "b", "name": "bloodline",
"outputs": [ "outputs": [
{ {
"internalType": "uint64", "internalType": "contract Bloodline",
"name": "", "name": "",
"type": "uint64" "type": "address"
} }
], ],
"stateMutability": "view", "stateMutability": "view",
@@ -375,12 +423,37 @@
}, },
{ {
"inputs": [], "inputs": [],
"name": "bloodline", "name": "bm",
"outputs": [ "outputs": [
{ {
"internalType": "contract Bloodline", "internalType": "uint40",
"name": "", "name": "b1",
"type": "address" "type": "uint40"
},
{
"internalType": "uint40",
"name": "m1",
"type": "uint40"
},
{
"internalType": "uint40",
"name": "b2",
"type": "uint40"
},
{
"internalType": "uint40",
"name": "m2",
"type": "uint40"
},
{
"internalType": "uint40",
"name": "b3",
"type": "uint40"
},
{
"internalType": "uint40",
"name": "m4",
"type": "uint40"
} }
], ],
"stateMutability": "view", "stateMutability": "view",
@@ -589,9 +662,9 @@
"name": "issuancePrice", "name": "issuancePrice",
"outputs": [ "outputs": [
{ {
"internalType": "uint128", "internalType": "uint256",
"name": "", "name": "",
"type": "uint128" "type": "uint256"
} }
], ],
"stateMutability": "view", "stateMutability": "view",
@@ -610,19 +683,6 @@
"stateMutability": "view", "stateMutability": "view",
"type": "function" "type": "function"
}, },
{
"inputs": [],
"name": "m",
"outputs": [
{
"internalType": "uint64",
"name": "",
"type": "uint64"
}
],
"stateMutability": "view",
"type": "function"
},
{ {
"inputs": [ "inputs": [
{ {
src/assets/contracts/RewardLocker.json
+1 -1
View File
@@ -1,6 +1,6 @@
{ {
"contractName": "RewardLocker", "contractName": "RewardLocker",
"contractAddress": "0x3342B37A0c06FEf2c3dD9481e31CCCF970e7235B", "contractAddress": "0x2952253374973DE0ffbFe35269Ca13FaF28B935F",
"abi": [ "abi": [
{ {
"inputs": [ "inputs": [
src/assets/contracts/UniswapPool.json
+1 -1
View File
File diff suppressed because one or more lines are too long
src/assets/sass/main.sass
-2
View File
@@ -34,8 +34,6 @@ body
display: flex display: flex
flex-direction: column flex-direction: column
height: 100vh height: 100vh
.footer
margin-top: auto
.container .container
margin-right: auto margin-right: auto
src/components/BloodChart.vue
+2 -2
View File
@@ -73,7 +73,7 @@
</div> </div>
<div class="blood-chart-element-footer"> <div class="blood-chart-element-footer">
<div class="blood-chart-amount"> <div class="blood-chart-amount">
{{ formatBigIntDivision(coin.amountInBLD, 10n ** tokenStore.memeToken.decimals) }} {{ formatNumber(coin.amountInBLD, 10n ** tokenStore.memeToken.decimals) }}
</div> </div>
<div>$BLOOD</div> <div>$BLOOD</div>
</div> </div>
@@ -96,7 +96,7 @@
<script setup> <script setup>
import { computed, ref, inject, onMounted } from "vue"; import { computed, ref, inject, onMounted } from "vue";
import { getPercentage, formatBigIntDivision } from "@/helper/helper.js"; import { getPercentage, formatNumber } from "@/helper/helper.js";
import { useCycleStore } from "@/stores/cycles"; import { useCycleStore } from "@/stores/cycles";
import { useMemeburnerStore } from "@/stores/memeburner"; import { useMemeburnerStore } from "@/stores/memeburner";
src/components/ClaimComponent.vue
+25 -19
View File
@@ -4,12 +4,12 @@
<template v-slot:body> <template v-slot:body>
<token-name-price <token-name-price
:name="tokenStore.getToken(walletStore.memeToken?.contractAddress)?.name" :name="tokenStore.getToken(walletStore.memeToken?.contractAddress)?.name"
:price="formatBigIntDivision(walletStore.unclaimedRewards, 10n ** tokenStore.memeToken.decimals)" :price="formatNumber(walletStore.unclaimedRewards, 10n ** tokenStore.memeToken.decimals)"
></token-name-price> ></token-name-price>
<token-logo img="/assets/img/token/bloodline.png" :alt="'bloodline logo'"></token-logo> <token-logo img="/assets/img/token/bloodline.png" :alt="'bloodline logo'"></token-logo>
</template> </template>
<template v-slot:actions> <template v-slot:actions>
<template v-if="walletStore.unclaimedRewards > 0"> <template v-if="walletStore.unclaimedRewards > 0n">
<Transition name="smooth"> <Transition name="smooth">
<div class="connected-stake-buttons" v-show="!stakeMenu"> <div class="connected-stake-buttons" v-show="!stakeMenu">
<div class="btn btn-immortal mid-mid-text" @click="claimAll" v-if="stateStake === 0">Claim</div> <div class="btn btn-immortal mid-mid-text" @click="claimAll" v-if="stateStake === 0">Claim</div>
@@ -19,21 +19,32 @@
<div class="btn btn-immortal stake-button" disabled v-else-if="stateStake === 3"> <div class="btn btn-immortal stake-button" disabled v-else-if="stateStake === 3">
<loading-component></loading-component> <loading-component></loading-component>
</div> </div>
<div class="btn btn-immortal mid-mid-text" @click="openStake">Stake</div> <div class="btn btn-immortal mid-mid-text" @click="openStake" v-if="stateStake === 0">
Stake
</div>
</div> </div>
</Transition> </Transition>
<Transition name="smooth"> <Transition name="smooth">
<stake-menu <stake-menu
v-model="tokenNumber" v-model="tokenNumber"
@close="stakeMenu = false" @close="stakeMenu = false"
:amount=" :amount="walletStore.unclaimedRewards"
formatBigIntDivision(walletStore.unclaimedRewards, 10n ** tokenStore.memeToken.decimals)
"
:stake="stake" :stake="stake"
v-if="stakeMenu" v-if="stakeMenu"
> >
<template v-slot:body> <template v-slot:body>
<div class="btn btn-immortal stake-button" disabled v-if="stateClaimComp === 0"> <div
class="btn btn-immortal stake-button"
disabled
v-if="
tokenNumber > 0 &&
BigInt(tokenNumber) * 10n ** tokenStore.memeToken.decimals >
walletStore.unclaimedRewards
"
>
Insufficient Balance
</div>
<div class="btn btn-immortal stake-button" disabled v-else-if="stateClaimComp === 0">
Enter Amount Enter Amount
</div> </div>
<div <div
@@ -43,10 +54,10 @@
> >
Stake & Claim Rest Stake & Claim Rest
</div> </div>
<div class="btn btn-immortal stake-button" disabled v-if="stateClaimComp === 2"> <div class="btn btn-immortal stake-button" disabled v-else-if="stateClaimComp === 2">
Sign Transaction Sign Transaction
</div> </div>
<div class="btn btn-immortal stake-button" disabled v-if="stateClaimComp === 3"> <div class="btn btn-immortal stake-button" disabled v-else-if="stateClaimComp === 3">
<loading-component></loading-component> <loading-component></loading-component>
</div> </div>
<div <div
@@ -59,12 +70,7 @@
<template v-slot:message-end> <template v-slot:message-end>
<div class="input-balance"> <div class="input-balance">
Balance: Balance:
{{ {{ formatNumber(walletStore.unclaimedRewards, 10n ** tokenStore.memeToken.decimals) }}
formatBigIntDivision(
walletStore.unclaimedRewards,
10n ** tokenStore.memeToken.decimals
)
}}
</div> </div>
</template> </template>
</stake-menu> </stake-menu>
@@ -73,7 +79,7 @@
<template v-else-if="cycleStore.rewardsSacrificeCurrentCycle > 0n"> <template v-else-if="cycleStore.rewardsSacrificeCurrentCycle > 0n">
<div class="connected-stake-buttons"> <div class="connected-stake-buttons">
<div class="btn btn-immortal mid-mid-text btn--disabled">Claim</div> <div class="btn btn-immortal mid-mid-text btn--disabled">Claim</div>
<div class="btn btn-immortal mid-mid-text btn--disabled">stake</div> <div class="btn btn-immortal mid-mid-text btn--disabled">Stake</div>
</div> </div>
<div class="text-center">You can claim, once the cycle is over</div> <div class="text-center">You can claim, once the cycle is over</div>
</template> </template>
@@ -103,7 +109,7 @@ import { useTokenStore } from "@/stores/tokens";
import { useRewardLockerStore } from "@/stores/rewardlocker"; import { useRewardLockerStore } from "@/stores/rewardlocker";
import { useRouter } from "vue-router"; import { useRouter } from "vue-router";
import { useToast } from "vue-toastification"; import { useToast } from "vue-toastification";
import { formatBigIntDivision } from "@/helper/helper.js"; import { formatNumber } from "@/helper/helper.js";
import { showSuccessToast } from "@/helper/toast.js"; import { showSuccessToast } from "@/helper/toast.js";
const toast = useToast(); const toast = useToast();
@@ -158,7 +164,7 @@ async function stakeAndClaimAllCycles() {
// //
console.log("rewardData", rewardData); console.log("rewardData", rewardData);
//ClaimedReward (address staker, uint256 reward) //ClaimedReward (address staker, uint256 reward)
const outputClaim = formatBigIntDivision(BigInt(rewardData.topics[2]), 10n ** tokenStore.memeToken.decimals); const outputClaim = formatNumber(BigInt(rewardData.topics[2]), 10n ** tokenStore.memeToken.decimals);
showSuccessToast( showSuccessToast(
outputClaim, outputClaim,
"Success!", "Success!",
@@ -189,7 +195,7 @@ async function claimAll() {
// //
console.log("rewardData", rewardData); console.log("rewardData", rewardData);
//ClaimedReward (address staker, uint256 reward) //ClaimedReward (address staker, uint256 reward)
const outputClaim = formatBigIntDivision(BigInt(rewardData.topics[2]), 10n ** tokenStore.memeToken.decimals); const outputClaim = formatNumber(BigInt(rewardData.topics[2]), 10n ** tokenStore.memeToken.decimals);
showSuccessToast( showSuccessToast(
outputClaim, outputClaim,
"Success!", "Success!",
src/components/ConnectWallet.vue
+8 -17
View File
@@ -11,22 +11,19 @@
> >
<div class="connector-icon"> <div class="connector-icon">
<template v-if="connector.id === 'injected'"> <template v-if="connector.id === 'injected'">
<template v-if="connector.name === 'MetaMask'">
<img :src="`/assets/img/connectors/metaMask.svg`" :alt="`${connector.name} Logo`" />
</template>
<template v-else>
<font-awesome-icon :icon="['fas', 'wallet']" /> <font-awesome-icon :icon="['fas', 'wallet']" />
</template> </template>
</template>
<template v-else> <template v-else>
<img :src="`/assets/img/connectors/${connector.id}.svg`" :alt="`${connector.name} Logo`" /> <img :src="`/assets/img/connectors/${connector.id}.svg`" :alt="`${connector.name} Logo`" />
</template> </template>
</div> </div>
<div class="connector-name"> <div class="connector-name">
<template
v-if="
connector.id !== 'metaMask' ||
(connector.id === 'metaMask' && isMetaMaskInstalled(connector))
"
>
{{ connector.name }} {{ connector.name }}
</template>
<template v-else> Install {{ connector.name }} </template>
</div> </div>
</div> </div>
</div> </div>
@@ -52,10 +49,7 @@
<token-name-price <token-name-price
:name="tokenStore.getToken(token.contractAddress).name" :name="tokenStore.getToken(token.contractAddress).name"
:price=" :price="
formatBigIntDivision( formatNumber(token.balanceOf, 10n ** tokenStore.getToken(token.contractAddress).decimals)
token.balanceOf,
10n ** tokenStore.getToken(token.contractAddress).decimals
)
" "
></token-name-price> ></token-name-price>
<div class="connected-token-button"> <div class="connected-token-button">
@@ -85,7 +79,7 @@ import TokenNamePrice from "./TokenNamePrice.vue";
import TokenLogo from "./TokenLogo.vue"; import TokenLogo from "./TokenLogo.vue";
import StakeComponentV1 from "@/components/StakeComponentV1.vue"; import StakeComponentV1 from "@/components/StakeComponentV1.vue";
import { getAddressShortName, getblocky, formatBigIntDivision } from "@/helper/helper.js"; import { getAddressShortName, getblocky, formatNumber } from "@/helper/helper.js";
import { useRoute, useRouter } from "vue-router"; import { useRoute, useRouter } from "vue-router";
import { disconnect } from "@wagmi/core"; import { disconnect } from "@wagmi/core";
@@ -136,10 +130,7 @@ function badgeClick(token) {
//special case for metaMask, but I think that is the most used wallet //special case for metaMask, but I think that is the most used wallet
async function connectWallet(connector) { async function connectWallet(connector) {
if (connector.id === "metaMask" && !isMetaMaskInstalled(connector)) { console.log("connector", connector);
window.open(" https://metamask.io/", "_blank");
return;
}
instance.parent.emit("update:modelValue", false); instance.parent.emit("update:modelValue", false);
await walletStore.connectWallet(toRaw(connector)); await walletStore.connectWallet(toRaw(connector));
} }
src/components/RewardsWrapper.vue
+3 -1
View File
@@ -1,7 +1,8 @@
<template> <template>
<div class="rewards-wrapper"> <div class="rewards-wrapper">
<div class="rewards-headline low-mid-text"> <div class="rewards-headline low-mid-text">
{{ props.title }} <div class="rewards-title">{{ props.title }}</div>
<div class="rewards-sub-title" v-if="props.subTitle">{{ props.subTitle }}</div>
</div> </div>
<div class="rewards-inner"> <div class="rewards-inner">
<token-name-price name="$BLOOD" :price="props.amount"></token-name-price> <token-name-price name="$BLOOD" :price="props.amount"></token-name-price>
@@ -16,6 +17,7 @@ import TokenLogo from "@/components/TokenLogo.vue";
const props = defineProps({ const props = defineProps({
title: String, title: String,
subTitle: String,
info: String, info: String,
amount: [String, Number], amount: [String, Number],
image: String, image: String,
src/components/SacrificeToken.vue
+4 -4
View File
@@ -59,7 +59,7 @@
<template v-slot:message-end v-if="activeWalletToken?.balanceOf >= 0"> <template v-slot:message-end v-if="activeWalletToken?.balanceOf >= 0">
<div class="input-balance tiny-text"> <div class="input-balance tiny-text">
Balance: Balance:
{{ formatBigIntDivision(activeWalletToken?.balanceOf, 10n ** activeToken.decimals) }} {{ formatNumber(activeWalletToken?.balanceOf, 10n ** activeToken.decimals) }}
</div> </div>
<div class="input-max tiny-text" @click="addMaxTokens">Max</div> <div class="input-max tiny-text" @click="addMaxTokens">Max</div>
</template> </template>
@@ -79,7 +79,7 @@
<div class="sacrifice-to-body"> <div class="sacrifice-to-body">
<token-name-price <token-name-price
name="$BLOOD" name="$BLOOD"
:price="`≈${formatBigIntDivision(output, 10n ** activeToken.decimals)}`" :price="`≈${formatNumber(output, 10n ** activeToken.decimals)}`"
></token-name-price> ></token-name-price>
<token-logo :img="activeToken.vamp.logo" :size="64" :alt="activeToken.vamp.name"></token-logo> <token-logo :img="activeToken.vamp.logo" :size="64" :alt="activeToken.vamp.name"></token-logo>
</div> </div>
@@ -101,7 +101,7 @@
No Staking Bonus No Staking Bonus
</div> </div>
<div class="mid-mid-text" v-else> <div class="mid-mid-text" v-else>
+ {{ formatBigIntDivision(stakingOutput, 10n ** activeToken.decimals) }} Staking Bonus + {{ formatNumber(stakingOutput, 10n ** activeToken.decimals) }} Staking Bonus
</div> </div>
<div class="icon"> <div class="icon">
<font-awesome-icon icon="chevron-down" /> <font-awesome-icon icon="chevron-down" />
@@ -186,7 +186,7 @@ const cycleStore = useCycleStore();
const sacrificeStore = useSacrificeStore(); const sacrificeStore = useSacrificeStore();
const toast = useToast(); const toast = useToast();
import { debounce, formatBigIntDivision } from "@/helper/helper.js"; import { debounce, formatNumber } from "@/helper/helper.js";
const isMobile = inject("isMobile"); const isMobile = inject("isMobile");
const showPanel = inject("showPanel"); const showPanel = inject("showPanel");
src/components/StakeComponentV1.vue
+10 -10
View File
@@ -32,7 +32,7 @@
<slot name="body"> <slot name="body">
<token-name-price <token-name-price
name="$BLOOD staked" name="$BLOOD staked"
:price="formatBigIntDivision(walletStore.staked, 10n ** tokenStore.memeToken.decimals)" :price="formatNumber(walletStore.staked, 10n ** tokenStore.memeToken.decimals)"
></token-name-price> ></token-name-price>
<token-logo img="/assets/img/token/bloodline.png" :alt="'bloodline-token'"></token-logo> <token-logo img="/assets/img/token/bloodline.png" :alt="'bloodline-token'"></token-logo>
<token-name-price :variant="true" class="stake-reward" name="Bonus" price="+25%"></token-name-price> <token-name-price :variant="true" class="stake-reward" name="Bonus" price="+25%"></token-name-price>
@@ -55,13 +55,13 @@
Stake Stake
</div> </div>
<div <div
v-if="(walletStore.memeToken?.staked === 0 && !stakeonly) || cycleStore.currentCycle === 1" v-if="(walletStore.memeToken?.staked === 0n && !stakeonly) || cycleStore.currentCycle === 1"
class="btn btn-immortal btn--disabled mid-mid-text" class="btn btn-immortal btn--disabled mid-mid-text"
> >
Unstake Unstake
</div> </div>
<div v-else-if="!stakeonly" class="btn btn-immortal mid-mid-text" @click="openUnstake"> <div v-else-if="!stakeonly" class="btn btn-immortal mid-mid-text" @click="openUnstake">
Unstake Order Unstake
</div> </div>
</template> </template>
<template v-else-if="walletStore.connected && ableToUnstake"> <template v-else-if="walletStore.connected && ableToUnstake">
@@ -111,7 +111,7 @@
<template v-slot:message-end> <template v-slot:message-end>
<div class="input-balance"> <div class="input-balance">
Balance: Balance:
{{ formatBigIntDivision(walletStore.balanceOf, 10n ** tokenStore.memeToken.decimals) }} {{ formatNumber(walletStore.balanceOf, 10n ** tokenStore.memeToken.decimals) }}
</div> </div>
</template> </template>
</stake-menu> </stake-menu>
@@ -139,7 +139,7 @@
</div> </div>
</div> </div>
</Transition> </Transition>
<div class="connected-stake-first-round small-text text-center" v-if="cycleStore.currentCycle === 0"> <div class="connected-stake-first-round small-text text-center" v-if="cycleStore.currentCycle === 1">
No $BLOOD on the market. Staking is activated after the first cycle is finished. No $BLOOD on the market. Staking is activated after the first cycle is finished.
</div> </div>
<div <div
@@ -147,7 +147,7 @@
v-if="walletStore.orderedUnstakedAmount > 0n && !ableToUnstake" v-if="walletStore.orderedUnstakedAmount > 0n && !ableToUnstake"
> >
You can claim You can claim
{{ formatBigIntDivision(walletStore.orderedUnstakedAmount, 10n ** tokenStore.memeToken.decimals) }} {{ formatNumber(walletStore.orderedUnstakedAmount, 10n ** tokenStore.memeToken.decimals) }}
$BLOOD next cycle. $BLOOD next cycle.
</div> </div>
</slot> </slot>
@@ -170,7 +170,7 @@ import { useRewardLockerStore } from "@/stores/rewardlocker";
import { useWalletStoreV2 } from "@/stores/walletV2"; import { useWalletStoreV2 } from "@/stores/walletV2";
import { useTokenStore } from "@/stores/tokens"; import { useTokenStore } from "@/stores/tokens";
import { useToast } from "vue-toastification"; import { useToast } from "vue-toastification";
import { formatBigIntDivision } from "@/helper/helper.js"; import { formatNumber } from "@/helper/helper.js";
const toast = useToast(); const toast = useToast();
const walletStore = useWalletStoreV2(); const walletStore = useWalletStoreV2();
@@ -239,7 +239,7 @@ async function unstake() {
}); });
console.log("rewardData", rewardData); console.log("rewardData", rewardData);
const outputClaim = formatBigIntDivision(BigInt(rewardData.topics[3]), 10n ** tokenStore.memeToken.decimals); const outputClaim = formatNumber(BigInt(rewardData.topics[3]), 10n ** tokenStore.memeToken.decimals);
showSuccessToast(outputClaim, "Success!", "You just unstaked"); showSuccessToast(outputClaim, "Success!", "You just unstaked");
await walletStore.loadWalletData(); await walletStore.loadWalletData();
} catch (error) { } catch (error) {
@@ -265,7 +265,7 @@ async function orderUnstake() {
}); });
console.log("rewardData", rewardData); console.log("rewardData", rewardData);
const outputClaim = formatBigIntDivision(BigInt(rewardData.topics[3]), 10n ** tokenStore.memeToken.decimals); const outputClaim = formatNumber(BigInt(rewardData.topics[3]), 10n ** tokenStore.memeToken.decimals);
showSuccessToast(outputClaim, "Success!", "You just unstaked", "You can claim your stake next cycle."); showSuccessToast(outputClaim, "Success!", "You just unstaked", "You can claim your stake next cycle.");
stakeMenu.value = false; stakeMenu.value = false;
} catch (error) { } catch (error) {
@@ -293,7 +293,7 @@ async function stakeToken() {
// //
console.log("rewardData", rewardData); console.log("rewardData", rewardData);
const outputClaim = formatBigIntDivision(BigInt(rewardData.topics[3]), 10n ** tokenStore.memeToken.decimals); const outputClaim = formatNumber(BigInt(rewardData.topics[3]), 10n ** tokenStore.memeToken.decimals);
console.log("data", data); console.log("data", data);
state.value = 0; state.value = 0;
showSuccessToast( showSuccessToast(
src/components/StakeMenu.vue
+1 -1
View File
@@ -36,7 +36,7 @@ import { useWalletStoreV2 } from "@/stores/walletV2";
import { useRewardLockerStore } from "@/stores/rewardlocker"; import { useRewardLockerStore } from "@/stores/rewardlocker";
import { useTokenStore } from "@/stores/tokens"; import { useTokenStore } from "@/stores/tokens";
import { createPermitObject, getSignatureRSV } from "@/helper/blockchain.js"; import { createPermitObject, getSignatureRSV } from "@/helper/blockchain.js";
import { formatBigIntDivision } from "@/helper/helper.js"; import { formatNumber } from "@/helper/helper.js";
import { signTypedData } from "@wagmi/core"; import { signTypedData } from "@wagmi/core";
src/components/TokenClaim.vue
+23 -10
View File
@@ -23,19 +23,20 @@
<rewards-wrapper <rewards-wrapper
title="Sacrafice Reward" title="Sacrafice Reward"
coin="$BLOOD" coin="$BLOOD"
:amount="formatBigIntDivision(rewardsSacrifice, 10n ** tokenStore.memeToken.decimals)" :amount="formatNumber(rewardsSacrifice, 10n ** tokenStore.memeToken.decimals)"
image="/assets/img/vampir.png" image="/assets/img/vampir.png"
/> />
<rewards-wrapper <rewards-wrapper
title="Staking Bonus" title="Staking Bonus"
coin="$BLOOD" coin="$BLOOD"
:amount="formatBigIntDivision(rewardsStaking, 10n ** tokenStore.memeToken.decimals)" :amount="formatNumber(rewardsStaking, 10n ** tokenStore.memeToken.decimals)"
image="/assets/img/vampir.png" image="/assets/img/vampir.png"
/> />
<rewards-wrapper <rewards-wrapper
title="Clan Bonus" title="Clan Bonus"
:subTitle="rewardsClan > 0 ? clanBonusPercentage : null"
coin="$BLOOD" coin="$BLOOD"
:amount="formatBigIntDivision(rewardsClan, 10n ** tokenStore.memeToken.decimals)" :amount="formatNumber(rewardsClan, 10n ** tokenStore.memeToken.decimals)"
:image=" :image="
activeCycle === currentCycle || !cycleStore.getCurrentCycleData?.winner.vamplogo activeCycle === currentCycle || !cycleStore.getCurrentCycleData?.winner.vamplogo
? '/assets/img/token/notoken.png' ? '/assets/img/token/notoken.png'
@@ -47,13 +48,13 @@
<div class="rewards-total-headline sub-header">Total Reward</div> <div class="rewards-total-headline sub-header">Total Reward</div>
<div <div
class="rewards-total-inner bloodline-border bloodline-border--variant1" class="rewards-total-inner bloodline-border bloodline-border--variant1"
:class="{ purple: rewardsTotal > 0 && activeCycle !== currentCycle }" :class="{ purple: rewardsTotal > 0n && activeCycle !== currentCycle }"
> >
<token-name-price <token-name-price
name="$BLOOD" name="$BLOOD"
:price="formatBigIntDivision(rewardsTotal, 10n ** tokenStore.memeToken.decimals)" :price="formatNumber(rewardsTotal, 10n ** tokenStore.memeToken.decimals)"
></token-name-price> ></token-name-price>
<token-logo img="/assets/img/vampir.png" :alt="'vampire'"></token-logo> <token-logo img="/assets/img/vampir.png" :size="64" :alt="'vampire'"></token-logo>
</div> </div>
</div> </div>
<div class="claim-button"> <div class="claim-button">
@@ -86,7 +87,9 @@
<div class="btn btn-immortal sub-header" disabled v-if="stateClaimedComp === 3"> <div class="btn btn-immortal sub-header" disabled v-if="stateClaimedComp === 3">
<loading-component></loading-component> <loading-component></loading-component>
</div> </div>
<div class="btn btn-immortal sub-header" @click="openStake">Stake</div> <div class="btn btn-immortal sub-header" v-if="stateClaimedComp === 0" @click="openStake">
Stake
</div>
</div> </div>
</Transition> </Transition>
<Transition name="smooth"> <Transition name="smooth">
@@ -157,7 +160,7 @@ import { waitForTransaction } from "@wagmi/core";
import LoadingComponent from "@/components/LoadingComponent.vue"; import LoadingComponent from "@/components/LoadingComponent.vue";
import TokenNamePrice from "@/components/TokenNamePrice.vue"; import TokenNamePrice from "@/components/TokenNamePrice.vue";
import TokenLogo from "@/components/TokenLogo.vue"; import TokenLogo from "@/components/TokenLogo.vue";
import { formatBigIntDivision } from "@/helper/helper.js"; import { formatNumber, formatBigIntDivision } from "@/helper/helper.js";
import { showSuccessToast } from "@/helper/toast.js"; import { showSuccessToast } from "@/helper/toast.js";
const showPanel = inject("showPanel"); const showPanel = inject("showPanel");
@@ -212,7 +215,7 @@ async function stakeAndClaim() {
const outputClaim = BigInt(rewardData?.topics[2]); const outputClaim = BigInt(rewardData?.topics[2]);
const outputStaked = BigInt(stakeData?.topics[3]); const outputStaked = BigInt(stakeData?.topics[3]);
showSuccessToast( showSuccessToast(
formatBigIntDivision(outputClaim + outputStaked, 10n ** tokenStore.memeToken.decimals), formatNumber(outputClaim + outputStaked, 10n ** tokenStore.memeToken.decimals),
"Success!", "Success!",
"You just claimed and staked", "You just claimed and staked",
"Join the next cycle to increase your rewards and win with your clan." "Join the next cycle to increase your rewards and win with your clan."
@@ -260,7 +263,7 @@ async function claimRewards() {
// //
console.log("rewardData", rewardData); console.log("rewardData", rewardData);
const outputClaim = formatBigIntDivision(BigInt(rewardData.topics[2]), 10n ** tokenStore.memeToken.decimals); const outputClaim = formatNumber(BigInt(rewardData.topics[2]), 10n ** tokenStore.memeToken.decimals);
showSuccessToast( showSuccessToast(
outputClaim, outputClaim,
"Success!", "Success!",
@@ -276,6 +279,16 @@ async function claimRewards() {
} }
} }
const clanBonusPercentage = computed(() => {
return (
(
(formatBigIntDivision(rewardsClan.value, 10n ** tokenStore.memeToken.decimals, 8) /
formatBigIntDivision(rewardsTotal.value, 10n ** tokenStore.memeToken.decimals, 8)) *
100
).toFixed(2) + "%"
);
});
const stateClaimedComp = computed(() => { const stateClaimedComp = computed(() => {
let returnState = 0; let returnState = 0;
if (stateClaim.value === 2) { if (stateClaim.value === 2) {
src/components/TokenInput.vue
+1
View File
@@ -7,6 +7,7 @@
:value="props.modelValue" :value="props.modelValue"
:placeholder="0" :placeholder="0"
type="number" type="number"
pattern="\d*"
/> />
<div class="value-adder"> <div class="value-adder">
<slot class="value-adder" name="message"></slot> <slot class="value-adder" name="message"></slot>
src/helper/helper.js
+16 -14
View File
@@ -3,31 +3,33 @@ export function getPercentage(amount, goal) {
return ((Number(amount) / Number(goal)) * 100).toFixed(2); return ((Number(amount) / Number(goal)) * 100).toFixed(2);
} }
// input type bigint
export function formatBigIntDivision(nominator, denominator) { export function formatNumber(nominator, denominator) {
let number = formatBigIntDivision(nominator, denominator);
number = InsertCommaNumber(number).toString();
return number;
}
export function formatBigIntDivision(nominator, denominator, digits = 2) {
console.log("nominator", nominator); console.log("nominator", nominator);
console.log("denominator", denominator); console.log("denominator", denominator);
if (!nominator) { if (!nominator) {
return 0n return 0n
} }
let integer = Number(nominator / denominator) let integer = Number(nominator / denominator);
integer = formatNumber(integer).toString();
// pick how much digits after point to show // pick how much digits after point to show
const fraction = (nominator % denominator).toString().substring(0,2); const fraction = (nominator % denominator).toString().substring(0, digits);
// output type string // output type number
return integer + '.' + fraction; return Number(integer + "." + fraction);
} }
export function formatNumber(number) {
const options = { export function InsertCommaNumber(number) {
style: "decimal",
minimumFractionDigits: 0,
maximumFractionDigits: 0,
};
if (!number) { if (!number) {
return 0 return 0
} }
const formattedWithOptions = number.toLocaleString("en-US", options); const formattedWithOptions = number.toLocaleString("en-US");
return formattedWithOptions; return formattedWithOptions;
} }
src/main.js
+4 -3
View File
@@ -38,7 +38,7 @@ import { library } from '@fortawesome/fontawesome-svg-core'
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome' import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
/* import specific icons */ /* import specific icons */
import { faArrowDown, faArrowRight, faSpinner, faPlus, faCaretLeft, faCaretRight, faBars, faAnglesRight, faChevronDown, faChevronUp, faArrowRightToBracket, faArrowRightFromBracket, faDroplet, faMoon, faPerson, faWallet } from "@fortawesome/free-solid-svg-icons"; import { faArrowDown, faArrowRight, faSpinner, faPlus, faCaretLeft, faCaretRight, faBars, faAnglesRight, faChevronDown, faChevronUp, faArrowRightToBracket, faArrowRightFromBracket, faDroplet, faMoon, faPerson, faWallet, faBlog } from "@fortawesome/free-solid-svg-icons";
import { faDiscord, faTwitter, faTelegram } from "@fortawesome/free-brands-svg-icons"; import { faDiscord, faTwitter, faTelegram } from "@fortawesome/free-brands-svg-icons";
@@ -68,7 +68,8 @@ library.add(
faDroplet, faDroplet,
faMoon, faMoon,
faPerson, faPerson,
faWallet faWallet,
faBlog
); );
var logging = localStorage.getItem("LOGGING"); var logging = localStorage.getItem("LOGGING");
@@ -152,7 +153,7 @@ try {
appName: "wagmi demo", appName: "wagmi demo",
}, },
}), }),
new MetaMaskConnector({ chains }), // new MetaMaskConnector({ chains }),
new InjectedConnector({ new InjectedConnector({
chains, chains,
getProvider: () => (typeof window !== "undefined" ? window.myInjectedWallet : undefined), getProvider: () => (typeof window !== "undefined" ? window.myInjectedWallet : undefined),
src/stores/sacrifice.js
+22 -22
View File
@@ -9,7 +9,7 @@ import { useRewardLockerStore } from "@/stores/rewardlocker";
import { useTokenStore } from "@/stores/tokens"; import { useTokenStore } from "@/stores/tokens";
import { waitForTransaction, readContract, watchBlockNumber, multicall } from "@wagmi/core"; import { waitForTransaction, readContract, watchBlockNumber, multicall } from "@wagmi/core";
import { showSuccessToast } from "@/helper/toast.js"; import { showSuccessToast } from "@/helper/toast.js";
import { formatBigIntDivision } from "@/helper/helper.js"; import { formatNumber } from "@/helper/helper.js";
export const useSacrificeStore = defineStore("sacrifice", { export const useSacrificeStore = defineStore("sacrifice", {
state: () => ({ state: () => ({
@@ -26,7 +26,6 @@ export const useSacrificeStore = defineStore("sacrifice", {
const tokenStore = useTokenStore(); const tokenStore = useTokenStore();
const cycleStore = useCycleStore(); const cycleStore = useCycleStore();
try { try {
this.sacrificeState = 2; this.sacrificeState = 2;
const getRewards = await this.getRewardsFor(amount, token); const getRewards = await this.getRewardsFor(amount, token);
@@ -65,7 +64,7 @@ export const useSacrificeStore = defineStore("sacrifice", {
let outputSacrifice = rewardData.reduce((x, y) => { let outputSacrifice = rewardData.reduce((x, y) => {
return x + BigInt(y.data); return x + BigInt(y.data);
}, 0n); }, 0n);
outputSacrifice = formatBigIntDivision(outputSacrifice, 10n ** token.decimals); outputSacrifice = formatNumber(outputSacrifice, 10n ** token.decimals);
console.log("outputSacrifice", outputSacrifice); console.log("outputSacrifice", outputSacrifice);
token.allowance = await tokenStore.allowance(); token.allowance = await tokenStore.allowance();
this.sacrificeState = 4; this.sacrificeState = 4;
@@ -88,7 +87,7 @@ export const useSacrificeStore = defineStore("sacrifice", {
} }
}, },
async getRewardsFor(amount, token) { async getRewardsFor(amount, token) {
console.log("getRewardsFor", {amount, token}); console.log("getRewardsFor", { amount, token });
const memeburnerStore = useMemeburnerStore(); const memeburnerStore = useMemeburnerStore();
const uniswapStore = useUniswapStore(); const uniswapStore = useUniswapStore();
const walletStore = useWalletStoreV2(); const walletStore = useWalletStoreV2();
@@ -98,7 +97,6 @@ export const useSacrificeStore = defineStore("sacrifice", {
let minBLOOD; let minBLOOD;
try { try {
if (!amount) { if (!amount) {
this.sacrificeState = 0; this.sacrificeState = 0;
return { return {
@@ -112,14 +110,16 @@ export const useSacrificeStore = defineStore("sacrifice", {
const rewardsForResult = await memeburnerStore.getRewardFor(amount); const rewardsForResult = await memeburnerStore.getRewardFor(amount);
const rewardsForResultSum = rewardsForResult[0] + rewardsForResult[1]; const rewardsForResultSum = rewardsForResult[0] + rewardsForResult[1];
// quote blood amount against ETH base amount // quote blood amount against ETH base amount
var quoteRewards = await uniswapStore.quoteExactInputSingle(amount, amountETHBase[0]); var quoteRewards = await uniswapStore.quoteExactInputSingle(amountETHBase[0]);
let variant = "sacrifice"; let variant = "sacrifice";
// here you are setting only variant, let's show by default rewardsForResultSum
output = rewardsForResultSum;
if (quoteRewards.result) { if (quoteRewards.result) {
// take 99.5% of quoted amount, 0.5% allowed slippage // take 99.5% of quoted amount, 0.5% allowed slippage
minBLOOD = quoteRewards.amount * 995n / 1000n; minBLOOD = (quoteRewards.amount * 995n) / 1000n;
if (quoteRewards.amount * 95n / 100n > rewardsForResultSum) { if ((quoteRewards.amount * 95n) / 100n > rewardsForResultSum) {
variant = "buy"; variant = "buy";
console.log("use Buy-function", { console.log("use Buy-function", {
quoteRewardsNumber: quoteRewards.amount, quoteRewardsNumber: quoteRewards.amount,
@@ -131,13 +131,6 @@ export const useSacrificeStore = defineStore("sacrifice", {
rewardsForResultSum, rewardsForResultSum,
}); });
} }
} else {
/**
* case 4
* quoter threw an error
*/
//
output = rewardsForResultSum;
} }
console.log("variant", variant); console.log("variant", variant);
console.log("amount", amount); console.log("amount", amount);
@@ -149,15 +142,23 @@ export const useSacrificeStore = defineStore("sacrifice", {
*/ */
output = rewardsForResultSum; output = rewardsForResultSum;
if (variant === "buy") { if (variant === "buy") {
output = quoteRewards.amount output = quoteRewards.amount;
} }
} else if (walletStore.connected && variant === "sacrifice") { } else if (walletStore.connected && variant === "sacrifice" && token.allowance >= amount) {
/** /**
* case 2 * case 2
* user is logged in and allowance is greater or equal input and variant is sacrifice * user is logged in and allowance is greater or equal input and variant is sacrifice
*/ */
output = rewardsForResultSum; // in this case you should use eth_call, so you are showing exact reward in cases of completing cycles
} else if (walletStore.connected && variant === "buy") { const amountSacrifice = await readContract({
address: memeburnerStore.contract.address,
abi: memeburnerStore.contract.abi,
functionName: "sacrificeMeme",
args: [token.contractAddress, amount.toString(), minETH.toString()],
account: walletStore.address,
});
output = amountSacrifice;
} else if (walletStore.connected && variant === "buy" && token.allowance >= amount) {
/** /**
* case 3 * case 3
* user is logged in and allowance is greater or equal input and variant is buy * user is logged in and allowance is greater or equal input and variant is buy
@@ -179,7 +180,7 @@ export const useSacrificeStore = defineStore("sacrifice", {
account: walletStore.address, account: walletStore.address,
}); });
if (amountBuy * 95n / 100n > amountSacrifice) { if ((amountBuy * 95n) / 100n > amountSacrifice) {
variant = "buy"; variant = "buy";
output = amountBuy; output = amountBuy;
console.log("use buy after comparison sacrificeMemeAndBuyBLOOD and sacrificeMeme"); console.log("use buy after comparison sacrificeMemeAndBuyBLOOD and sacrificeMeme");
@@ -196,7 +197,7 @@ export const useSacrificeStore = defineStore("sacrifice", {
token.contractAddress, token.contractAddress,
output output
); );
stakingRewardsNumber = stakingReward stakingRewardsNumber = stakingReward;
} }
return { return {
output: output, output: output,
@@ -205,7 +206,6 @@ export const useSacrificeStore = defineStore("sacrifice", {
minBLOOD: minBLOOD, minBLOOD: minBLOOD,
staking: stakingRewardsNumber, staking: stakingRewardsNumber,
}; };
} catch (error) { } catch (error) {
console.error("getRewardsFor", error); console.error("getRewardsFor", error);
} }
src/stores/tokens.js
+3 -3
View File
@@ -58,15 +58,15 @@ export const useTokenStore = defineStore("token", {
addSteps: [ addSteps: [
{ {
amount: 1000000000000000000000000n, amount: 1000000000000000000000000n,
name: "10m", name: "1m",
}, },
{ {
amount: 10000000000000000000000000n, amount: 10000000000000000000000000n,
name: "100m", name: "10m",
}, },
{ {
amount: 100000000000000000000000000n, amount: 100000000000000000000000000n,
name: "1b", name: "100m",
}, },
], ],
}, },
src/stores/walletV2.js
+1 -1
View File
@@ -2,7 +2,7 @@ import { defineStore } from "pinia";
import { markRaw } from "vue"; import { markRaw } from "vue";
import { useTokenStore } from "./tokens"; import { useTokenStore } from "./tokens";
import { useRewardLockerStore } from "./rewardlocker"; import { useRewardLockerStore } from "./rewardlocker";
import { formatBigIntDivision } from "@/helper/helper.js"; import { formatNumber } from "@/helper/helper.js";
import { import {
createConfig, createConfig,
configureChains, configureChains,
src/views/CycleView.vue
+5 -4
View File
@@ -2,8 +2,9 @@
<div class="cycle-page"> <div class="cycle-page">
<div class="cycle-header container container--variant1"> <div class="cycle-header container container--variant1">
<div class="bloodline-page-headline header" ref="observerElement">Bloodline Cycle</div> <div class="bloodline-page-headline header" ref="observerElement">Bloodline Cycle</div>
<div class="bloodline-page-description low-mid-text"> <div class="bloodline-page-description mid-mid-text">
Claim and trade your $BDL at each cycle's end. Become the most powerful bloodline and win extra rewards. Claim and trade your $BLOOD at each cycle's end. Become the most powerful bloodline and win extra
rewards.
</div> </div>
</div> </div>
<div class="slider-wrapper" :class="{ sticking: sticking }" ref="target"> <div class="slider-wrapper" :class="{ sticking: sticking }" ref="target">
@@ -28,7 +29,7 @@
<template v-if="difference > 0"> <template v-if="difference > 0">
<div class="round-finish-info-key">Sacrifice Goal:</div> <div class="round-finish-info-key">Sacrifice Goal:</div>
<div class="round-finish-info-value"> <div class="round-finish-info-value">
{{ cycleStore.getCurrentCycleData?.goalInBLD / 10n ** tokenStore.memeToken.decimals }} $BDL {{ cycleStore.getCurrentCycleData?.goalInBLD / 10n ** tokenStore.memeToken.decimals }} $BLOOD
</div> </div>
<div class="round-finish-info-key">Time left:</div> <div class="round-finish-info-key">Time left:</div>
<div class="round-finish-info-value">{{ days }} {{ hours }} {{ minutes }}</div> <div class="round-finish-info-value">{{ days }} {{ hours }} {{ minutes }}</div>
@@ -42,7 +43,7 @@
<div class="cycle-winner-left"> <div class="cycle-winner-left">
<div class="cycle-winner-headline">Cycle Winner</div> <div class="cycle-winner-headline">Cycle Winner</div>
<div class="cycle-winner-subheadline"> <div class="cycle-winner-subheadline">
+25% Clan Bonus on {{ cycleStore.getCycleWinner.name }} Sacrifice + Clan Bonus on {{ cycleStore.getCycleWinner.name }} Sacrifice
</div> </div>
</div> </div>
<div class="cycle-winner-right"> <div class="cycle-winner-right">
src/views/HomeView.vue
+3 -2
View File
@@ -66,6 +66,7 @@ function openTutorialFunc(e) {
text-align: center text-align: center
margin-top: 24px margin-top: 24px
margin-bottom: 48px margin-bottom: 48px
padding: 0 12px
@media (min-width: 992px) @media (min-width: 992px)
font-size: 48px font-size: 48px
margin-top: 0px margin-top: 0px
@@ -73,6 +74,7 @@ function openTutorialFunc(e) {
text-shadow: unset text-shadow: unset
line-height: 80px line-height: 80px
font-weight: 600 font-weight: 600
padding: 0
.chart-wrapper-coin .chart-wrapper-coin
display: flex display: flex
@@ -106,7 +108,6 @@ function openTutorialFunc(e) {
margin-right: auto margin-right: auto
pointer-events: none pointer-events: none
user-select: none user-select: none
@media (min-width: 992px)
width: 100% width: 100%
.chart-wrapper .chart-wrapper
width: 600px width: 600px
@@ -129,7 +130,7 @@ function openTutorialFunc(e) {
#section-header-container #section-header-container
margin: 72px 0 margin: 48px 0
scroll-margin: 150px scroll-margin: 150px
.tutorial-header .tutorial-header
display: flex display: flex