This commit is contained in:
parent
b3b7ab72f9
commit
d9b5131101
3 changed files with 56 additions and 19 deletions
|
|
@ -14,6 +14,7 @@
|
|||
</div>
|
||||
<div class="blur-effect"></div>
|
||||
</div>
|
||||
<WalletCard />
|
||||
<LiveStats />
|
||||
<div class="k-container">
|
||||
<section class="how-it-works-section">
|
||||
|
|
@ -88,6 +89,7 @@
|
|||
import KButton from '@/components/KButton.vue';
|
||||
import LeftRightComponent from '@/components/LeftRightComponent.vue';
|
||||
import LiveStats from '@/components/LiveStats.vue';
|
||||
import WalletCard from '@/components/WalletCard.vue';
|
||||
import { useMobile } from '@/composables/useMobile';
|
||||
import { useRouter } from 'vue-router';
|
||||
|
||||
|
|
|
|||
|
|
@ -14,6 +14,7 @@
|
|||
</div>
|
||||
<div class="blur-effect"></div>
|
||||
</div>
|
||||
<WalletCard />
|
||||
<LiveStats />
|
||||
<div class="k-container">
|
||||
<section class="how-it-works-section">
|
||||
|
|
@ -88,6 +89,7 @@
|
|||
import KButton from '@/components/KButton.vue';
|
||||
import LeftRightComponent from '@/components/LeftRightComponent.vue';
|
||||
import LiveStats from '@/components/LiveStats.vue';
|
||||
import WalletCard from '@/components/WalletCard.vue';
|
||||
import { useMobile } from '@/composables/useMobile';
|
||||
import { useRouter } from 'vue-router';
|
||||
|
||||
|
|
|
|||
|
|
@ -13,12 +13,7 @@
|
|||
<p>Swap ETH for $KRK on Uniswap, then stake your position to earn rewards.</p>
|
||||
</div>
|
||||
|
||||
<a
|
||||
:href="uniswapUrl"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="swap-button"
|
||||
>
|
||||
<a :href="uniswapUrl" target="_blank" rel="noopener noreferrer" class="swap-button">
|
||||
<span class="swap-button-icon">🔄</span>
|
||||
<span>Swap on Uniswap</span>
|
||||
<span class="swap-button-arrow">→</span>
|
||||
|
|
@ -36,10 +31,21 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Local/testnet: link to cheats page for swapping -->
|
||||
<div v-if="isLocalChain" class="local-swap-card">
|
||||
<h3>🔧 Local Development</h3>
|
||||
<p>You're on a local chain. Use the Cheat Console to swap ETH for KRK directly.</p>
|
||||
<router-link to="/cheats" class="swap-button local">
|
||||
<span>Open Cheat Console</span>
|
||||
<span class="swap-button-arrow">→</span>
|
||||
</router-link>
|
||||
</div>
|
||||
|
||||
<div class="next-steps">
|
||||
<h3>Next Steps</h3>
|
||||
<ol>
|
||||
<li>Click the button above to open Uniswap</li>
|
||||
<li v-if="isLocalChain">Use the Cheat Console to swap ETH for $KRK</li>
|
||||
<li v-else>Click the button above to open Uniswap</li>
|
||||
<li>Swap ETH for $KRK tokens</li>
|
||||
<li>Return here and navigate to the Stake page</li>
|
||||
<li>Stake your $KRK to start earning</li>
|
||||
|
|
@ -84,6 +90,8 @@ const networkName = computed(() => {
|
|||
}
|
||||
});
|
||||
|
||||
const isLocalChain = computed(() => currentChainId.value === 31337);
|
||||
|
||||
// Build Uniswap URL with proper chain and token
|
||||
const uniswapUrl = computed(() => {
|
||||
const chainId = currentChainId.value;
|
||||
|
|
@ -216,6 +224,31 @@ const uniswapUrl = computed(() => {
|
|||
color: #ffffff
|
||||
font-weight: 500
|
||||
|
||||
.local-swap-card
|
||||
background: linear-gradient(135deg, rgba(117, 80, 174, 0.15) 0%, rgba(117, 80, 174, 0.05) 100%)
|
||||
border: 1px solid rgba(117, 80, 174, 0.3)
|
||||
border-radius: 16px
|
||||
padding: 32px
|
||||
text-align: center
|
||||
display: flex
|
||||
flex-direction: column
|
||||
gap: 16px
|
||||
|
||||
h3
|
||||
margin: 0
|
||||
color: #ffffff
|
||||
|
||||
p
|
||||
margin: 0
|
||||
color: #9A9898
|
||||
|
||||
.swap-button.local
|
||||
background: linear-gradient(135deg, #7550AE 0%, #5a3d8a 100%)
|
||||
box-shadow: 0 4px 12px rgba(117, 80, 174, 0.3)
|
||||
|
||||
&:hover
|
||||
background: linear-gradient(135deg, #5a3d8a 0%, #4a2d7a 100%)
|
||||
|
||||
.next-steps
|
||||
background: #1a1a1a
|
||||
border: 1px solid #3a3a3a
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue