Show blockie identicons on transaction detail page

Replace color dots with 16px circular blockies next to from and to
addresses on the transaction detail view.

src/popup/views/addressDetail.js

@@ -213,14 +213,19 @@ function copyableHtml(text, extraClass) {
     return `<span class="${cls}" data-copy="${escapeHtml(text)}">${escapeHtml(text)}</span>`;
 }
 
+function blockieHtml(address) {
+    const src = makeBlockie(address);
+    return `<img src="${src}" width="16" height="16" style="image-rendering:pixelated;border-radius:50%;margin-right:4px;vertical-align:middle;flex-shrink:0;display:inline-block">`;
+}
+
 function txDetailAddressHtml(address) {
     const ensName = ensNameMap.get(address) || null;
-    const dot = addressDotHtml(address);
+    const blockie = blockieHtml(address);
     const link = etherscanAddressLink(address);
     const extLink = `<a href="${link}" target="_blank" rel="noopener" class="inline-flex items-center">${EXT_ICON}</a>`;
     if (ensName) {
         return (
-            dot +
+            blockie +
             copyableHtml(ensName, "") +
             extLink +
             `<div class="break-all">` +
@@ -228,7 +233,7 @@ function txDetailAddressHtml(address) {
             `</div>`
         );
     }
-    return dot + copyableHtml(address, "break-all") + extLink;
+    return blockie + copyableHtml(address, "break-all") + extLink;
 }
 
 function txDetailHashHtml(hash) {