Fix display consistency across all views

Receive view: address now shows color dot and etherscan link,
matching every other address display in the app.

Send view "From": address now includes etherscan link alongside
the existing color dot.

Send view "What to send" (ERC-20 from token view): shows token
symbol as bold heading, then full contract address below with
color dot, copy-on-click, and etherscan link.

Approval views: tx approval From/To addresses now show color
dots and etherscan links instead of bare text. Site approval
address adds etherscan link. Tx approval value uses 4 decimal
places consistent with all other amount displays.

Home tx list: row padding changed from py-1 to py-2, matching
addressDetail and addressToken transaction lists.

src/popup/views/approval.js

@@ -1,19 +1,42 @@
-const { $, formatAddressHtml, showView } = require("./helpers");
+const { $, addressDotHtml, escapeHtml, showView } = require("./helpers");
 const { state, saveState } = require("../../shared/state");
 const { formatEther } = require("ethers");
 
 const runtime =
     typeof browser !== "undefined" ? browser.runtime : chrome.runtime;
 
+const EXT_ICON =
+    `<span style="display:inline-block;width:10px;height:10px;margin-left:4px;vertical-align:middle">` +
+    `<svg viewBox="0 0 12 12" fill="none" stroke="currentColor" stroke-width="1.5">` +
+    `<path d="M4.5 1.5H2a.5.5 0 00-.5.5v8a.5.5 0 00.5.5h8a.5.5 0 00.5-.5V7.5"/>` +
+    `<path d="M7 1.5h3.5V5M7 5.5L10.5 1.5"/>` +
+    `</svg></span>`;
+
+function approvalAddressHtml(address) {
+    const dot = addressDotHtml(address);
+    const link = `https://etherscan.io/address/${address}`;
+    const extLink = `<a href="${link}" target="_blank" rel="noopener" class="inline-flex items-center">${EXT_ICON}</a>`;
+    return `<div class="flex items-center">${dot}<span class="break-all">${escapeHtml(address)}</span>${extLink}</div>`;
+}
+
+function formatTxValue(val) {
+    const parts = val.split(".");
+    if (parts.length === 1) return val + ".0000";
+    const dec = (parts[1] + "0000").slice(0, 4);
+    return parts[0] + "." + dec;
+}
+
 let approvalId = null;
 
 function showTxApproval(details) {
     $("approve-tx-hostname").textContent = details.hostname;
-    $("approve-tx-from").textContent = state.activeAddress;
-    $("approve-tx-to").textContent =
-        details.txParams.to || "(contract creation)";
+    $("approve-tx-from").innerHTML = approvalAddressHtml(state.activeAddress);
+    const toAddr = details.txParams.to;
+    $("approve-tx-to").innerHTML = toAddr
+        ? approvalAddressHtml(toAddr)
+        : escapeHtml("(contract creation)");
     $("approve-tx-value").textContent =
-        formatEther(details.txParams.value || "0") + " ETH";
+        formatTxValue(formatEther(details.txParams.value || "0")) + " ETH";
     if (details.txParams.data && details.txParams.data !== "0x") {
         $("approve-tx-data").textContent = details.txParams.data;
         $("approve-tx-data-section").classList.remove("hidden");
@@ -36,10 +59,8 @@ function show(id) {
             return;
         }
         $("approve-hostname").textContent = details.hostname;
-        $("approve-address").innerHTML = formatAddressHtml(
+        $("approve-address").innerHTML = approvalAddressHtml(
             state.activeAddress,
-            null,
-            null,
         );
         $("approve-remember").checked = state.rememberSiteChoice;
     });