From a5b1b97012fc362a5dfde8049e1a2d4ad5aa5a02 Mon Sep 17 00:00:00 2001
From: Trent Larson <trent@trentlarson.com>
Date: Wed, 17 Jan 2024 19:47:33 -0700
Subject: [PATCH] show the identicon in large size on the contacts screen

---
 src/views/ContactsView.vue | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

diff --git a/src/views/ContactsView.vue b/src/views/ContactsView.vue
index 6ddbc855..16602d2c 100644
--- a/src/views/ContactsView.vue
+++ b/src/views/ContactsView.vue
@@ -96,6 +96,7 @@
               :entityId="contact.did"
               :iconSize="24"
               class="inline-block align-text-bottom border border-slate-300 rounded"
+              @click="showLargeIdenticon = contact.did"
             ></EntityIcon>
             {{ contact.name || "(no name)" }}
             <button
@@ -239,6 +240,18 @@
       </li>
     </ul>
     <p v-else>There are no contacts.</p>
+    <div v-if="showLargeIdenticon" class="fixed z-[100] top-0 inset-x-0 w-full">
+      <div
+        class="absolute inset-0 h-screen flex flex-col items-center justify-center bg-slate-900/50"
+      >
+        <EntityIcon
+          :entityId="showLargeIdenticon"
+          :iconSize="512"
+          class="flex w-11/12 max-w-sm mx-auto mb-3 overflow-hidden bg-white rounded-lg shadow-lg"
+          @click="showLargeIdenticon = ''"
+        />
+      </div>
+    </div>
 
     <div v-if="contactEdit !== null" class="dialog-overlay">
       <div class="dialog">
@@ -330,6 +343,7 @@ export default class ContactsView extends Vue {
   showGiveNumbers = false;
   showGiveTotals = true;
   showGiveConfirmed = true;
+  showLargeIdenticon = "";
 
   libsUtil = libsUtil;