From aa9b5d2cb1598be5693f035b6d4166285345870d Mon Sep 17 00:00:00 2001
From: Anthony Fu <anthonyfu117@hotmail.com>
Date: Mon, 19 Dec 2022 22:14:54 +0100
Subject: [PATCH] ui: pwa prompt

---
 components/PWAPrompt.client.vue | 32 ++++++++++++++++++--------------
 locales/en-US.json              |  6 +++---
 locales/es-ES.json              |  1 -
 3 files changed, 21 insertions(+), 18 deletions(-)

diff --git a/components/PWAPrompt.client.vue b/components/PWAPrompt.client.vue
index 056cd2e2..ee5a0bd7 100644
--- a/components/PWAPrompt.client.vue
+++ b/components/PWAPrompt.client.vue
@@ -15,25 +15,29 @@ const { close, needRefresh, updateServiceWorker } = usePWA()
     z11
     fixed
     bottom-14 md:bottom-0 right-0
-    m-2 p-4
+    m-2 p-4 w-100
     bg-base border="~ base"
     rounded
     text-left
     shadow
+    flex="~ gap-4"
   >
-    <h2 id="pwa-toast-title" sr-only>
-      {{ $t('pwa.title') }}
-    </h2>
-    <div id="pwa-toast-message">
-      {{ $t('pwa.message') }}
-    </div>
-    <div m-t4 flex="~ colum" gap-x="4">
-      <button type="button" btn-solid text-sm px-2 py-1 text-center @click="updateServiceWorker()">
-        {{ $t('pwa.reload') }}
-      </button>
-      <button type="button" btn-outline px-2 py-1 text-sm text-center @click="close">
-        {{ $t('pwa.close') }}
-      </button>
+    <img src="/logo.svg" w-12 h-12 height="10" width="10" ma alt="logo">
+    <div>
+      <h2 id="pwa-toast-title" sr-only>
+        {{ $t('pwa.title') }}
+      </h2>
+      <div id="pwa-toast-message">
+        {{ $t('pwa.message') }}
+      </div>
+      <div mt2 flex="~ gap-4">
+        <button type="button" btn-solid px-4 py-1 text-center text-sm @click="updateServiceWorker()">
+          {{ $t('pwa.reload') }}
+        </button>
+        <button type="button" btn-outline filter-saturate-0 px-4 py-1 text-center text-sm @click="close">
+          {{ $t('pwa.dismiss') }}
+        </button>
+      </div>
     </div>
   </div>
 </template>
diff --git a/locales/en-US.json b/locales/en-US.json
index 43647650..02f94a06 100644
--- a/locales/en-US.json
+++ b/locales/en-US.json
@@ -191,10 +191,10 @@
     "the_thread": "the thread"
   },
   "pwa": {
-    "close": "Close",
-    "message": "@:pwa.title{','} click on @:pwa.reload button to update.",
+    "dismiss": "Dismiss",
+    "message": "@:pwa.title{','} click on the @:pwa.reload button to update.",
     "reload": "Reload",
-    "title": "New Elk version available"
+    "title": "New Elk update available"
   },
   "search": {
     "search_desc": "Search for people & hashtags"
diff --git a/locales/es-ES.json b/locales/es-ES.json
index 8009f5d6..dc99b726 100644
--- a/locales/es-ES.json
+++ b/locales/es-ES.json
@@ -188,7 +188,6 @@
     "the_thread": "el hilo"
   },
   "pwa": {
-    "close": "Cerrar",
     "message": "@:pwa.title{','} haz click en el botón @:pwa.reload para actualizar.",
     "reload": "Recargar",
     "title": "Nueva versión de Elk disponible"