Merge pull request 'Minor cleanup' (#54) from seed-backup-view-improvements into master

Reviewed-on: https://gitea.anomalistdesign.com/trent_larson/kick-starter-for-time-pwa/pulls/54

src/views/SeedBackupView.vue

@@ -20,22 +20,26 @@
     </div>
 
     <div v-if="activeAccount">
-      <p>
+      <p class="text-center mb-4">
-        BEWARE: Anyone who gets hold of this mnemonic seed phrase will be able
+        <b class="text-red-600">BEWARE!</b> Anyone who has this seed phrase will
-        impersonate you and take over any digital holdings based on it. So only
+        be able impersonate you and take over any digital holdings based on it.
-        reveal it when you are in a private place out of sight of other eyes,
+        Reveal it when you are somewhere only you can see your screen, and
-        and only record it in something private -- don't take a screenshot or
+        record it somewhere only you have access.
-        send it to any online service.
+        <i>Don't take a screenshot or send it to any online service.</i>
       </p>
 
+      <div class="bg-slate-100 rounded-md overflow-hidden p-4 mb-4">
         <button
           class="block w-full text-center text-md uppercase bg-slate-500 text-white px-1.5 py-2 rounded-md"
           @click="showSeedPhrase"
         >
-        Click here when you're ready to see it.
+          Reveal my Seed Phrase
         </button>
 
-      <p v-if="showSeed">{{ activeAccount.mnemonic }}</p>
+        <p v-if="showSeed" class="text-center text-slate-700 mt-2">
+          {{ activeAccount.mnemonic }}
+        </p>
+      </div>
     </div>
     <div v-else>You do not have an active identity.</div>
     <AlertMessage