From 9b55b0587f07c68c4adbf87e6fa45c2b024f75cf Mon Sep 17 00:00:00 2001
From: Claudio La Barbera <claudio.labarbera@everli.com>
Date: Wed, 11 Sep 2024 02:05:57 +0200
Subject: [PATCH 01/11] improved interface

---
 src/App.vue                               |  2 +
 src/common/store/telegram.ts              | 74 ++++++++++++++++----
 src/components/common/Button.vue          |  2 +-
 src/components/common/MoneyBackground.vue | 73 ++++++++++++++++++++
 src/components/modals/Modal.vue           | 21 ++++--
 src/components/views/Home.vue             | 82 +++++++++++++++--------
 src/wrappers/TonConnectSender.ts          |  6 +-
 7 files changed, 207 insertions(+), 53 deletions(-)
 create mode 100644 src/components/common/MoneyBackground.vue

diff --git a/src/App.vue b/src/App.vue
index b1d22ce..63416fb 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -3,6 +3,7 @@ import { ref, computed, onMounted } from 'vue'
 import { useRouter } from 'vue-router'
 
 import { store } from './common/store'
+import MoneyBackground from './components/common/MoneyBackground.vue';
 
 const router = useRouter()
 
@@ -21,6 +22,7 @@ onMounted(async () => {
 </script>
 
 <template>
+  <MoneyBackground />
 
   <div class="relative z-10">
     <div class="flex flex-col h-[100vh]">
diff --git a/src/common/store/telegram.ts b/src/common/store/telegram.ts
index 5bfdce4..bf7004a 100644
--- a/src/common/store/telegram.ts
+++ b/src/common/store/telegram.ts
@@ -1,30 +1,36 @@
 import { Reactive, reactive } from "vue";
 import { TonConnectUI, TonConnectUiOptions, Account } from "@tonconnect/ui";
 import { InitDataParsed, retrieveLaunchParams } from "@telegram-apps/sdk";
-import { Address, toNano, TonClient } from "@ton/ton";
+import { Address, Cell, fromNano, toNano, TonClient } from "@ton/ton";
 import { HeadsOrTails } from "../../wrappers/HeadsOrTails";
 import { TonConnectSender } from "../../wrappers/TonConnectSender";
 
 interface Telegram {
   walletAccount: Account | null | undefined;
   tonConnectUI: TonConnectUI | null;
+  tonClient: TonClient | null;
   initDataRaw: string | undefined | null;
   initData: InitDataParsed | undefined | null;
   init: () => Promise<void>;
   initTelegramData: () => void;
   initWallet: () => Promise<void>;
   initConnectWalletButton: (buttonRootId: string | null) => Promise<void>;
-  playGame: (amount: number) => Promise<void>;
+  initClient: () => Promise<void>;
+  playGame: (amount: number) => Promise<string | null>;
+  getData: () => Promise<{ min_bet: string; max_bet: string } | null>;
+  getWalletBalance: () => Promise<string | null>;
 }
 
 export const Telegram: Reactive<Telegram> = reactive<Telegram>({
   walletAccount: null,
   tonConnectUI: null,
+  tonClient: null,
   initData: null,
   initDataRaw: null,
   async init() {
     this.initTelegramData();
     this.initWallet();
+    this.initClient();
   },
   initTelegramData() {
     const launchParams = retrieveLaunchParams();
@@ -35,11 +41,7 @@ export const Telegram: Reactive<Telegram> = reactive<Telegram>({
   async initWallet() {
     await this.tonConnectUI?.getWallets();
 
-    console.log(this.tonConnectUI);
-
     this.walletAccount = this.tonConnectUI?.account;
-
-    console.log(this.walletAccount);
   },
   async initConnectWalletButton(buttonRootId: string | null) {
     this.tonConnectUI = new TonConnectUI({
@@ -52,8 +54,6 @@ export const Telegram: Reactive<Telegram> = reactive<Telegram>({
     } as TonConnectUiOptions;
 
     this.tonConnectUI.onModalStateChange(async (state) => {
-      console.log(state);
-
       if (
         state.status === "closed" &&
         state.closeReason === "wallet-selected"
@@ -63,17 +63,44 @@ export const Telegram: Reactive<Telegram> = reactive<Telegram>({
     });
 
     this.tonConnectUI.onStatusChange((status) => {
-      if(!status) {
+      if (!status) {
         this.walletAccount = null;
       }
     });
-
-    console.log(this.tonConnectUI);
+  },
+  async initClient() {
+    this.tonClient = new TonClient({
+      endpoint: "https://toncenter.com/api/v2/jsonRPC",
+    });
   },
   async playGame(amount: number) {
     const collectionAddress = import.meta.env.VITE_TON_CONTRACT_ADDRESS;
     const address = Address.parse(collectionAddress);
 
+    const contractProvider = this.tonClient?.open(
+      HeadsOrTails.createFromAddress(address)
+    );
+
+    if (this.tonConnectUI) {
+      const tonConnectSender = new TonConnectSender(this.tonConnectUI);
+
+      await contractProvider?.sendBet(tonConnectSender, toNano(amount));
+
+      const cell = Cell.fromBase64(
+        tonConnectSender.lastTransactionResponse?.boc ?? ""
+      );
+      const buffer = cell.hash();
+      const hashHex = buffer.toString("hex");
+
+      return hashHex;
+    }
+
+    return null;
+  },
+  async getData() {
+    const collectionAddress = import.meta.env.VITE_TON_CONTRACT_ADDRESS;
+    const address = Address.parse(collectionAddress);
+
     const tonClient = new TonClient({
       endpoint: "https://toncenter.com/api/v2/jsonRPC",
     });
@@ -83,10 +110,29 @@ export const Telegram: Reactive<Telegram> = reactive<Telegram>({
     );
 
     if (this.tonConnectUI) {
-      return await contractProvider.sendBet(
-        new TonConnectSender(this.tonConnectUI),
-        toNano(amount)
+      const data = (await contractProvider.getData()).beginParse();
+      data.loadAddress();
+      const min_bet = fromNano(data.loadCoins());
+      const max_bet = fromNano(data.loadCoins());
+
+      return {
+        min_bet,
+        max_bet,
+      };
+    }
+
+    return null;
+  },
+  async getWalletBalance() {
+    try {
+      const balance = await this.tonClient?.getBalance(
+        Address.parse(this.walletAccount?.address ?? "")
       );
+      return fromNano(balance ?? 0);
+    } catch (error) {
+      console.error("Error fetching wallet balance:", error);
     }
+
+    return null;
   },
 });
diff --git a/src/components/common/Button.vue b/src/components/common/Button.vue
index cc9a48b..fdf3d02 100644
--- a/src/components/common/Button.vue
+++ b/src/components/common/Button.vue
@@ -31,7 +31,7 @@ const click = () => {
 </script>
 
 <template>
-  <button :class="classObject" class="rounded-md uppercase disabled:bg-gray-500" @click="click" :disabled="props.disabled">
+  <button :class="classObject" class="text-xl font-black py-4 px-10 rounded-md uppercase disabled:bg-gray-500" @click="click" :disabled="props.disabled">
     <slot></slot>
   </button>
 </template>
\ No newline at end of file
diff --git a/src/components/common/MoneyBackground.vue b/src/components/common/MoneyBackground.vue
new file mode 100644
index 0000000..3124322
--- /dev/null
+++ b/src/components/common/MoneyBackground.vue
@@ -0,0 +1,73 @@
+<template>
+  <div class="h-[100vh] w-[100vw] overflow-hidden fixed inset-0 z-0">
+    <div id="coins" class="z-0"></div>
+    <div id="coins2" class="z-0"></div>
+    <div id="coins3" class="z-0"></div>
+  </div>
+</template>
+
+<style>
+#coins {
+  width: 1px;
+  height: 1px;
+  background: transparent;
+  box-shadow: 1144px 728px #fadf47, 682px 735px #fadf47, 765px 1342px #fadf47, 1098px 1189px #fadf47, 878px 1230px #fadf47, 754px 888px #fadf47, 1778px 1646px #fadf47, 126px 1127px #fadf47, 1485px 23px #fadf47, 192px 1415px #fadf47, 488px 1489px #fadf47, 539px 1578px #fadf47, 1720px 1531px #fadf47, 1031px 117px #fadf47, 1885px 1961px #fadf47, 1212px 494px #fadf47, 149px 1298px #fadf47, 186px 1879px #fadf47, 914px 959px #fadf47, 1948px 1384px #fadf47, 188px 1852px #fadf47, 1128px 1746px #fadf47, 1486px 1885px #fadf47, 1608px 1075px #fadf47, 1252px 137px #fadf47, 270px 878px #fadf47, 1802px 1559px #fadf47, 25px 1911px #fadf47, 1381px 293px #fadf47, 785px 357px #fadf47, 1398px 1156px #fadf47, 1656px 338px #fadf47, 1551px 150px #fadf47, 1224px 536px #fadf47, 585px 478px #fadf47, 1252px 1947px #fadf47, 1735px 365px #fadf47, 1671px 1871px #fadf47, 1444px 1815px #fadf47, 1955px 1532px #fadf47, 1927px 168px #fadf47, 1620px 1912px #fadf47, 1402px 1489px #fadf47, 54px 1247px #fadf47, 1143px 1189px #fadf47, 698px 172px #fadf47, 1623px 1503px #fadf47, 485px 1533px #fadf47, 1560px 784px #fadf47, 517px 950px #fadf47, 557px 201px #fadf47, 1959px 1370px #fadf47, 1744px 441px #fadf47, 1678px 1171px #fadf47, 563px 875px #fadf47, 1013px 1615px #fadf47, 1018px 1582px #fadf47, 1451px 20px #fadf47, 1526px 953px #fadf47, 1914px 1044px #fadf47, 1112px 48px #fadf47, 1166px 64px #fadf47, 66px 1938px #fadf47, 1486px 998px #fadf47, 1759px 1964px #fadf47, 1037px 1828px #fadf47, 465px 758px #fadf47, 1212px 176px #fadf47, 707px 157px #fadf47, 1654px 1373px #fadf47, 1809px 334px #fadf47, 245px 1538px #fadf47, 1715px 462px #fadf47, 1154px 1697px #fadf47, 1243px 331px #fadf47, 397px 861px #fadf47, 108px 1501px #fadf47, 874px 133px #fadf47, 1822px 34px #fadf47, 1107px 1417px #fadf47, 143px 1763px #fadf47, 1837px 1358px #fadf47, 318px 1139px #fadf47, 397px 1747px #fadf47, 1010px 772px #fadf47, 92px 321px #fadf47, 1121px 183px #fadf47, 765px 1658px #fadf47, 1139px 52px #fadf47, 1768px 1431px #fadf47, 358px 699px #fadf47, 583px 148px #fadf47, 375px 1002px #fadf47, 1276px 231px #fadf47, 784px 214px #fadf47, 578px 944px #fadf47, 1135px 1543px #fadf47, 334px 651px #fadf47, 1554px 889px #fadf47, 167px 1716px #fadf47, 1961px 688px #fadf47, 986px 1801px #fadf47, 1994px 1859px #fadf47, 1631px 800px #fadf47, 435px 238px #fadf47, 1707px 128px #fadf47, 1018px 612px #fadf47, 964px 1357px #fadf47, 96px 1730px #fadf47, 433px 428px #fadf47, 950px 1456px #fadf47, 494px 885px #fadf47, 916px 1578px #fadf47, 1547px 404px #fadf47, 1806px 1533px #fadf47, 1891px 166px #fadf47, 1761px 986px #fadf47, 1093px 839px #fadf47, 112px 577px #fadf47, 188px 957px #fadf47, 423px 400px #fadf47, 1949px 1424px #fadf47, 1502px 230px #fadf47, 832px 632px #fadf47, 690px 1107px #fadf47, 1054px 1296px #fadf47, 1407px 1882px #fadf47, 1330px 1142px #fadf47, 689px 964px #fadf47, 752px 434px #fadf47, 761px 1222px #fadf47, 1968px 46px #fadf47, 1449px 101px #fadf47, 936px 832px #fadf47, 593px 1074px #fadf47, 1238px 729px #fadf47, 329px 1630px #fadf47, 1609px 1742px #fadf47, 1613px 1335px #fadf47, 1187px 1238px #fadf47, 1827px 1116px #fadf47, 720px 1162px #fadf47, 1795px 1548px #fadf47, 1795px 1768px #fadf47, 600px 1144px #fadf47, 1799px 935px #fadf47, 887px 1814px #fadf47, 1525px 1307px #fadf47, 1252px 134px #fadf47, 314px 68px #fadf47, 1057px 634px #fadf47, 841px 1673px #fadf47, 1677px 923px #fadf47, 724px 1006px #fadf47, 449px 1909px #fadf47, 1561px 733px #fadf47, 787px 460px #fadf47, 952px 1574px #fadf47, 965px 1854px #fadf47, 12px 1819px #fadf47, 1771px 509px #fadf47, 998px 1745px #fadf47, 1158px 1713px #fadf47, 287px 425px #fadf47, 1097px 13px #fadf47, 475px 1837px #fadf47, 1950px 1870px #fadf47, 923px 310px #fadf47, 1883px 1308px #fadf47, 148px 1811px #fadf47, 1974px 878px #fadf47, 371px 720px #fadf47, 201px 1137px #fadf47, 1069px 1619px #fadf47, 573px 874px #fadf47, 1105px 1215px #fadf47, 1143px 750px #fadf47, 1356px 1999px #fadf47, 695px 1271px #fadf47, 560px 1585px #fadf47, 562px 1185px #fadf47, 876px 888px #fadf47, 1124px 11px #fadf47, 1127px 1512px #fadf47, 1615px 361px #fadf47, 1032px 295px #fadf47, 1100px 652px #fadf47, 1768px 747px #fadf47, 1952px 288px #fadf47, 866px 1392px #fadf47, 1517px 1538px #fadf47, 544px 1270px #fadf47, 645px 679px #fadf47, 1499px 662px #fadf47, 1046px 982px #fadf47, 54px 883px #fadf47, 1583px 381px #fadf47, 1076px 944px #fadf47, 65px 1077px #fadf47, 251px 1478px #fadf47, 518px 1936px #fadf47, 72px 1112px #fadf47, 1906px 1663px #fadf47, 996px 442px #fadf47, 1330px 419px #fadf47, 1157px 1529px #fadf47, 1476px 1037px #fadf47, 855px 83px #fadf47, 808px 399px #fadf47, 1952px 1680px #fadf47, 445px 84px #fadf47, 977px 739px #fadf47, 1866px 458px #fadf47, 230px 293px #fadf47, 1414px 555px #fadf47, 292px 989px #fadf47, 1651px 1518px #fadf47, 1362px 1511px #fadf47, 471px 862px #fadf47, 383px 993px #fadf47, 685px 546px #fadf47, 1908px 1431px #fadf47, 1030px 107px #fadf47, 523px 141px #fadf47, 1734px 1409px #fadf47, 824px 991px #fadf47, 747px 1326px #fadf47, 1259px 1334px #fadf47, 805px 760px #fadf47, 308px 1130px #fadf47, 1511px 729px #fadf47, 137px 725px #fadf47, 1551px 893px #fadf47, 1177px 154px #fadf47, 1846px 1661px #fadf47, 484px 1096px #fadf47, 1691px 1521px #fadf47, 1598px 1910px #fadf47, 846px 468px #fadf47, 1739px 1771px #fadf47, 893px 945px #fadf47, 831px 407px #fadf47, 404px 310px #fadf47, 232px 1317px #fadf47, 1236px 1696px #fadf47, 1771px 457px #fadf47, 407px 1169px #fadf47, 74px 1125px #fadf47, 1376px 1865px #fadf47, 44px 836px #fadf47, 1948px 595px #fadf47, 188px 1258px #fadf47, 35px 1501px #fadf47, 629px 1069px #fadf47, 1603px 931px #fadf47, 489px 862px #fadf47, 1181px 1986px #fadf47, 1866px 1444px #fadf47, 1537px 303px #fadf47, 1952px 17px #fadf47, 13px 1240px #fadf47, 1307px 911px #fadf47, 1543px 1135px #fadf47, 1101px 1278px #fadf47, 1212px 1077px #fadf47, 1798px 1155px #fadf47, 1464px 342px #fadf47, 553px 1623px #fadf47, 207px 395px #fadf47, 683px 424px #fadf47, 586px 1770px #fadf47, 1265px 220px #fadf47, 357px 1815px #fadf47, 780px 1184px #fadf47, 877px 1904px #fadf47, 326px 1569px #fadf47, 1819px 1938px #fadf47, 1839px 503px #fadf47, 720px 1231px #fadf47, 640px 1084px #fadf47, 1122px 657px #fadf47, 725px 945px #fadf47, 992px 816px #fadf47, 1935px 851px #fadf47, 1074px 1686px #fadf47, 1160px 1438px #fadf47, 1259px 1905px #fadf47, 1120px 215px #fadf47, 92px 581px #fadf47, 932px 367px #fadf47, 1121px 523px #fadf47, 1273px 1866px #fadf47, 149px 140px #fadf47, 230px 1212px #fadf47, 1265px 1592px #fadf47, 1223px 654px #fadf47, 820px 1316px #fadf47, 1369px 1946px #fadf47, 319px 1164px #fadf47, 1058px 1973px #fadf47, 1756px 41px #fadf47, 740px 2000px #fadf47, 1241px 1914px #fadf47, 248px 171px #fadf47, 1657px 1915px #fadf47, 1662px 260px #fadf47, 1670px 736px #fadf47, 1877px 607px #fadf47, 396px 1058px #fadf47, 240px 599px #fadf47, 769px 1041px #fadf47, 940px 1436px #fadf47, 793px 632px #fadf47, 1350px 430px #fadf47, 1790px 1327px #fadf47, 865px 86px #fadf47, 988px 582px #fadf47, 1777px 1147px #fadf47, 901px 1543px #fadf47, 728px 1994px #fadf47, 83px 1893px #fadf47, 266px 195px #fadf47, 1545px 451px #fadf47, 311px 1659px #fadf47, 1612px 295px #fadf47, 1844px 651px #fadf47, 955px 1670px #fadf47, 1631px 494px #fadf47, 1754px 435px #fadf47, 1271px 488px #fadf47, 1859px 1892px #fadf47, 1631px 820px #fadf47, 1833px 1258px #fadf47, 316px 803px #fadf47, 116px 1875px #fadf47, 1620px 1284px #fadf47, 1767px 1850px #fadf47, 18px 574px #fadf47, 1857px 840px #fadf47, 184px 1498px #fadf47, 1389px 76px #fadf47, 27px 1974px #fadf47, 1795px 463px #fadf47, 619px 1001px #fadf47, 93px 1857px #fadf47, 393px 1722px #fadf47, 350px 396px #fadf47, 1789px 422px #fadf47, 1944px 1609px #fadf47, 24px 861px #fadf47, 1895px 1470px #fadf47, 1478px 1168px #fadf47, 122px 296px #fadf47, 1100px 592px #fadf47, 1561px 508px #fadf47, 572px 1016px #fadf47, 352px 94px #fadf47, 864px 1216px #fadf47, 1036px 948px #fadf47, 1706px 1829px #fadf47, 143px 77px #fadf47, 1031px 1600px #fadf47, 1028px 80px #fadf47, 1300px 1480px #fadf47, 1697px 1952px #fadf47, 1768px 1285px #fadf47, 730px 693px #fadf47, 1759px 919px #fadf47, 917px 1127px #fadf47, 1752px 581px #fadf47, 1614px 1205px #fadf47, 559px 1339px #fadf47, 1622px 255px #fadf47, 1700px 133px #fadf47, 663px 625px #fadf47, 1854px 1606px #fadf47, 254px 581px #fadf47, 1597px 551px #fadf47, 1092px 123px #fadf47, 788px 463px #fadf47, 1308px 531px #fadf47, 670px 569px #fadf47, 487px 1212px #fadf47, 1181px 1323px #fadf47, 1499px 1757px #fadf47, 1632px 543px #fadf47, 441px 1728px #fadf47, 838px 1005px #fadf47, 746px 252px #fadf47, 1000px 329px #fadf47, 613px 1185px #fadf47, 1457px 61px #fadf47, 1849px 1012px #fadf47, 1210px 674px #fadf47, 1138px 400px #fadf47, 1151px 1273px #fadf47, 537px 905px #fadf47, 317px 710px #fadf47, 408px 1697px #fadf47, 1056px 1349px #fadf47, 794px 987px #fadf47, 400px 838px #fadf47, 1667px 492px #fadf47, 942px 1739px #fadf47, 1085px 1870px #fadf47, 1899px 721px #fadf47, 681px 1373px #fadf47, 798px 392px #fadf47, 486px 1259px #fadf47, 460px 687px #fadf47, 959px 1491px #fadf47, 1821px 367px #fadf47, 730px 1532px #fadf47, 1202px 484px #fadf47, 212px 1375px #fadf47, 111px 20px #fadf47, 917px 1009px #fadf47, 990px 813px #fadf47, 470px 426px #fadf47, 1011px 753px #fadf47, 59px 461px #fadf47, 360px 1416px #fadf47, 698px 1073px #fadf47, 1206px 55px #fadf47, 107px 1179px #fadf47, 1062px 1462px #fadf47, 950px 1605px #fadf47, 1348px 1347px #fadf47, 1065px 287px #fadf47, 1425px 1861px #fadf47, 1118px 480px #fadf47, 180px 1031px #fadf47, 1101px 1822px #fadf47, 1514px 1370px #fadf47, 610px 1293px #fadf47, 397px 1510px #fadf47, 1975px 1389px #fadf47, 899px 1150px #fadf47, 1292px 496px #fadf47, 1798px 1882px #fadf47, 1904px 1476px #fadf47, 802px 1795px #fadf47, 1634px 1684px #fadf47, 743px 196px #fadf47, 1161px 963px #fadf47, 481px 821px #fadf47, 1559px 1292px #fadf47, 871px 1822px #fadf47, 782px 560px #fadf47, 1576px 767px #fadf47, 30px 1394px #fadf47, 1817px 863px #fadf47, 1783px 814px #fadf47, 20px 1976px #fadf47, 988px 1586px #fadf47, 1670px 212px #fadf47, 1332px 1203px #fadf47, 311px 614px #fadf47, 1562px 1617px #fadf47, 826px 1293px #fadf47, 283px 154px #fadf47, 1142px 1095px #fadf47, 1188px 67px #fadf47, 8px 625px #fadf47, 1917px 1534px #fadf47, 1800px 677px #fadf47, 620px 1687px #fadf47, 424px 192px #fadf47, 1205px 61px #fadf47, 704px 736px #fadf47, 1966px 1835px #fadf47, 1539px 216px #fadf47, 1372px 750px #fadf47, 1947px 540px #fadf47, 1839px 452px #fadf47, 1762px 695px #fadf47, 124px 588px #fadf47, 865px 1727px #fadf47, 800px 1704px #fadf47, 18px 1066px #fadf47, 1441px 1500px #fadf47, 10px 236px #fadf47, 1899px 594px #fadf47, 1607px 912px #fadf47, 25px 750px #fadf47, 628px 1612px #fadf47, 1902px 663px #fadf47, 1863px 1708px #fadf47, 1608px 1013px #fadf47, 1033px 1418px #fadf47, 1159px 1968px #fadf47, 1462px 338px #fadf47, 896px 123px #fadf47, 1002px 1102px #fadf47, 1140px 180px #fadf47, 1039px 970px #fadf47, 1032px 1561px #fadf47, 1783px 1206px #fadf47, 1993px 800px #fadf47, 909px 1938px #fadf47, 852px 388px #fadf47, 704px 1369px #fadf47, 479px 1639px #fadf47, 172px 638px #fadf47, 590px 804px #fadf47, 771px 1775px #fadf47, 794px 1040px #fadf47, 1972px 1781px #fadf47, 1313px 1733px #fadf47, 499px 1018px #fadf47, 1437px 940px #fadf47, 939px 1735px #fadf47, 895px 1967px #fadf47, 229px 204px #fadf47, 175px 401px #fadf47, 1094px 1186px #fadf47, 1813px 1864px #fadf47, 980px 1516px #fadf47, 1311px 469px #fadf47, 1883px 1344px #fadf47, 449px 1582px #fadf47, 1389px 1060px #fadf47, 1135px 1453px #fadf47, 1060px 1205px #fadf47, 1010px 205px #fadf47, 973px 1888px #fadf47, 1429px 969px #fadf47, 89px 1710px #fadf47, 1033px 1712px #fadf47, 1954px 818px #fadf47, 1497px 473px #fadf47, 161px 371px #fadf47, 349px 1793px #fadf47, 491px 1316px #fadf47, 47px 1290px #fadf47, 1419px 1999px #fadf47, 1248px 1790px #fadf47, 1269px 1237px #fadf47, 1398px 1005px #fadf47, 925px 926px #fadf47, 1143px 1962px #fadf47, 1054px 361px #fadf47, 1752px 274px #fadf47, 1825px 1855px #fadf47, 573px 191px #fadf47, 278px 657px #fadf47, 135px 516px #fadf47, 633px 1269px #fadf47, 794px 384px #fadf47, 404px 977px #fadf47, 1715px 754px #fadf47, 266px 660px #fadf47, 930px 1328px #fadf47, 711px 1828px #fadf47, 97px 1218px #fadf47, 133px 127px #fadf47, 726px 1931px #fadf47, 426px 447px #fadf47, 1284px 1312px #fadf47, 871px 618px #fadf47, 55px 1785px #fadf47, 1500px 1256px #fadf47, 648px 258px #fadf47, 1079px 156px #fadf47, 1523px 857px #fadf47, 468px 1339px #fadf47, 1387px 1034px #fadf47, 470px 431px #fadf47, 1390px 1700px #fadf47, 1699px 748px #fadf47, 1102px 74px #fadf47, 247px 950px #fadf47, 249px 1010px #fadf47, 832px 135px #fadf47, 139px 1120px #fadf47, 789px 300px #fadf47, 304px 1905px #fadf47, 1509px 1808px #fadf47, 657px 1940px #fadf47, 1864px 322px #fadf47, 1948px 531px #fadf47, 624px 1164px #fadf47, 1565px 1673px #fadf47, 742px 1655px #fadf47, 933px 674px #fadf47, 991px 1596px #fadf47, 1886px 654px #fadf47, 1657px 1656px #fadf47, 458px 928px #fadf47, 1196px 1253px #fadf47, 1697px 197px #fadf47, 571px 1512px #fadf47, 1891px 1658px #fadf47, 105px 1808px #fadf47, 1951px 27px #fadf47, 1234px 1326px #fadf47, 1141px 242px #fadf47, 102px 886px #fadf47, 1227px 770px #fadf47, 1580px 392px #fadf47, 1345px 709px #fadf47, 1325px 555px #fadf47, 562px 898px #fadf47, 1270px 479px #fadf47, 1839px 884px #fadf47, 1908px 14px #fadf47, 1357px 595px #fadf47, 212px 297px #fadf47, 647px 506px #fadf47, 1160px 1901px #fadf47, 1027px 1171px #fadf47, 1429px 1578px #fadf47, 9px 618px #fadf47, 121px 1954px #fadf47, 1692px 164px #fadf47, 1083px 1457px #fadf47, 1035px 742px #fadf47, 1163px 1566px #fadf47, 1144px 1385px #fadf47, 1211px 911px #fadf47, 1653px 813px #fadf47, 1090px 1570px #fadf47, 290px 1271px #fadf47, 746px 1329px #fadf47, 453px 1447px #fadf47, 1497px 1874px #fadf47, 1493px 1116px #fadf47, 845px 1742px #fadf47, 1165px 1999px #fadf47, 576px 563px #fadf47, 51px 404px #fadf47, 993px 770px #fadf47, 1997px 674px #fadf47, 1355px 1487px #fadf47, 1642px 146px #fadf47, 1160px 1718px #fadf47, 947px 235px #fadf47, 874px 1198px #fadf47, 1280px 1465px #fadf47, 373px 654px #fadf47, 1734px 608px #fadf47, 1699px 40px #fadf47, 122px 1568px #fadf47, 181px 1966px #fadf47, 9px 194px #fadf47, 59px 707px #fadf47, 871px 726px #fadf47, 220px 11px #fadf47, 1626px 1002px #fadf47, 877px 1749px #fadf47, 330px 300px #fadf47, 1515px 308px #fadf47, 876px 1509px #fadf47, 1016px 960px #fadf47, 113px 267px #fadf47, 747px 1859px #fadf47, 234px 906px #fadf47, 1687px 1601px #fadf47, 773px 844px #fadf47, 1812px 1479px #fadf47, 688px 1103px #fadf47, 1305px 71px #fadf47, 1276px 493px #fadf47, 843px 1434px #fadf47, 6px 1435px #fadf47, 1848px 508px #fadf47, 1101px 240px #fadf47, 1974px 1952px #fadf47, 1072px 406px #fadf47, 697px 1196px #fadf47, 988px 256px #fadf47, 501px 582px #fadf47, 460px 1825px #fadf47, 1912px 1029px #fadf47, 1829px 1728px #fadf47, 405px 190px #fadf47, 1930px 1454px #fadf47, 1524px 1997px #fadf47, 721px 1573px #fadf47, 1715px 1977px #fadf47, 1003px 452px #fadf47, 1200px 1844px #fadf47, 1532px 986px #fadf47, 1631px 1912px #fadf47, 1521px 1236px #fadf47, 1862px 1939px #fadf47, 490px 259px #fadf47, 991px 929px #fadf47, 1770px 96px #fadf47, 599px 1502px #fadf47, 1269px 1762px #fadf47, 1745px 1873px #fadf47, 1462px 1727px #fadf47, 1271px 532px #fadf47, 1544px 1172px #fadf47, 142px 1744px #fadf47, 521px 941px #fadf47, 596px 879px #fadf47, 985px 427px #fadf47, 1691px 1653px #fadf47;
+  animation: animCoins 25s linear infinite;
+}
+
+#coins:after {
+  content: " ";
+  position: absolute;
+  top: 2000px;
+  width: 1px;
+  height: 1px;
+  background: transparent;
+  box-shadow: 1144px 728px #fadf47, 682px 735px #fadf47, 765px 1342px #fadf47, 1098px 1189px #fadf47, 878px 1230px #fadf47, 754px 888px #fadf47, 1778px 1646px #fadf47, 126px 1127px #fadf47, 1485px 23px #fadf47, 192px 1415px #fadf47, 488px 1489px #fadf47, 539px 1578px #fadf47, 1720px 1531px #fadf47, 1031px 117px #fadf47, 1885px 1961px #fadf47, 1212px 494px #fadf47, 149px 1298px #fadf47, 186px 1879px #fadf47, 914px 959px #fadf47, 1948px 1384px #fadf47, 188px 1852px #fadf47, 1128px 1746px #fadf47, 1486px 1885px #fadf47, 1608px 1075px #fadf47, 1252px 137px #fadf47, 270px 878px #fadf47, 1802px 1559px #fadf47, 25px 1911px #fadf47, 1381px 293px #fadf47, 785px 357px #fadf47, 1398px 1156px #fadf47, 1656px 338px #fadf47, 1551px 150px #fadf47, 1224px 536px #fadf47, 585px 478px #fadf47, 1252px 1947px #fadf47, 1735px 365px #fadf47, 1671px 1871px #fadf47, 1444px 1815px #fadf47, 1955px 1532px #fadf47, 1927px 168px #fadf47, 1620px 1912px #fadf47, 1402px 1489px #fadf47, 54px 1247px #fadf47, 1143px 1189px #fadf47, 698px 172px #fadf47, 1623px 1503px #fadf47, 485px 1533px #fadf47, 1560px 784px #fadf47, 517px 950px #fadf47, 557px 201px #fadf47, 1959px 1370px #fadf47, 1744px 441px #fadf47, 1678px 1171px #fadf47, 563px 875px #fadf47, 1013px 1615px #fadf47, 1018px 1582px #fadf47, 1451px 20px #fadf47, 1526px 953px #fadf47, 1914px 1044px #fadf47, 1112px 48px #fadf47, 1166px 64px #fadf47, 66px 1938px #fadf47, 1486px 998px #fadf47, 1759px 1964px #fadf47, 1037px 1828px #fadf47, 465px 758px #fadf47, 1212px 176px #fadf47, 707px 157px #fadf47, 1654px 1373px #fadf47, 1809px 334px #fadf47, 245px 1538px #fadf47, 1715px 462px #fadf47, 1154px 1697px #fadf47, 1243px 331px #fadf47, 397px 861px #fadf47, 108px 1501px #fadf47, 874px 133px #fadf47, 1822px 34px #fadf47, 1107px 1417px #fadf47, 143px 1763px #fadf47, 1837px 1358px #fadf47, 318px 1139px #fadf47, 397px 1747px #fadf47, 1010px 772px #fadf47, 92px 321px #fadf47, 1121px 183px #fadf47, 765px 1658px #fadf47, 1139px 52px #fadf47, 1768px 1431px #fadf47, 358px 699px #fadf47, 583px 148px #fadf47, 375px 1002px #fadf47, 1276px 231px #fadf47, 784px 214px #fadf47, 578px 944px #fadf47, 1135px 1543px #fadf47, 334px 651px #fadf47, 1554px 889px #fadf47, 167px 1716px #fadf47, 1961px 688px #fadf47, 986px 1801px #fadf47, 1994px 1859px #fadf47, 1631px 800px #fadf47, 435px 238px #fadf47, 1707px 128px #fadf47, 1018px 612px #fadf47, 964px 1357px #fadf47, 96px 1730px #fadf47, 433px 428px #fadf47, 950px 1456px #fadf47, 494px 885px #fadf47, 916px 1578px #fadf47, 1547px 404px #fadf47, 1806px 1533px #fadf47, 1891px 166px #fadf47, 1761px 986px #fadf47, 1093px 839px #fadf47, 112px 577px #fadf47, 188px 957px #fadf47, 423px 400px #fadf47, 1949px 1424px #fadf47, 1502px 230px #fadf47, 832px 632px #fadf47, 690px 1107px #fadf47, 1054px 1296px #fadf47, 1407px 1882px #fadf47, 1330px 1142px #fadf47, 689px 964px #fadf47, 752px 434px #fadf47, 761px 1222px #fadf47, 1968px 46px #fadf47, 1449px 101px #fadf47, 936px 832px #fadf47, 593px 1074px #fadf47, 1238px 729px #fadf47, 329px 1630px #fadf47, 1609px 1742px #fadf47, 1613px 1335px #fadf47, 1187px 1238px #fadf47, 1827px 1116px #fadf47, 720px 1162px #fadf47, 1795px 1548px #fadf47, 1795px 1768px #fadf47, 600px 1144px #fadf47, 1799px 935px #fadf47, 887px 1814px #fadf47, 1525px 1307px #fadf47, 1252px 134px #fadf47, 314px 68px #fadf47, 1057px 634px #fadf47, 841px 1673px #fadf47, 1677px 923px #fadf47, 724px 1006px #fadf47, 449px 1909px #fadf47, 1561px 733px #fadf47, 787px 460px #fadf47, 952px 1574px #fadf47, 965px 1854px #fadf47, 12px 1819px #fadf47, 1771px 509px #fadf47, 998px 1745px #fadf47, 1158px 1713px #fadf47, 287px 425px #fadf47, 1097px 13px #fadf47, 475px 1837px #fadf47, 1950px 1870px #fadf47, 923px 310px #fadf47, 1883px 1308px #fadf47, 148px 1811px #fadf47, 1974px 878px #fadf47, 371px 720px #fadf47, 201px 1137px #fadf47, 1069px 1619px #fadf47, 573px 874px #fadf47, 1105px 1215px #fadf47, 1143px 750px #fadf47, 1356px 1999px #fadf47, 695px 1271px #fadf47, 560px 1585px #fadf47, 562px 1185px #fadf47, 876px 888px #fadf47, 1124px 11px #fadf47, 1127px 1512px #fadf47, 1615px 361px #fadf47, 1032px 295px #fadf47, 1100px 652px #fadf47, 1768px 747px #fadf47, 1952px 288px #fadf47, 866px 1392px #fadf47, 1517px 1538px #fadf47, 544px 1270px #fadf47, 645px 679px #fadf47, 1499px 662px #fadf47, 1046px 982px #fadf47, 54px 883px #fadf47, 1583px 381px #fadf47, 1076px 944px #fadf47, 65px 1077px #fadf47, 251px 1478px #fadf47, 518px 1936px #fadf47, 72px 1112px #fadf47, 1906px 1663px #fadf47, 996px 442px #fadf47, 1330px 419px #fadf47, 1157px 1529px #fadf47, 1476px 1037px #fadf47, 855px 83px #fadf47, 808px 399px #fadf47, 1952px 1680px #fadf47, 445px 84px #fadf47, 977px 739px #fadf47, 1866px 458px #fadf47, 230px 293px #fadf47, 1414px 555px #fadf47, 292px 989px #fadf47, 1651px 1518px #fadf47, 1362px 1511px #fadf47, 471px 862px #fadf47, 383px 993px #fadf47, 685px 546px #fadf47, 1908px 1431px #fadf47, 1030px 107px #fadf47, 523px 141px #fadf47, 1734px 1409px #fadf47, 824px 991px #fadf47, 747px 1326px #fadf47, 1259px 1334px #fadf47, 805px 760px #fadf47, 308px 1130px #fadf47, 1511px 729px #fadf47, 137px 725px #fadf47, 1551px 893px #fadf47, 1177px 154px #fadf47, 1846px 1661px #fadf47, 484px 1096px #fadf47, 1691px 1521px #fadf47, 1598px 1910px #fadf47, 846px 468px #fadf47, 1739px 1771px #fadf47, 893px 945px #fadf47, 831px 407px #fadf47, 404px 310px #fadf47, 232px 1317px #fadf47, 1236px 1696px #fadf47, 1771px 457px #fadf47, 407px 1169px #fadf47, 74px 1125px #fadf47, 1376px 1865px #fadf47, 44px 836px #fadf47, 1948px 595px #fadf47, 188px 1258px #fadf47, 35px 1501px #fadf47, 629px 1069px #fadf47, 1603px 931px #fadf47, 489px 862px #fadf47, 1181px 1986px #fadf47, 1866px 1444px #fadf47, 1537px 303px #fadf47, 1952px 17px #fadf47, 13px 1240px #fadf47, 1307px 911px #fadf47, 1543px 1135px #fadf47, 1101px 1278px #fadf47, 1212px 1077px #fadf47, 1798px 1155px #fadf47, 1464px 342px #fadf47, 553px 1623px #fadf47, 207px 395px #fadf47, 683px 424px #fadf47, 586px 1770px #fadf47, 1265px 220px #fadf47, 357px 1815px #fadf47, 780px 1184px #fadf47, 877px 1904px #fadf47, 326px 1569px #fadf47, 1819px 1938px #fadf47, 1839px 503px #fadf47, 720px 1231px #fadf47, 640px 1084px #fadf47, 1122px 657px #fadf47, 725px 945px #fadf47, 992px 816px #fadf47, 1935px 851px #fadf47, 1074px 1686px #fadf47, 1160px 1438px #fadf47, 1259px 1905px #fadf47, 1120px 215px #fadf47, 92px 581px #fadf47, 932px 367px #fadf47, 1121px 523px #fadf47, 1273px 1866px #fadf47, 149px 140px #fadf47, 230px 1212px #fadf47, 1265px 1592px #fadf47, 1223px 654px #fadf47, 820px 1316px #fadf47, 1369px 1946px #fadf47, 319px 1164px #fadf47, 1058px 1973px #fadf47, 1756px 41px #fadf47, 740px 2000px #fadf47, 1241px 1914px #fadf47, 248px 171px #fadf47, 1657px 1915px #fadf47, 1662px 260px #fadf47, 1670px 736px #fadf47, 1877px 607px #fadf47, 396px 1058px #fadf47, 240px 599px #fadf47, 769px 1041px #fadf47, 940px 1436px #fadf47, 793px 632px #fadf47, 1350px 430px #fadf47, 1790px 1327px #fadf47, 865px 86px #fadf47, 988px 582px #fadf47, 1777px 1147px #fadf47, 901px 1543px #fadf47, 728px 1994px #fadf47, 83px 1893px #fadf47, 266px 195px #fadf47, 1545px 451px #fadf47, 311px 1659px #fadf47, 1612px 295px #fadf47, 1844px 651px #fadf47, 955px 1670px #fadf47, 1631px 494px #fadf47, 1754px 435px #fadf47, 1271px 488px #fadf47, 1859px 1892px #fadf47, 1631px 820px #fadf47, 1833px 1258px #fadf47, 316px 803px #fadf47, 116px 1875px #fadf47, 1620px 1284px #fadf47, 1767px 1850px #fadf47, 18px 574px #fadf47, 1857px 840px #fadf47, 184px 1498px #fadf47, 1389px 76px #fadf47, 27px 1974px #fadf47, 1795px 463px #fadf47, 619px 1001px #fadf47, 93px 1857px #fadf47, 393px 1722px #fadf47, 350px 396px #fadf47, 1789px 422px #fadf47, 1944px 1609px #fadf47, 24px 861px #fadf47, 1895px 1470px #fadf47, 1478px 1168px #fadf47, 122px 296px #fadf47, 1100px 592px #fadf47, 1561px 508px #fadf47, 572px 1016px #fadf47, 352px 94px #fadf47, 864px 1216px #fadf47, 1036px 948px #fadf47, 1706px 1829px #fadf47, 143px 77px #fadf47, 1031px 1600px #fadf47, 1028px 80px #fadf47, 1300px 1480px #fadf47, 1697px 1952px #fadf47, 1768px 1285px #fadf47, 730px 693px #fadf47, 1759px 919px #fadf47, 917px 1127px #fadf47, 1752px 581px #fadf47, 1614px 1205px #fadf47, 559px 1339px #fadf47, 1622px 255px #fadf47, 1700px 133px #fadf47, 663px 625px #fadf47, 1854px 1606px #fadf47, 254px 581px #fadf47, 1597px 551px #fadf47, 1092px 123px #fadf47, 788px 463px #fadf47, 1308px 531px #fadf47, 670px 569px #fadf47, 487px 1212px #fadf47, 1181px 1323px #fadf47, 1499px 1757px #fadf47, 1632px 543px #fadf47, 441px 1728px #fadf47, 838px 1005px #fadf47, 746px 252px #fadf47, 1000px 329px #fadf47, 613px 1185px #fadf47, 1457px 61px #fadf47, 1849px 1012px #fadf47, 1210px 674px #fadf47, 1138px 400px #fadf47, 1151px 1273px #fadf47, 537px 905px #fadf47, 317px 710px #fadf47, 408px 1697px #fadf47, 1056px 1349px #fadf47, 794px 987px #fadf47, 400px 838px #fadf47, 1667px 492px #fadf47, 942px 1739px #fadf47, 1085px 1870px #fadf47, 1899px 721px #fadf47, 681px 1373px #fadf47, 798px 392px #fadf47, 486px 1259px #fadf47, 460px 687px #fadf47, 959px 1491px #fadf47, 1821px 367px #fadf47, 730px 1532px #fadf47, 1202px 484px #fadf47, 212px 1375px #fadf47, 111px 20px #fadf47, 917px 1009px #fadf47, 990px 813px #fadf47, 470px 426px #fadf47, 1011px 753px #fadf47, 59px 461px #fadf47, 360px 1416px #fadf47, 698px 1073px #fadf47, 1206px 55px #fadf47, 107px 1179px #fadf47, 1062px 1462px #fadf47, 950px 1605px #fadf47, 1348px 1347px #fadf47, 1065px 287px #fadf47, 1425px 1861px #fadf47, 1118px 480px #fadf47, 180px 1031px #fadf47, 1101px 1822px #fadf47, 1514px 1370px #fadf47, 610px 1293px #fadf47, 397px 1510px #fadf47, 1975px 1389px #fadf47, 899px 1150px #fadf47, 1292px 496px #fadf47, 1798px 1882px #fadf47, 1904px 1476px #fadf47, 802px 1795px #fadf47, 1634px 1684px #fadf47, 743px 196px #fadf47, 1161px 963px #fadf47, 481px 821px #fadf47, 1559px 1292px #fadf47, 871px 1822px #fadf47, 782px 560px #fadf47, 1576px 767px #fadf47, 30px 1394px #fadf47, 1817px 863px #fadf47, 1783px 814px #fadf47, 20px 1976px #fadf47, 988px 1586px #fadf47, 1670px 212px #fadf47, 1332px 1203px #fadf47, 311px 614px #fadf47, 1562px 1617px #fadf47, 826px 1293px #fadf47, 283px 154px #fadf47, 1142px 1095px #fadf47, 1188px 67px #fadf47, 8px 625px #fadf47, 1917px 1534px #fadf47, 1800px 677px #fadf47, 620px 1687px #fadf47, 424px 192px #fadf47, 1205px 61px #fadf47, 704px 736px #fadf47, 1966px 1835px #fadf47, 1539px 216px #fadf47, 1372px 750px #fadf47, 1947px 540px #fadf47, 1839px 452px #fadf47, 1762px 695px #fadf47, 124px 588px #fadf47, 865px 1727px #fadf47, 800px 1704px #fadf47, 18px 1066px #fadf47, 1441px 1500px #fadf47, 10px 236px #fadf47, 1899px 594px #fadf47, 1607px 912px #fadf47, 25px 750px #fadf47, 628px 1612px #fadf47, 1902px 663px #fadf47, 1863px 1708px #fadf47, 1608px 1013px #fadf47, 1033px 1418px #fadf47, 1159px 1968px #fadf47, 1462px 338px #fadf47, 896px 123px #fadf47, 1002px 1102px #fadf47, 1140px 180px #fadf47, 1039px 970px #fadf47, 1032px 1561px #fadf47, 1783px 1206px #fadf47, 1993px 800px #fadf47, 909px 1938px #fadf47, 852px 388px #fadf47, 704px 1369px #fadf47, 479px 1639px #fadf47, 172px 638px #fadf47, 590px 804px #fadf47, 771px 1775px #fadf47, 794px 1040px #fadf47, 1972px 1781px #fadf47, 1313px 1733px #fadf47, 499px 1018px #fadf47, 1437px 940px #fadf47, 939px 1735px #fadf47, 895px 1967px #fadf47, 229px 204px #fadf47, 175px 401px #fadf47, 1094px 1186px #fadf47, 1813px 1864px #fadf47, 980px 1516px #fadf47, 1311px 469px #fadf47, 1883px 1344px #fadf47, 449px 1582px #fadf47, 1389px 1060px #fadf47, 1135px 1453px #fadf47, 1060px 1205px #fadf47, 1010px 205px #fadf47, 973px 1888px #fadf47, 1429px 969px #fadf47, 89px 1710px #fadf47, 1033px 1712px #fadf47, 1954px 818px #fadf47, 1497px 473px #fadf47, 161px 371px #fadf47, 349px 1793px #fadf47, 491px 1316px #fadf47, 47px 1290px #fadf47, 1419px 1999px #fadf47, 1248px 1790px #fadf47, 1269px 1237px #fadf47, 1398px 1005px #fadf47, 925px 926px #fadf47, 1143px 1962px #fadf47, 1054px 361px #fadf47, 1752px 274px #fadf47, 1825px 1855px #fadf47, 573px 191px #fadf47, 278px 657px #fadf47, 135px 516px #fadf47, 633px 1269px #fadf47, 794px 384px #fadf47, 404px 977px #fadf47, 1715px 754px #fadf47, 266px 660px #fadf47, 930px 1328px #fadf47, 711px 1828px #fadf47, 97px 1218px #fadf47, 133px 127px #fadf47, 726px 1931px #fadf47, 426px 447px #fadf47, 1284px 1312px #fadf47, 871px 618px #fadf47, 55px 1785px #fadf47, 1500px 1256px #fadf47, 648px 258px #fadf47, 1079px 156px #fadf47, 1523px 857px #fadf47, 468px 1339px #fadf47, 1387px 1034px #fadf47, 470px 431px #fadf47, 1390px 1700px #fadf47, 1699px 748px #fadf47, 1102px 74px #fadf47, 247px 950px #fadf47, 249px 1010px #fadf47, 832px 135px #fadf47, 139px 1120px #fadf47, 789px 300px #fadf47, 304px 1905px #fadf47, 1509px 1808px #fadf47, 657px 1940px #fadf47, 1864px 322px #fadf47, 1948px 531px #fadf47, 624px 1164px #fadf47, 1565px 1673px #fadf47, 742px 1655px #fadf47, 933px 674px #fadf47, 991px 1596px #fadf47, 1886px 654px #fadf47, 1657px 1656px #fadf47, 458px 928px #fadf47, 1196px 1253px #fadf47, 1697px 197px #fadf47, 571px 1512px #fadf47, 1891px 1658px #fadf47, 105px 1808px #fadf47, 1951px 27px #fadf47, 1234px 1326px #fadf47, 1141px 242px #fadf47, 102px 886px #fadf47, 1227px 770px #fadf47, 1580px 392px #fadf47, 1345px 709px #fadf47, 1325px 555px #fadf47, 562px 898px #fadf47, 1270px 479px #fadf47, 1839px 884px #fadf47, 1908px 14px #fadf47, 1357px 595px #fadf47, 212px 297px #fadf47, 647px 506px #fadf47, 1160px 1901px #fadf47, 1027px 1171px #fadf47, 1429px 1578px #fadf47, 9px 618px #fadf47, 121px 1954px #fadf47, 1692px 164px #fadf47, 1083px 1457px #fadf47, 1035px 742px #fadf47, 1163px 1566px #fadf47, 1144px 1385px #fadf47, 1211px 911px #fadf47, 1653px 813px #fadf47, 1090px 1570px #fadf47, 290px 1271px #fadf47, 746px 1329px #fadf47, 453px 1447px #fadf47, 1497px 1874px #fadf47, 1493px 1116px #fadf47, 845px 1742px #fadf47, 1165px 1999px #fadf47, 576px 563px #fadf47, 51px 404px #fadf47, 993px 770px #fadf47, 1997px 674px #fadf47, 1355px 1487px #fadf47, 1642px 146px #fadf47, 1160px 1718px #fadf47, 947px 235px #fadf47, 874px 1198px #fadf47, 1280px 1465px #fadf47, 373px 654px #fadf47, 1734px 608px #fadf47, 1699px 40px #fadf47, 122px 1568px #fadf47, 181px 1966px #fadf47, 9px 194px #fadf47, 59px 707px #fadf47, 871px 726px #fadf47, 220px 11px #fadf47, 1626px 1002px #fadf47, 877px 1749px #fadf47, 330px 300px #fadf47, 1515px 308px #fadf47, 876px 1509px #fadf47, 1016px 960px #fadf47, 113px 267px #fadf47, 747px 1859px #fadf47, 234px 906px #fadf47, 1687px 1601px #fadf47, 773px 844px #fadf47, 1812px 1479px #fadf47, 688px 1103px #fadf47, 1305px 71px #fadf47, 1276px 493px #fadf47, 843px 1434px #fadf47, 6px 1435px #fadf47, 1848px 508px #fadf47, 1101px 240px #fadf47, 1974px 1952px #fadf47, 1072px 406px #fadf47, 697px 1196px #fadf47, 988px 256px #fadf47, 501px 582px #fadf47, 460px 1825px #fadf47, 1912px 1029px #fadf47, 1829px 1728px #fadf47, 405px 190px #fadf47, 1930px 1454px #fadf47, 1524px 1997px #fadf47, 721px 1573px #fadf47, 1715px 1977px #fadf47, 1003px 452px #fadf47, 1200px 1844px #fadf47, 1532px 986px #fadf47, 1631px 1912px #fadf47, 1521px 1236px #fadf47, 1862px 1939px #fadf47, 490px 259px #fadf47, 991px 929px #fadf47, 1770px 96px #fadf47, 599px 1502px #fadf47, 1269px 1762px #fadf47, 1745px 1873px #fadf47, 1462px 1727px #fadf47, 1271px 532px #fadf47, 1544px 1172px #fadf47, 142px 1744px #fadf47, 521px 941px #fadf47, 596px 879px #fadf47, 985px 427px #fadf47, 1691px 1653px #fadf47;
+}
+
+#coins2 {
+  width: 2px;
+  height: 2px;
+  background: transparent;
+  box-shadow: 1840px 921px #fadf47, 782px 1464px #fadf47, 915px 948px #fadf47, 205px 1621px #fadf47, 494px 1474px #fadf47, 884px 432px #fadf47, 754px 1413px #fadf47, 1295px 1139px #fadf47, 731px 1000px #fadf47, 110px 165px #fadf47, 1909px 1819px #fadf47, 664px 1644px #fadf47, 934px 1356px #fadf47, 1285px 1092px #fadf47, 1644px 1772px #fadf47, 1720px 2px #fadf47, 959px 1515px #fadf47, 1559px 1293px #fadf47, 1983px 1591px #fadf47, 1739px 1373px #fadf47, 1397px 1801px #fadf47, 167px 506px #fadf47, 1580px 860px #fadf47, 1963px 1478px #fadf47, 403px 860px #fadf47, 1126px 451px #fadf47, 886px 237px #fadf47, 1233px 729px #fadf47, 1724px 843px #fadf47, 1695px 1257px #fadf47, 1353px 322px #fadf47, 715px 484px #fadf47, 589px 952px #fadf47, 1099px 1406px #fadf47, 1766px 914px #fadf47, 393px 106px #fadf47, 509px 1044px #fadf47, 1550px 1583px #fadf47, 559px 185px #fadf47, 1976px 274px #fadf47, 148px 1832px #fadf47, 1157px 403px #fadf47, 45px 1276px #fadf47, 340px 1037px #fadf47, 1349px 854px #fadf47, 1183px 44px #fadf47, 1238px 34px #fadf47, 1397px 1014px #fadf47, 427px 847px #fadf47, 1300px 705px #fadf47, 1320px 605px #fadf47, 295px 39px #fadf47, 732px 1926px #fadf47, 767px 1117px #fadf47, 1047px 1642px #fadf47, 860px 658px #fadf47, 174px 1905px #fadf47, 1287px 1413px #fadf47, 894px 1692px #fadf47, 105px 1072px #fadf47, 610px 938px #fadf47, 156px 509px #fadf47, 1160px 1231px #fadf47, 1561px 1342px #fadf47, 1217px 1246px #fadf47, 1878px 114px #fadf47, 1992px 1771px #fadf47, 227px 499px #fadf47, 648px 502px #fadf47, 1691px 1690px #fadf47, 1299px 935px #fadf47, 1143px 1155px #fadf47, 1499px 972px #fadf47, 531px 1008px #fadf47, 611px 741px #fadf47, 1358px 986px #fadf47, 933px 1494px #fadf47, 1135px 744px #fadf47, 1546px 1936px #fadf47, 974px 290px #fadf47, 1319px 1210px #fadf47, 791px 735px #fadf47, 198px 73px #fadf47, 330px 1378px #fadf47, 81px 637px #fadf47, 347px 758px #fadf47, 1059px 1818px #fadf47, 1731px 1363px #fadf47, 1305px 45px #fadf47, 1693px 226px #fadf47, 141px 1576px #fadf47, 1119px 1694px #fadf47, 1872px 384px #fadf47, 364px 1057px #fadf47, 1267px 485px #fadf47, 1587px 1641px #fadf47, 1817px 1487px #fadf47, 871px 613px #fadf47, 801px 1945px #fadf47, 1306px 1551px #fadf47, 1413px 72px #fadf47, 414px 1792px #fadf47, 211px 260px #fadf47, 1481px 1903px #fadf47, 117px 18px #fadf47, 499px 543px #fadf47, 1952px 638px #fadf47, 828px 202px #fadf47, 1923px 796px #fadf47, 308px 1151px #fadf47, 1430px 611px #fadf47, 135px 1591px #fadf47, 268px 1131px #fadf47, 1729px 1736px #fadf47, 353px 82px #fadf47, 307px 576px #fadf47, 943px 1105px #fadf47, 1388px 1408px #fadf47, 51px 77px #fadf47, 206px 1469px #fadf47, 1575px 307px #fadf47, 1166px 1445px #fadf47, 819px 1288px #fadf47, 908px 850px #fadf47, 1840px 1467px #fadf47, 176px 366px #fadf47, 448px 1817px #fadf47, 1729px 279px #fadf47, 189px 1446px #fadf47, 1407px 1899px #fadf47, 950px 789px #fadf47, 1618px 1294px #fadf47, 227px 353px #fadf47, 1481px 1774px #fadf47, 955px 649px #fadf47, 1792px 1445px #fadf47, 1667px 794px #fadf47, 1468px 1834px #fadf47, 1407px 1645px #fadf47, 762px 1683px #fadf47, 785px 1314px #fadf47, 1231px 468px #fadf47, 1125px 1751px #fadf47, 1503px 1046px #fadf47, 390px 1813px #fadf47, 1509px 1619px #fadf47, 657px 76px #fadf47, 1731px 1530px #fadf47, 1542px 1692px #fadf47, 1109px 217px #fadf47, 1548px 900px #fadf47, 1716px 531px #fadf47, 1533px 839px #fadf47, 1196px 42px #fadf47, 1553px 738px #fadf47, 936px 526px #fadf47, 766px 356px #fadf47, 873px 1371px #fadf47, 439px 341px #fadf47, 1061px 607px #fadf47, 1635px 548px #fadf47, 1138px 1993px #fadf47, 1388px 1231px #fadf47, 186px 785px #fadf47, 1063px 360px #fadf47, 1068px 501px #fadf47, 1561px 903px #fadf47, 1403px 517px #fadf47, 1775px 1636px #fadf47, 388px 67px #fadf47, 1568px 1149px #fadf47, 116px 837px #fadf47, 1426px 27px #fadf47, 436px 537px #fadf47, 872px 1121px #fadf47, 73px 937px #fadf47, 690px 302px #fadf47, 981px 188px #fadf47, 1638px 1256px #fadf47, 168px 1940px #fadf47, 1702px 55px #fadf47, 1911px 1877px #fadf47, 1349px 1203px #fadf47, 1648px 1902px #fadf47, 611px 1033px #fadf47, 1206px 1212px #fadf47, 583px 1070px #fadf47, 629px 501px #fadf47, 1150px 579px #fadf47, 629px 1929px #fadf47, 941px 225px #fadf47, 72px 446px #fadf47, 1964px 69px #fadf47, 1498px 863px #fadf47, 1912px 331px #fadf47, 594px 1870px #fadf47, 1538px 1284px #fadf47, 1744px 1288px #fadf47, 1850px 1172px #fadf47, 1688px 327px #fadf47;
+  animation: animCoins 50s linear infinite;
+}
+
+#coins2:after {
+  content: " ";
+  position: absolute;
+  top: 2000px;
+  width: 2px;
+  height: 2px;
+  background: transparent;
+  box-shadow: 1840px 921px #fadf47, 782px 1464px #fadf47, 915px 948px #fadf47, 205px 1621px #fadf47, 494px 1474px #fadf47, 884px 432px #fadf47, 754px 1413px #fadf47, 1295px 1139px #fadf47, 731px 1000px #fadf47, 110px 165px #fadf47, 1909px 1819px #fadf47, 664px 1644px #fadf47, 934px 1356px #fadf47, 1285px 1092px #fadf47, 1644px 1772px #fadf47, 1720px 2px #fadf47, 959px 1515px #fadf47, 1559px 1293px #fadf47, 1983px 1591px #fadf47, 1739px 1373px #fadf47, 1397px 1801px #fadf47, 167px 506px #fadf47, 1580px 860px #fadf47, 1963px 1478px #fadf47, 403px 860px #fadf47, 1126px 451px #fadf47, 886px 237px #fadf47, 1233px 729px #fadf47, 1724px 843px #fadf47, 1695px 1257px #fadf47, 1353px 322px #fadf47, 715px 484px #fadf47, 589px 952px #fadf47, 1099px 1406px #fadf47, 1766px 914px #fadf47, 393px 106px #fadf47, 509px 1044px #fadf47, 1550px 1583px #fadf47, 559px 185px #fadf47, 1976px 274px #fadf47, 148px 1832px #fadf47, 1157px 403px #fadf47, 45px 1276px #fadf47, 340px 1037px #fadf47, 1349px 854px #fadf47, 1183px 44px #fadf47, 1238px 34px #fadf47, 1397px 1014px #fadf47, 427px 847px #fadf47, 1300px 705px #fadf47, 1320px 605px #fadf47, 295px 39px #fadf47, 732px 1926px #fadf47, 767px 1117px #fadf47, 1047px 1642px #fadf47, 860px 658px #fadf47, 174px 1905px #fadf47, 1287px 1413px #fadf47, 894px 1692px #fadf47, 105px 1072px #fadf47, 610px 938px #fadf47, 156px 509px #fadf47, 1160px 1231px #fadf47, 1561px 1342px #fadf47, 1217px 1246px #fadf47, 1878px 114px #fadf47, 1992px 1771px #fadf47, 227px 499px #fadf47, 648px 502px #fadf47, 1691px 1690px #fadf47, 1299px 935px #fadf47, 1143px 1155px #fadf47, 1499px 972px #fadf47, 531px 1008px #fadf47, 611px 741px #fadf47, 1358px 986px #fadf47, 933px 1494px #fadf47, 1135px 744px #fadf47, 1546px 1936px #fadf47, 974px 290px #fadf47, 1319px 1210px #fadf47, 791px 735px #fadf47, 198px 73px #fadf47, 330px 1378px #fadf47, 81px 637px #fadf47, 347px 758px #fadf47, 1059px 1818px #fadf47, 1731px 1363px #fadf47, 1305px 45px #fadf47, 1693px 226px #fadf47, 141px 1576px #fadf47, 1119px 1694px #fadf47, 1872px 384px #fadf47, 364px 1057px #fadf47, 1267px 485px #fadf47, 1587px 1641px #fadf47, 1817px 1487px #fadf47, 871px 613px #fadf47, 801px 1945px #fadf47, 1306px 1551px #fadf47, 1413px 72px #fadf47, 414px 1792px #fadf47, 211px 260px #fadf47, 1481px 1903px #fadf47, 117px 18px #fadf47, 499px 543px #fadf47, 1952px 638px #fadf47, 828px 202px #fadf47, 1923px 796px #fadf47, 308px 1151px #fadf47, 1430px 611px #fadf47, 135px 1591px #fadf47, 268px 1131px #fadf47, 1729px 1736px #fadf47, 353px 82px #fadf47, 307px 576px #fadf47, 943px 1105px #fadf47, 1388px 1408px #fadf47, 51px 77px #fadf47, 206px 1469px #fadf47, 1575px 307px #fadf47, 1166px 1445px #fadf47, 819px 1288px #fadf47, 908px 850px #fadf47, 1840px 1467px #fadf47, 176px 366px #fadf47, 448px 1817px #fadf47, 1729px 279px #fadf47, 189px 1446px #fadf47, 1407px 1899px #fadf47, 950px 789px #fadf47, 1618px 1294px #fadf47, 227px 353px #fadf47, 1481px 1774px #fadf47, 955px 649px #fadf47, 1792px 1445px #fadf47, 1667px 794px #fadf47, 1468px 1834px #fadf47, 1407px 1645px #fadf47, 762px 1683px #fadf47, 785px 1314px #fadf47, 1231px 468px #fadf47, 1125px 1751px #fadf47, 1503px 1046px #fadf47, 390px 1813px #fadf47, 1509px 1619px #fadf47, 657px 76px #fadf47, 1731px 1530px #fadf47, 1542px 1692px #fadf47, 1109px 217px #fadf47, 1548px 900px #fadf47, 1716px 531px #fadf47, 1533px 839px #fadf47, 1196px 42px #fadf47, 1553px 738px #fadf47, 936px 526px #fadf47, 766px 356px #fadf47, 873px 1371px #fadf47, 439px 341px #fadf47, 1061px 607px #fadf47, 1635px 548px #fadf47, 1138px 1993px #fadf47, 1388px 1231px #fadf47, 186px 785px #fadf47, 1063px 360px #fadf47, 1068px 501px #fadf47, 1561px 903px #fadf47, 1403px 517px #fadf47, 1775px 1636px #fadf47, 388px 67px #fadf47, 1568px 1149px #fadf47, 116px 837px #fadf47, 1426px 27px #fadf47, 436px 537px #fadf47, 872px 1121px #fadf47, 73px 937px #fadf47, 690px 302px #fadf47, 981px 188px #fadf47, 1638px 1256px #fadf47, 168px 1940px #fadf47, 1702px 55px #fadf47, 1911px 1877px #fadf47, 1349px 1203px #fadf47, 1648px 1902px #fadf47, 611px 1033px #fadf47, 1206px 1212px #fadf47, 583px 1070px #fadf47, 629px 501px #fadf47, 1150px 579px #fadf47, 629px 1929px #fadf47, 941px 225px #fadf47, 72px 446px #fadf47, 1964px 69px #fadf47, 1498px 863px #fadf47, 1912px 331px #fadf47, 594px 1870px #fadf47, 1538px 1284px #fadf47, 1744px 1288px #fadf47, 1850px 1172px #fadf47, 1688px 327px #fadf47;
+}
+
+#coins3 {
+  width: 3px;
+  height: 3px;
+  background: transparent;
+  box-shadow: 1360px 1075px #fadf47, 1012px 365px #fadf47, 1613px 679px #fadf47, 1254px 492px #fadf47, 1569px 612px #fadf47, 1344px 1408px #fadf47, 292px 1890px #fadf47, 883px 1678px #fadf47, 1589px 1585px #fadf47, 282px 822px #fadf47, 765px 453px #fadf47, 1475px 1887px #fadf47, 1779px 824px #fadf47, 833px 425px #fadf47, 1308px 1311px #fadf47, 1167px 816px #fadf47, 813px 68px #fadf47, 42px 559px #fadf47, 248px 487px #fadf47, 547px 1033px #fadf47, 1672px 1578px #fadf47, 1824px 1714px #fadf47, 1140px 63px #fadf47, 884px 441px #fadf47, 427px 843px #fadf47, 184px 657px #fadf47, 1796px 1296px #fadf47, 37px 242px #fadf47, 836px 1324px #fadf47, 555px 1410px #fadf47, 1759px 230px #fadf47, 1680px 1130px #fadf47, 319px 443px #fadf47, 1636px 444px #fadf47, 612px 1327px #fadf47, 652px 1229px #fadf47, 1623px 1181px #fadf47, 862px 1749px #fadf47, 1552px 1262px #fadf47, 695px 472px #fadf47, 1816px 1500px #fadf47, 463px 632px #fadf47, 314px 1335px #fadf47, 571px 1029px #fadf47, 366px 771px #fadf47, 214px 1283px #fadf47, 763px 81px #fadf47, 294px 1445px #fadf47, 238px 788px #fadf47, 1203px 687px #fadf47, 1278px 1892px #fadf47, 1116px 1736px #fadf47, 920px 790px #fadf47, 1098px 374px #fadf47, 628px 622px #fadf47, 747px 1054px #fadf47, 669px 1651px #fadf47, 255px 1825px #fadf47, 824px 733px #fadf47, 714px 158px #fadf47, 1535px 1718px #fadf47, 1px 186px #fadf47, 1811px 654px #fadf47, 253px 167px #fadf47, 1844px 24px #fadf47, 81px 1236px #fadf47, 1862px 225px #fadf47, 234px 396px #fadf47, 803px 719px #fadf47, 1428px 1242px #fadf47, 1763px 1169px #fadf47, 793px 1104px #fadf47, 473px 748px #fadf47, 1253px 1104px #fadf47, 1760px 703px #fadf47, 715px 428px #fadf47, 887px 564px #fadf47, 800px 1531px #fadf47, 76px 1330px #fadf47, 816px 1968px #fadf47, 940px 1413px #fadf47, 936px 871px #fadf47, 1415px 1257px #fadf47, 1595px 1042px #fadf47, 910px 248px #fadf47, 519px 353px #fadf47, 1414px 1334px #fadf47, 1167px 242px #fadf47, 535px 654px #fadf47, 492px 1553px #fadf47, 1340px 868px #fadf47, 874px 110px #fadf47, 1729px 109px #fadf47, 36px 1466px #fadf47, 137px 475px #fadf47, 622px 1917px #fadf47, 977px 525px #fadf47, 1957px 1364px #fadf47, 352px 1327px #fadf47, 746px 1922px #fadf47;
+  animation: animCoins 60s linear infinite;
+}
+
+#coins3:after {
+  content: " ";
+  position: absolute;
+  top: 2000px;
+  width: 3px;
+  height: 3px;
+  background: transparent;
+  box-shadow: 1360px 1075px #fadf47, 1012px 365px #fadf47, 1613px 679px #fadf47, 1254px 492px #fadf47, 1569px 612px #fadf47, 1344px 1408px #fadf47, 292px 1890px #fadf47, 883px 1678px #fadf47, 1589px 1585px #fadf47, 282px 822px #fadf47, 765px 453px #fadf47, 1475px 1887px #fadf47, 1779px 824px #fadf47, 833px 425px #fadf47, 1308px 1311px #fadf47, 1167px 816px #fadf47, 813px 68px #fadf47, 42px 559px #fadf47, 248px 487px #fadf47, 547px 1033px #fadf47, 1672px 1578px #fadf47, 1824px 1714px #fadf47, 1140px 63px #fadf47, 884px 441px #fadf47, 427px 843px #fadf47, 184px 657px #fadf47, 1796px 1296px #fadf47, 37px 242px #fadf47, 836px 1324px #fadf47, 555px 1410px #fadf47, 1759px 230px #fadf47, 1680px 1130px #fadf47, 319px 443px #fadf47, 1636px 444px #fadf47, 612px 1327px #fadf47, 652px 1229px #fadf47, 1623px 1181px #fadf47, 862px 1749px #fadf47, 1552px 1262px #fadf47, 695px 472px #fadf47, 1816px 1500px #fadf47, 463px 632px #fadf47, 314px 1335px #fadf47, 571px 1029px #fadf47, 366px 771px #fadf47, 214px 1283px #fadf47, 763px 81px #fadf47, 294px 1445px #fadf47, 238px 788px #fadf47, 1203px 687px #fadf47, 1278px 1892px #fadf47, 1116px 1736px #fadf47, 920px 790px #fadf47, 1098px 374px #fadf47, 628px 622px #fadf47, 747px 1054px #fadf47, 669px 1651px #fadf47, 255px 1825px #fadf47, 824px 733px #fadf47, 714px 158px #fadf47, 1535px 1718px #fadf47, 1px 186px #fadf47, 1811px 654px #fadf47, 253px 167px #fadf47, 1844px 24px #fadf47, 81px 1236px #fadf47, 1862px 225px #fadf47, 234px 396px #fadf47, 803px 719px #fadf47, 1428px 1242px #fadf47, 1763px 1169px #fadf47, 793px 1104px #fadf47, 473px 748px #fadf47, 1253px 1104px #fadf47, 1760px 703px #fadf47, 715px 428px #fadf47, 887px 564px #fadf47, 800px 1531px #fadf47, 76px 1330px #fadf47, 816px 1968px #fadf47, 940px 1413px #fadf47, 936px 871px #fadf47, 1415px 1257px #fadf47, 1595px 1042px #fadf47, 910px 248px #fadf47, 519px 353px #fadf47, 1414px 1334px #fadf47, 1167px 242px #fadf47, 535px 654px #fadf47, 492px 1553px #fadf47, 1340px 868px #fadf47, 874px 110px #fadf47, 1729px 109px #fadf47, 36px 1466px #fadf47, 137px 475px #fadf47, 622px 1917px #fadf47, 977px 525px #fadf47, 1957px 1364px #fadf47, 352px 1327px #fadf47, 746px 1922px #fadf47;
+}
+
+@keyframes animCoins {
+  from {
+    transform: translateY(0px);
+  }
+
+  to {
+    transform: translateY(-2000px);
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/components/modals/Modal.vue b/src/components/modals/Modal.vue
index 38ba8b7..b2f78d7 100644
--- a/src/components/modals/Modal.vue
+++ b/src/components/modals/Modal.vue
@@ -1,5 +1,4 @@
 <script setup>
-import { boolean } from '@telegram-apps/sdk';
 import { ref, defineProps, defineEmits } from 'vue';
 
 const props = defineProps({
@@ -15,9 +14,17 @@ const props = defineProps({
     type: Boolean,
     default: true,
   },
+  confirmButtonText: {
+    type: String,
+    default: 'Confirm'
+  },
   cancelButtonText: {
     type: String,
     default: 'Cancel'
+  },
+  hideTitle: {
+    type: Boolean,
+    default: false,
   }
 });
 
@@ -35,17 +42,17 @@ const confirm = () => {
 <template>
   <div v-if="isOpen" class="fixed inset-0 z-50 flex items-center justify-center bg-black bg-opacity-50">
     <div class="p-8 rounded-lg bg-zinc-800 shadow-lg w-[90%]">
-      <header class="flex justify-center items-center mb-4">
-        <h2 class="text-xl font-semibold font-mono uppercase">{{ title }}</h2>
+      <header class="flex justify-center items-center mb-4" v-if="!hideTitle">
+        <h2 class="text-xl font-semibold uppercase">{{ title }}</h2>
       </header>
       <div class="mb-10">
         <slot></slot>
       </div>
-      <footer class="flex justify-center">
-        <button @click="close"
-          class="text-white uppercase bg-gray-500 px-5 py-2 rounded-md hover:bg-gray-800 font-mono">{{ cancelButtonText }}</button>
+      <footer class="flex flex-col justify-center">
         <button v-if="confirmButtonEnabled" @click="confirm"
-          class="text-white uppercase bg-red-800 ml-3 px-5 py-2 rounded-md hover:bg-red-950 font-mono">Confirm</button>
+          class="text-white bg-blue-800 px-5 py-2 rounded-md hover:bg-blue-950">{{ confirmButtonText }}</button>
+        <button @click="close"
+          class="text-white mt-2 px-5 py-2 rounded-md hover:bg-gray-800" :class="{'bg-red-800': !confirmButtonEnabled, 'bg-gray-500': confirmButtonEnabled}">{{ cancelButtonText }}</button>
       </footer>
     </div>
   </div>
diff --git a/src/components/views/Home.vue b/src/components/views/Home.vue
index 178a82d..705cf21 100644
--- a/src/components/views/Home.vue
+++ b/src/components/views/Home.vue
@@ -13,14 +13,21 @@ const hapticFeedback = initHapticFeedback();
 
 const amount = ref(1);
 
+const currentBalance = ref(0);
+
 const modalOpen = ref(false);
 const modalTitle = ref('');
 const modalDescription = ref('');
 
+const min_bet = ref(1)
+const max_bet = ref(10);
+
+let lastTransactionId = null;
+
 const openModal = () => {
   modalOpen.value = true;
-  modalTitle.value = "Modal title";
-  modalDescription.value = "Modal description";
+  modalTitle.value = "Bet placed!";
+  modalDescription.value = "See the transaction on Tonviewer: ";
 }
 
 let isFlipping = false;
@@ -29,25 +36,34 @@ let currentDegrees = 0;
 const playGame = async () => {
   if (isFlipping) return;
 
-  const betResult = await store.telegram.playGame(amount.value);
+  lastTransactionId = await store.telegram.playGame(amount.value);
 
-  coin.classList.add("flipping");
-  isFlipping = true;
-
-  const random = Math.floor(Math.random() * 4 + parseInt(betResult));
+  modalOpen.value = true;
+  modalTitle.value = "Bet placed!";
 
-  currentDegrees += 180 * random;
+  currentBalance.value = await store.telegram.getWalletBalance();
+}
 
-  coin.style.transform = `rotateY(${currentDegrees}deg)`;
+const viewTransaction = () => {
+  window.open(
+    'https://tonviewer.com/transaction/' + lastTransactionId,
+    '_blank'
+  )
 
-  setTimeout(() => {
-    isFlipping = false;
-    coin.classList.remove("flipping");
-  }, 5000);
+  modalOpen.value = false;
 }
 
 onMounted(async () => {
   await store.telegram.initConnectWalletButton('ton-connect-button')
+
+  const config = await store.telegram.getData();
+
+  min_bet.value = config.min_bet;
+  max_bet.value = config.max_bet;
+
+  amount.value = config.min_bet;
+
+  currentBalance.value = await store.telegram.getWalletBalance();
 });
 </script>
 
@@ -58,47 +74,55 @@ onMounted(async () => {
     </div>
     <div class="flex flex-col justify-center content-center">
       <div class="flex justify-center">
-        <div id="coin">
-          <div id="front"><img src="/icon.png" class="pulse w-[60vw]"></div>
-          <div id="back"><img src="/loser.png" class="pulse w-[60vw]"></div>
+        <div>
+          <div id="front"><img src="/icon.png" class="pulse h-[30vh]"></div>
         </div>
       </div>
       <div class="mt-6">
         <form class="max-w-xs mx-auto">
-          <label for="quantity-input" class="block mb-2 text-sm font-medium text-white">Your bet:</label>
+          <label for="quantity-input" class="block mb-2 text-sm font-medium uppercase text-white">Your bet</label>
           <div class="flex justify-center">
             <div class="relative flex items-center max-w-[8rem]">
-              <button type="button" @click="amount--"
-                class="bg-blue-800 0 border-blue-900 rounded-s-lg p-3 h-11 focus:ring-blue-700 dark:focus:ring-blue-700 focus:ring-2 focus:outline-none">
-                <svg class="w-3 h-3 text-gray-900 dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
+
+              <button type="button" @click="amount--" class="bg-blue-800 0 border-blue-900 rounded-s-lg p-3 h-11 mr-1">
+                <svg class="w-3 h-3 text-white dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
                   fill="none" viewBox="0 0 18 2">
                   <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                     d="M1 1h16" />
                 </svg>
               </button>
+
               <input type="number" v-model="amount" data-input-counter aria-describedby="helper-text-explanation"
-                class="bg-blue-50 border-x-0 border-blue-300 h-11 text-center text-gray-900 font-bold text-sm focus:ring-blue-500 focus:border-blue-500 block w-full py-2.5 dark:bg-blue-700 dark:border-blue-600 dark:placeholder-blue-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+                class="bg-blue-50 border-x-0 h-11 focus:border-none text-center text-gray-900 font-bold text-sm block w-full py-2.5"
                 placeholder="1" required />
-              <button type="button" @click="amount++"
-                class="bg-blue-800 0 border-blue-900 rounded-e-lg p-3 h-11 focus:ring-blue-700 dark:focus:ring-blue-700 focus:ring-2 focus:outline-none">
-                <svg class="w-3 h-3 text-gray-900 dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
+
+              <button type="button" @click="amount++" class="bg-blue-800 0 border-blue-900 rounded-e-lg p-3 h-11 ml-1">
+                <svg class="w-3 h-3 text-white dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
                   fill="none" viewBox="0 0 18 18">
                   <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                     d="M9 1v16M1 9h16" />
                 </svg>
               </button>
+
             </div>
           </div>
 
-          <p id="helper-text-explanation" class="mt-4 text-sm text-gray-400">Min: 1 TON</p>
-          <p id="helper-text-explanation" class="text-sm text-gray-400">Max: 10 TON</p>
+          <p id="helper-text-explanation" class="mt-4 text-sm text-gray-400">Min: {{ min_bet }} TON - Max: {{ max_bet }}
+            TON</p>
         </form>
 
         <div class="mt-5">
           <Button @click="playGame()" :disabled="!store.telegram.walletAccount">
-            Bet
+            Place your bet
           </Button>
         </div>
+
+
+        <div v-if="store.telegram.walletAccount" class="mt-8 text-xs">
+          <div class="font-black uppercase text-[10px]">Your balance</div>
+          <div class="font-black text-lg">{{ currentBalance }} TON</div>
+        </div>
+
         <div v-if="!store.telegram.walletAccount" class="mt-4 text-xs text-orange-500">
           Connect your TON wallet to play
         </div>
@@ -109,8 +133,8 @@ onMounted(async () => {
     </div>
   </div>
 
-  <Modal :isOpen="modalOpen" @close="modalOpen = false" :confirmButtonEnabled="false" :cancelButtonText="'Ok'"
-    :title="modalTitle">
+  <Modal :isOpen="modalOpen" @confirm="viewTransaction()" :confirmButtonEnabled="true" @close="modalOpen = false"
+    :confirmButtonText="'View it on Tonviewer'" :cancelButtonText="'Close'" :title="modalTitle">
     <p class="text-center">
       {{ modalDescription }}
     </p>
diff --git a/src/wrappers/TonConnectSender.ts b/src/wrappers/TonConnectSender.ts
index 0601c66..539e0c8 100644
--- a/src/wrappers/TonConnectSender.ts
+++ b/src/wrappers/TonConnectSender.ts
@@ -1,10 +1,12 @@
 import { Address, beginCell, Sender, SenderArguments, SendMode, storeStateInit } from "@ton/ton";
-import { TonConnectUI } from "@tonconnect/ui";
+import { SendTransactionResponse, TonConnectUI } from "@tonconnect/ui";
 
 export class TonConnectSender implements Sender {
   #provider: TonConnectUI;
   readonly address?: Address;
 
+  lastTransactionResponse?: SendTransactionResponse;
+
   constructor(provider: TonConnectUI) {
     this.#provider = provider;
     if (provider.wallet) this.address = Address.parseRaw(provider.wallet?.account.address);
@@ -16,7 +18,7 @@ export class TonConnectSender implements Sender {
       throw new Error("Deployer sender does not support `sendMode` other than `PAY_GAS_SEPARATELY`");
     }
 
-    await this.#provider.sendTransaction({
+    this.lastTransactionResponse = await this.#provider.sendTransaction({
       validUntil: Date.now() + 5 * 60 * 1000,
       messages: [
         {

From 80f2f62f722a5e4fffbc00c99a6debb2fa3f5046 Mon Sep 17 00:00:00 2001
From: Claudio La Barbera <claudio.labarbera@everli.com>
Date: Wed, 11 Sep 2024 02:15:17 +0200
Subject: [PATCH 02/11] fix: buttons

---
 src/components/views/Home.vue | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/src/components/views/Home.vue b/src/components/views/Home.vue
index 705cf21..c313136 100644
--- a/src/components/views/Home.vue
+++ b/src/components/views/Home.vue
@@ -53,6 +53,14 @@ const viewTransaction = () => {
   modalOpen.value = false;
 }
 
+const incrementAmount = () => {
+  amount.value += 0.1;
+}
+
+const decrementAmount = () => {
+  amount.value -= 0.1;
+}
+
 onMounted(async () => {
   await store.telegram.initConnectWalletButton('ton-connect-button')
 
@@ -84,7 +92,7 @@ onMounted(async () => {
           <div class="flex justify-center">
             <div class="relative flex items-center max-w-[8rem]">
 
-              <button type="button" @click="amount--" class="bg-blue-800 0 border-blue-900 rounded-s-lg p-3 h-11 mr-1">
+              <button type="button" @click="incrementAmount()" class="bg-blue-800 0 border-blue-900 rounded-s-lg p-3 h-11 mr-1">
                 <svg class="w-3 h-3 text-white dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
                   fill="none" viewBox="0 0 18 2">
                   <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
@@ -96,7 +104,7 @@ onMounted(async () => {
                 class="bg-blue-50 border-x-0 h-11 focus:border-none text-center text-gray-900 font-bold text-sm block w-full py-2.5"
                 placeholder="1" required />
 
-              <button type="button" @click="amount++" class="bg-blue-800 0 border-blue-900 rounded-e-lg p-3 h-11 ml-1">
+              <button type="button" @click="decrementAmount()" class="bg-blue-800 0 border-blue-900 rounded-e-lg p-3 h-11 ml-1">
                 <svg class="w-3 h-3 text-white dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
                   fill="none" viewBox="0 0 18 18">
                   <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"

From 919634152ddd1e6474d5a4679b9a52351ee60580 Mon Sep 17 00:00:00 2001
From: Claudio La Barbera <claudio.labarbera@everli.com>
Date: Wed, 11 Sep 2024 02:16:57 +0200
Subject: [PATCH 03/11] fix: buttons

---
 src/components/views/Home.vue | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/components/views/Home.vue b/src/components/views/Home.vue
index c313136..ad51059 100644
--- a/src/components/views/Home.vue
+++ b/src/components/views/Home.vue
@@ -54,11 +54,15 @@ const viewTransaction = () => {
 }
 
 const incrementAmount = () => {
-  amount.value += 0.1;
+  if(amount.value + 0.1 <= max_bet) {
+    amount.value += 0.1;
+  }
 }
 
 const decrementAmount = () => {
-  amount.value -= 0.1;
+  if(amount.value - 0.1 >= min_bet) {
+    amount.value -= 0.1;
+  }
 }
 
 onMounted(async () => {

From 774df74f9db948677ce154342f4901ce75b25082 Mon Sep 17 00:00:00 2001
From: Claudio La Barbera <claudio.labarbera@everli.com>
Date: Wed, 11 Sep 2024 02:47:36 +0200
Subject: [PATCH 04/11] fix: buttons

---
 src/components/views/Home.vue | 46 +++++++++++++++++++++++++++--------
 1 file changed, 36 insertions(+), 10 deletions(-)

diff --git a/src/components/views/Home.vue b/src/components/views/Home.vue
index ad51059..b3d56b1 100644
--- a/src/components/views/Home.vue
+++ b/src/components/views/Home.vue
@@ -22,6 +22,8 @@ const modalDescription = ref('');
 const min_bet = ref(1)
 const max_bet = ref(10);
 
+const loading = ref(false);
+
 let lastTransactionId = null;
 
 const openModal = () => {
@@ -54,14 +56,15 @@ const viewTransaction = () => {
 }
 
 const incrementAmount = () => {
-  if(amount.value + 0.1 <= max_bet) {
-    amount.value += 0.1;
+  console.log('increment');
+  if (amount.value + 0.1 <= (max_bet.value)) {
+    amount.value = (amount.value + 0.1)
   }
 }
 
 const decrementAmount = () => {
-  if(amount.value - 0.1 >= min_bet) {
-    amount.value -= 0.1;
+  if (amount.value - 0.1 >= (min_bet.value)) {
+    amount.value = (amount.value - 0.1)
   }
 }
 
@@ -73,9 +76,15 @@ onMounted(async () => {
   min_bet.value = config.min_bet;
   max_bet.value = config.max_bet;
 
-  amount.value = config.min_bet;
+  amount.value = parseFloat(config.min_bet);
 
   currentBalance.value = await store.telegram.getWalletBalance();
+
+  setInterval(async () => {
+    loading.value = true;
+    currentBalance.value = await store.telegram.getWalletBalance();
+    loading.value = false;
+  }, 3000);
 });
 </script>
 
@@ -96,25 +105,27 @@ onMounted(async () => {
           <div class="flex justify-center">
             <div class="relative flex items-center max-w-[8rem]">
 
-              <button type="button" @click="incrementAmount()" class="bg-blue-800 0 border-blue-900 rounded-s-lg p-3 h-11 mr-1">
+              <a @click="decrementAmount()"
+                class="bg-blue-800 0 border-blue-900 rounded-s-lg p-3 h-11 mr-1">
                 <svg class="w-3 h-3 text-white dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
                   fill="none" viewBox="0 0 18 2">
                   <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                     d="M1 1h16" />
                 </svg>
-              </button>
+              </a>
 
               <input type="number" v-model="amount" data-input-counter aria-describedby="helper-text-explanation"
                 class="bg-blue-50 border-x-0 h-11 focus:border-none text-center text-gray-900 font-bold text-sm block w-full py-2.5"
                 placeholder="1" required />
 
-              <button type="button" @click="decrementAmount()" class="bg-blue-800 0 border-blue-900 rounded-e-lg p-3 h-11 ml-1">
+              <a @click="incrementAmount()"
+                class="bg-blue-800 0 border-blue-900 rounded-e-lg p-3 h-11 ml-1">
                 <svg class="w-3 h-3 text-white dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
                   fill="none" viewBox="0 0 18 18">
                   <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                     d="M9 1v16M1 9h16" />
                 </svg>
-              </button>
+              </a>
 
             </div>
           </div>
@@ -132,7 +143,22 @@ onMounted(async () => {
 
         <div v-if="store.telegram.walletAccount" class="mt-8 text-xs">
           <div class="font-black uppercase text-[10px]">Your balance</div>
-          <div class="font-black text-lg">{{ currentBalance }} TON</div>
+          <div class="font-black text-lg">
+            <div class="flex justify-center">
+              <div>
+                {{ currentBalance }} TON
+              </div>
+              <div class="w-5">
+                <svg v-if="loading" class="animate-spin ml-3 h-7 w-5 text-white" xmlns="http://www.w3.org/2000/svg" fill="none"
+                  viewBox="0 0 24 24">
+                  <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
+                  <path class="opacity-75" fill="currentColor"
+                    d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z">
+                  </path>
+                </svg>
+              </div>
+            </div>
+          </div>
         </div>
 
         <div v-if="!store.telegram.walletAccount" class="mt-4 text-xs text-orange-500">

From 2fde12096c35cc8fad61423ac27b173cc14b188f Mon Sep 17 00:00:00 2001
From: Claudio La Barbera <claudio.labarbera@everli.com>
Date: Wed, 11 Sep 2024 14:18:06 +0200
Subject: [PATCH 05/11] feat: add gtag

---
 .env.example    |  3 ++-
 .env.production |  1 +
 index.html      | 16 ++++++++++++++++
 3 files changed, 19 insertions(+), 1 deletion(-)

diff --git a/.env.example b/.env.example
index e1d4be1..ab3fd7f 100644
--- a/.env.example
+++ b/.env.example
@@ -1,4 +1,5 @@
 VITE_ENV="development"
 VITE_TELEGRAM_BOT_URL=""
 VITE_TELEGRAM_MANIFEST_URL=""
-VITE_TON_CONTRACT_ADDRESS=""
\ No newline at end of file
+VITE_TON_CONTRACT_ADDRESS=""
+VITE_GTAG_ID=""
\ No newline at end of file
diff --git a/.env.production b/.env.production
index 47bba6e..54b3ba4 100644
--- a/.env.production
+++ b/.env.production
@@ -2,3 +2,4 @@ VITE_ENV="production"
 VITE_TELEGRAM_BOT_URL="https://t.me/x2lotterybot"
 VITE_TELEGRAM_MANIFEST_URL="https://gradoally.github.io/x2lottery/tonconnect-manifest.json"
 VITE_TON_CONTRACT_ADDRESS="EQCnuaUFX1fxduNk5QvUMlexRmwHM08jfO5_zpQpkXjeWbL7"
+VITE_GTAG_ID="G-0R6KDGMBJS"
\ No newline at end of file
diff --git a/index.html b/index.html
index 9612e01..f7cda8c 100644
--- a/index.html
+++ b/index.html
@@ -7,6 +7,22 @@
       name="viewport"
       content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"
     />
+
+    <!-- Google tag (gtag.js) -->
+    <script
+      async
+      src="https://www.googletagmanager.com/gtag/js?id=%VITE_GTAG_ID%"
+    ></script>
+    <script>
+      window.dataLayer = window.dataLayer || [];
+      function gtag() {
+        dataLayer.push(arguments);
+      }
+      gtag("js", new Date());
+
+      gtag("config", "%VITE_GTAG_ID%");
+    </script>
+
     <title>x2Lottery</title>
   </head>
   <body class="bg-gray-950 text-white h-screen select-none">

From 9f87388d5a618f4cc2ad59bd29998f1fd25a92e9 Mon Sep 17 00:00:00 2001
From: Claudio La Barbera <hello@thebatclaud.io>
Date: Wed, 11 Sep 2024 17:45:40 +0200
Subject: [PATCH 06/11] feat: make usable outside telegram

---
 src/common/store/telegram.ts  | 11 +++++++----
 src/components/views/Home.vue |  4 ----
 2 files changed, 7 insertions(+), 8 deletions(-)

diff --git a/src/common/store/telegram.ts b/src/common/store/telegram.ts
index bf7004a..bf107b8 100644
--- a/src/common/store/telegram.ts
+++ b/src/common/store/telegram.ts
@@ -33,10 +33,13 @@ export const Telegram: Reactive<Telegram> = reactive<Telegram>({
     this.initClient();
   },
   initTelegramData() {
-    const launchParams = retrieveLaunchParams();
-
-    this.initDataRaw = launchParams.initDataRaw;
-    this.initData = launchParams.initData;
+    try {
+      const launchParams = retrieveLaunchParams();
+      this.initDataRaw = launchParams.initDataRaw;
+      this.initData = launchParams.initData;
+    } catch (e) {
+      console.log('not in telegram app');
+    }
   },
   async initWallet() {
     await this.tonConnectUI?.getWallets();
diff --git a/src/components/views/Home.vue b/src/components/views/Home.vue
index b3d56b1..3bf9d7c 100644
--- a/src/components/views/Home.vue
+++ b/src/components/views/Home.vue
@@ -1,6 +1,5 @@
 <script setup>
 import { ref, computed, onMounted } from 'vue'
-import { initHapticFeedback } from '@telegram-apps/sdk';
 import { FaceSmileIcon } from '@heroicons/vue/24/solid';
 import { HeadsOrTails } from '../../wrappers/HeadsOrTails';
 import Modal from '../modals/Modal.vue';
@@ -9,8 +8,6 @@ import { store } from '../../common/store';
 
 const jettonSymbol = ref(import.meta.env.VITE_JETTON_SYMBOL);
 
-const hapticFeedback = initHapticFeedback();
-
 const amount = ref(1);
 
 const currentBalance = ref(0);
@@ -56,7 +53,6 @@ const viewTransaction = () => {
 }
 
 const incrementAmount = () => {
-  console.log('increment');
   if (amount.value + 0.1 <= (max_bet.value)) {
     amount.value = (amount.value + 0.1)
   }

From 1bfb82839bc24a8cf02576aa4956498049183cf5 Mon Sep 17 00:00:00 2001
From: Claudio La Barbera <hello@thebatclaud.io>
Date: Wed, 11 Sep 2024 18:15:40 +0200
Subject: [PATCH 07/11] fix: counter

---
 src/components/views/Home.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/views/Home.vue b/src/components/views/Home.vue
index 3bf9d7c..12201ea 100644
--- a/src/components/views/Home.vue
+++ b/src/components/views/Home.vue
@@ -54,13 +54,13 @@ const viewTransaction = () => {
 
 const incrementAmount = () => {
   if (amount.value + 0.1 <= (max_bet.value)) {
-    amount.value = (amount.value + 0.1)
+    amount.value = parseFloat((amount.value + 0.1).toFixed(1))
   }
 }
 
 const decrementAmount = () => {
   if (amount.value - 0.1 >= (min_bet.value)) {
-    amount.value = (amount.value - 0.1)
+    amount.value = parseFloat((amount.value - 0.1).toFixed(1))
   }
 }
 

From 5c8f2f84797dd1407e1582d8cdede9e8c31cc5e2 Mon Sep 17 00:00:00 2001
From: Claudio La Barbera <hello@thebatclaud.io>
Date: Thu, 12 Sep 2024 16:53:40 +0200
Subject: [PATCH 08/11] fix: router

---
 src/main.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/main.ts b/src/main.ts
index b5bcb2f..f50ebb7 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,5 +1,5 @@
 import { createApp } from "vue";
-import { createWebHistory, createRouter } from "vue-router";
+import { createWebHashHistory, createRouter } from "vue-router";
 import WebApp from "@twa-dev/sdk";
 import Vue3TouchEvents, {
   type Vue3TouchEventsOptions,
@@ -25,7 +25,7 @@ const routes = [
 ];
 
 const router = createRouter({
-  history: createWebHistory(getBasePath()),
+  history: createWebHashHistory(getBasePath()),
   routes,
 });
 

From f1d3e29738535f441afa3a4b5e2d4adc342a6945 Mon Sep 17 00:00:00 2001
From: Claudio La Barbera <hello@thebatclaud.io>
Date: Fri, 13 Sep 2024 00:59:56 +0200
Subject: [PATCH 09/11] feat: add transaction on icon click

---
 src/components/views/Home.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/views/Home.vue b/src/components/views/Home.vue
index 12201ea..ca0aeb2 100644
--- a/src/components/views/Home.vue
+++ b/src/components/views/Home.vue
@@ -92,7 +92,7 @@ onMounted(async () => {
     <div class="flex flex-col justify-center content-center">
       <div class="flex justify-center">
         <div>
-          <div id="front"><img src="/icon.png" class="pulse h-[30vh]"></div>
+          <div id="front" @click="playGame()"><img src="/icon.png" class="pulse h-[30vh]"></div>
         </div>
       </div>
       <div class="mt-6">

From efa08213620e8e33e766b0557dd7dffe47822287 Mon Sep 17 00:00:00 2001
From: Claudio La Barbera <hello@thebatclaud.io>
Date: Fri, 13 Sep 2024 01:03:17 +0200
Subject: [PATCH 10/11] feat: add transaction on icon click

---
 src/components/views/Home.vue | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/src/components/views/Home.vue b/src/components/views/Home.vue
index ca0aeb2..68405d0 100644
--- a/src/components/views/Home.vue
+++ b/src/components/views/Home.vue
@@ -5,6 +5,7 @@ import { HeadsOrTails } from '../../wrappers/HeadsOrTails';
 import Modal from '../modals/Modal.vue';
 import Button from '../common/Button.vue';
 import { store } from '../../common/store';
+import { initHapticFeedback } from '@telegram-apps/sdk';
 
 const jettonSymbol = ref(import.meta.env.VITE_JETTON_SYMBOL);
 
@@ -35,6 +36,12 @@ let currentDegrees = 0;
 const playGame = async () => {
   if (isFlipping) return;
 
+  try {
+    const hapticFeedback = initHapticFeedback();
+
+    hapticFeedback.impactOccurred('heavy');
+  } catch {}
+
   lastTransactionId = await store.telegram.playGame(amount.value);
 
   modalOpen.value = true;

From e07f72b385420f1dc39d3405a293f4211aa21e0b Mon Sep 17 00:00:00 2001
From: Vsevolod <106031792+sraibaby@users.noreply.github.com>
Date: Mon, 16 Sep 2024 14:06:42 +0300
Subject: [PATCH 11/11] Update .env.production

---
 .env.production | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/.env.production b/.env.production
index 54b3ba4..d9a6a73 100644
--- a/.env.production
+++ b/.env.production
@@ -1,5 +1,5 @@
 VITE_ENV="production"
-VITE_TELEGRAM_BOT_URL="https://t.me/x2lotterybot"
+VITE_TELEGRAM_BOT_URL="t.me/x2lotterybot/play"
 VITE_TELEGRAM_MANIFEST_URL="https://gradoally.github.io/x2lottery/tonconnect-manifest.json"
 VITE_TON_CONTRACT_ADDRESS="EQCnuaUFX1fxduNk5QvUMlexRmwHM08jfO5_zpQpkXjeWbL7"
-VITE_GTAG_ID="G-0R6KDGMBJS"
\ No newline at end of file
+VITE_GTAG_ID="G-0R6KDGMBJS"