style the sharing screen (plus other fixes)

src/views/SharedPhotoView.vue

@@ -7,26 +7,45 @@
       Image
     </h1>
     <div v-if="imageBlob">
-      <div v-if="uploading">
+      <div v-if="uploading" class="text-center mb-4">
         <fa icon="spinner" class="fa-spin-pulse" />
       </div>
       <div v-else>
-        Choose the purpose of this image:
-        <br />
-        <button @click="recordGift">Record a Gift</button>
-        <br />
-        <button @click="recordProfile">Save as Profile Image</button>
-        <br />
-        <button @click="cancel">Cancel</button>
+        <div class="text-center mb-4">Choose how to use this image</div>
+        <div class="grid grid-cols-1 sm:grid-cols-3 gap-4">
+          <button
+            @click="recordGift"
+            class="text-center text-md font-bold bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-2 py-3 rounded-md"
+          >
+            <fa icon="gift" class="fa-fw" />
+            Record a Gift
+          </button>
+          <button
+            @click="recordProfile"
+            class="text-center text-md font-bold bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-2 py-3 rounded-md"
+          >
+            <fa icon="circle-user" class="fa-fw" />
+            Save as Profile Image
+          </button>
+          <button
+            @click="cancel"
+            class="text-center text-md font-bold bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-2 py-3 rounded-md"
+          >
+            <fa icon="ban" class="fa-fw" />
+            Cancel
+          </button>
+        </div>
       </div>
 
-      <img
-        :src="URL.createObjectURL(imageBlob)"
-        alt="Shared Image"
-        class="rounded"
-      />
+      <div class="flex justify-center">
+        <img
+          :src="URL.createObjectURL(imageBlob)"
+          alt="Shared Image"
+          class="rounded mt-4"
+        />
+      </div>
     </div>
-    <div v-else>
+    <div v-else class="text-center mb-4">
       <p>No image found.</p>
     </div>
   </section>
@@ -93,7 +112,12 @@ export default class SharedPhotoView extends Vue {
       if (url) {
         this.$router.push({
           name: "gifted-details",
-          query: { imageUrl: url },
+          query: {
+            destinationNameAfter: "home",
+            hideBackButton: true,
+            imageUrl: url,
+            recipientDid: this.activeDid,
+          },
         });
       }
     });