diff --git a/index.html b/index.html index da477d5..a32760f 100644 --- a/index.html +++ b/index.html @@ -109,6 +109,17 @@ window.WalletManager = WalletManager; ::-webkit-scrollbar-track { background: #05070B; } ::-webkit-scrollbar-thumb { background: #1F2937; border-radius: 4px; } ::-webkit-scrollbar-thumb:hover { background: #374151; } + + /* Draggable pills */ + #wallet-pills { display: flex; align-items: center; gap: 6px; } + #wallet-pills .pill-btn { user-select: none; position: relative; } + #wallet-pills .pill-btn.dragging { opacity: 0.3; transform: scale(0.95); } + #wallet-pills .pill-btn.pill-dragging { opacity: 0.3; transform: scale(0.95); } + .drag-insert-line { + width: 3px; min-height: 32px; background: #FF7A00; + border-radius: 2px; flex-shrink: 0; box-shadow: 0 0 6px #FF7A00; + position: absolute; left: -3px; top: 0; + } @@ -384,16 +395,29 @@ window.WalletManager = WalletManager; w.nickname = String(nickname).trim(); this._persist(); } - verifyWallet(address, chain, signature, messageData) { - const w = this.findWallet(address, chain); - if (!w) return { success: false, error: 'Wallet not found' }; - w.isVerified = true; - w.signature = String(signature); - w.messageData = messageData || null; - this._persist(); - return { success: true }; - } - }; + verifyWallet(address, chain, signature, messageData) { + const w = this.findWallet(address, chain); + if (!w) return { success: false, error: 'Wallet not found' }; + w.isVerified = true; + w.signature = String(signature); + w.messageData = messageData || null; + this._persist(); + return { success: true }; + } + setWalletOrder(addresses) { + const addrSet = this._wallets.map(w => w.address); + const ordered = []; + for (const addr of addresses) { + if (addrSet.includes(addr)) { + const w = this._wallets.find(x => x.address === addr); + if (w) ordered.push(w); + } + } + const remaining = this._wallets.filter(w => !ordered.includes(w)); + this._wallets = [...ordered, ...remaining]; + this._persist(); + } + }; } })(); @@ -404,7 +428,7 @@ const orangeBrandColor = '#FF7A00'; const blueBrandColor = '#3b82f6'; const API_BASE = window.location.origin; const WALLET_COLORS = ['#F7931A','#FF007F','#39FF14','#00FFFF','#CCFF00','#9D00FF','#FF0033','#00FFCC','#FF00FF','#007FFF','#DEFF0A','#FF5E00','#8A2BE2','#00FF66','#FF1493','#7B00FF']; -const TOKENS = {"cbBTC": {"decimals": 8, "priceSymbol": "BTC"}, "WETH": {"decimals": 18, "priceSymbol": "WETH"}, "USDC": {"decimals": 6, "priceSymbol": "USDC"}}; +const TOKENS = {"cbBTC": {"decimals": 8, "priceSymbol": "BTC"}, "WBTC": {"decimals": 8, "priceSymbol": "BTC"}, "WETH": {"decimals": 18, "priceSymbol": "WETH"}, "USDC": {"decimals": 6, "priceSymbol": "USDC"}}; /* =================================================================== App State @@ -1007,8 +1031,8 @@ function renderWalletPills() { const nick = w.nickname || 'Wallet'; const isActive = isWalletInLedger(w.address); const platformBadge = getPlatformBadge(w.lendingPlatform); - html += '