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

visual changes + sacrifice error fix

Browse Source
This commit is contained in:
Michel Fromme
2023-07-24 13:25:12 +02:00
parent 994c440e2f
commit 24d91353b9
8 changed files with 49 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/assets/sass/base.sass
-2
View File
@@ -11,8 +11,6 @@
border: 2px solid #000
&.bloodline-border--variant1
border: 4px solid var(--midnight-black)
@media (min-width: 992px)
border: 4px solid #000
@media (min-width: 992px)
padding: 24px 32px
border: 4px solid #000
src/assets/sass/buttons.sass
+1 -4
View File
@@ -8,11 +8,8 @@
padding: 16px 24px
gap: 8px
border-radius: 14px
@media (min-width: 992px)
background-color: $red
&:hover,&:focus,&:active
background-color: lighten($button-background-color, 10%),
color: darken($button-color, 10%),
background-color: darken($purple, 10%),
cursor: pointer
&.btn--disabled
background-color: #151515
src/components/SacrificeToken.vue
+15 -8
View File
@@ -92,7 +92,7 @@
v-if="activeToken.allowance > 0 && activeToken.allowance >= tokenNumber"
@click="approvalData = memeburnerStore.sacrificeMeme(tokenNumber)"
>
<font-awesome-icon v-if="loading" icon="spinner" spin />
<font-awesome-icon v-if="memeburnerStore.loading" icon="spinner" spin />
Sacrifce {{ activeToken.name }}
</div>
<div
@@ -162,18 +162,23 @@ async function getRewardsFor(e) {
// const rewardsForResult = await tokenStore.getRewardsFor(10000);
console.log("rewardsForResult", rewardsForResult);
console.log("tokenStore.memeToken.decimals", tokenStore.memeToken.decimals);
console.log("Math.pow(10, tokenStore.memeToken.decimals)", Math.pow(10, tokenStore.memeToken.decimals));
output.value = rewardsForResult / Math.pow(10, tokenStore.memeToken.decimals);
console.log(
"Math.pow(10, tokenStore.memeToken.decimals)",
Math.pow(10, tokenStore.memeToken.decimals)
);
output.value =
rewardsForResult / Math.pow(10, tokenStore.memeToken.decimals);
}
async function addTokens(value) {
tokenNumber.value = tokenNumber.value + value;
output.value = await memeburnerStore.getRewardsFor(parseInt(tokenNumber.value));
output.value = await memeburnerStore.getRewardsFor(
parseInt(tokenNumber.value)
);
}
</script>
<style lang="sass">
.sacrifice-wrapper
display: flex
flex-direction: column
@@ -206,14 +211,15 @@ async function addTokens(value) {
cursor: pointer
background-color: #0F0F0F
text-align: center
user-select: none
border: 4px solid transparent
.sacrifice-token-logo
pointer-events: none
// @media (min-width: 992px)
// padding: 0
// background-color: unset
&.sacrifice-token--active
padding: 10px
border-color: var(--purple)
@media (min-width: 992px)
border-color: var(--blood-color)
.sacrifice-token-name
padding: 5px 26px
@@ -272,6 +278,7 @@ async function addTokens(value) {
width: 45px
height: 45px
border-radius: 50%
pointer-events: none
@media (min-width: 992px)
height: 83px
width: auto
src/components/TokenClaim.vue
+14 -2
View File
@@ -41,6 +41,11 @@
</div>
<div v-else class="btn btn-immortal btn--disabled">Nothing to claim</div>
</div>
<div class="stake-buttons">
<div class="btn btn-immortal">Stake</div>
<div class="btn btn-immortal">Unstake</div>
</div>
</div>
</template>
@@ -58,7 +63,8 @@ const rewardLockerStore = useRewardLockerStore();
const walletStore = useWalletStore();
const roundStore = useRoundsStore();
const { address } = storeToRefs(walletStore);
const { activeRound, currentRound, getCurrentRoundData } = storeToRefs(roundStore);
const { activeRound, currentRound, getCurrentRoundData } =
storeToRefs(roundStore);
onMounted(async () => {});
@@ -79,7 +85,13 @@ async function claimRewards() {
padding: 32px 40px
.claim-button
text-align: center
margin-top: 32px
margin: 32px 0
.stake-buttons
display: flex
text-align: center
gap: 32px
div
flex: 1 1 50%
.rewards-wrapper
margin-bottom: 16px
.rewards-divider
src/stores/memeburner.js
+2 -1
View File
@@ -9,6 +9,7 @@ export const useMemeburnerStore = defineStore("memeburner", {
state: () => ({
config: MemeBurnerJson,
contract: null,
loading: false,
}),
getters: {},
@@ -90,7 +91,7 @@ export const useMemeburnerStore = defineStore("memeburner", {
.sacrificeMeme(tokenStore.activeToken.contractAddress, amountDecimal)
.send({ from: walletStore.address });
console.log("reward", reward);
tokenStore.activeToken.allowance = await this.allowance();
tokenStore.activeToken.allowance = await tokenStore.allowance();
} catch (error) {
console.error(error);
} finally {
src/stores/wallet.js
+6
View File
@@ -77,6 +77,12 @@ export const useWalletStore = defineStore("wallet", {
async isConnected() {
try {
this.loading = true;
if (!window.ethereum) {
console.warn("Metamask not installed"),
this.connected = false;
return;
}
const accounts = await window.ethereum.request({ method: "eth_accounts" });
if (accounts.length) {
this.connected = true;
src/views/HomeView.vue
+9 -4
View File
@@ -49,7 +49,9 @@ onBeforeUnmount(() => {
});
function timeBetweenDates() {
const dateEntered = new Date(getCurrentRoundData.value?.expirationTimestamp * 1000);
const dateEntered = new Date(
getCurrentRoundData.value?.expirationTimestamp * 1000
);
if (dateEntered) {
var now = new Date();
@@ -206,7 +208,6 @@ function timeBetweenDates() {
line-height: 80px
font-weight: 600
.chart-wrapper-coin
display: flex
justify-content: space-evenly
@@ -231,12 +232,15 @@ function timeBetweenDates() {
padding-right: 16px
#tokenomics
background-color: var(--darkgrey)
padding-bottom: 32px
>div
text-align: center
img
display: block
margin-left: auto
margin-right: auto
pointer-events: none
user-select: none
.chart-wrapper
width: 600px
height: 600px
@@ -255,7 +259,6 @@ function timeBetweenDates() {
text-align: center
padding-top: 10px
.slider-wrapper
display: flex
justify-content: center
@@ -266,9 +269,11 @@ function timeBetweenDates() {
margin-top: auto
margin-bottom: auto
.slider-prev, .slider-next
color: #3B0067
color: var(--purple)
font-size: 40px
cursor: pointer
&:hover,&:active, &:focus
filter: brightness(0.80)
&.disabled
opacity: .35
pointer-events: none