Login with MetaMask

/* style.css */ body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background: #f5f7fa; display: flex; align-items: center; justify-content: center; height: 100vh; margin: 0; } .container { text-align: center; padding: 40px; background: white; border-radius: 12px; box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1); } h1 { color: #333; margin-bottom: 20px; } button { background-color: #f6851b; color: white; padding: 15px 30px; border: none; border-radius: 8px; cursor: pointer; font-size: 16px; transition: background-color 0.3s; } button:hover { background-color: #e2761b; } .wallet-info { margin-top: 20px; font-size: 14px; color: #555; word-wrap: break-word; } // script.js window.addEventListener('load', () => { const connectButton = document.getElementById('connectButton'); const walletAddress = document.getElementById('walletAddress'); // Check if MetaMask is installed if (typeof window.ethereum === 'undefined') { walletAddress.innerText = 'MetaMask is not installed. Please install it to use this app.'; connectButton.disabled = true; connectButton.style.backgroundColor = '#ccc'; return; } // Connect Wallet connectButton.addEventListener('click', async () => { try { const accounts = await window.ethereum.request({ method: 'eth_requestAccounts' }); const account = accounts[0]; walletAddress.innerText = `Connected wallet: ${account}`; } catch (error) { console.error('User denied wallet connection', error); walletAddress.innerText = 'Could not connect to wallet.'; } }); });