diff --git a/landing/src/views/HomeViewMixed.vue b/landing/src/views/HomeViewMixed.vue
index c37a057..a4f5d19 100644
--- a/landing/src/views/HomeViewMixed.vue
+++ b/landing/src/views/HomeViewMixed.vue
@@ -14,6 +14,7 @@
+
@@ -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';
diff --git a/landing/src/views/HomeViewOffensive.vue b/landing/src/views/HomeViewOffensive.vue
index 6303259..2ba4fa7 100644
--- a/landing/src/views/HomeViewOffensive.vue
+++ b/landing/src/views/HomeViewOffensive.vue
@@ -14,6 +14,7 @@
+
@@ -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';
diff --git a/web-app/src/views/GetKrkView.vue b/web-app/src/views/GetKrkView.vue
index 03fe4da..c73029f 100644
--- a/web-app/src/views/GetKrkView.vue
+++ b/web-app/src/views/GetKrkView.vue
@@ -2,7 +2,7 @@
+
+
+
🔧 Local Development
+
You're on a local chain. Use the Cheat Console to swap ETH for KRK directly.
+
+ Open Cheat Console
+ →
+
+
+
Next Steps
- - Click the button above to open Uniswap
+ - Use the Cheat Console to swap ETH for $KRK
+ - Click the button above to open Uniswap
- Swap ETH for $KRK tokens
- Return here and navigate to the Stake page
- Stake your $KRK to start earning
@@ -84,11 +90,13 @@ const networkName = computed(() => {
}
});
+const isLocalChain = computed(() => currentChainId.value === 31337);
+
// Build Uniswap URL with proper chain and token
const uniswapUrl = computed(() => {
const chainId = currentChainId.value;
const tokenAddress = chainData.value?.harb || '0xff196f1e3a895404d073b8611252cf97388773a7';
-
+
// Map chainId to Uniswap chain identifier
let chainName = 'base_sepolia';
if (chainId === 8453) {
@@ -96,7 +104,7 @@ const uniswapUrl = computed(() => {
} else if (chainId === 84532) {
chainName = 'base_sepolia';
}
-
+
return `https://app.uniswap.org/swap?chain=${chainName}&outputCurrency=${tokenAddress}`;
});
@@ -108,7 +116,7 @@ const uniswapUrl = computed(() => {
display: flex
justify-content: center
align-items: center
-
+
@media (min-width: 768px)
padding: 48px
@@ -125,7 +133,7 @@ const uniswapUrl = computed(() => {
text-align: center
margin: 0
color: #ffffff
-
+
@media (min-width: 768px)
font-size: 40px
@@ -147,7 +155,7 @@ const uniswapUrl = computed(() => {
font-size: 36px
font-weight: 700
color: #60a5fa
-
+
@media (min-width: 768px)
font-size: 48px
@@ -162,7 +170,7 @@ const uniswapUrl = computed(() => {
.swap-explanation
text-align: center
-
+
p
margin: 0
font-size: 16px
@@ -183,7 +191,7 @@ const uniswapUrl = computed(() => {
text-decoration: none
transition: all 0.3s ease
box-shadow: 0 4px 12px rgba(96, 165, 250, 0.3)
-
+
&:hover
transform: translateY(-2px)
box-shadow: 0 6px 16px rgba(96, 165, 250, 0.4)
@@ -216,24 +224,49 @@ 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
border-radius: 16px
padding: 32px
-
+
h3
margin: 0 0 16px 0
font-size: 20px
color: #ffffff
-
+
ol
margin: 0
padding-left: 24px
display: flex
flex-direction: column
gap: 12px
-
+
li
color: #d4d4d4
line-height: 1.6