Merge pull request #1996 from RitvikSardana/hd-pwa-update-assets

fix(PWA): change PWA assets padding

desk/index.html

@@ -5,12 +5,30 @@
     <link rel="icon" href="/favicon.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Helpdesk</title>
+    <meta name="mobile-web-app-capable" content="yes" />
+    <meta name="apple-mobile-web-app-capable" content="yes" />
+    <meta name="apple-mobile-web-app-title" content="Frappe Helpdesk" />
+    <meta name="apple-mobile-web-app-status-bar-style" content="white" />
+
     <!-- PWA -->
+    <link
+      rel="icon"
+      type="image/png"
+      sizes="196x196"
+      href="/assets/helpdesk/desk/manifest/apple-icon-180.png"
+    />
+
+    <link
+      rel="mask-icon"
+      href="/assets/helpdesk/desk/manifest/manifest-icon-192.maskable.png"
+      color="#FFFFFF"
+    />
+
     <link
       rel="apple-touch-icon"
       href="/assets/helpdesk/desk/manifest/apple-icon-180.png"
     />
-    <meta name="apple-mobile-web-app-capable" content="yes" />
+
     <link
       rel="apple-touch-startup-image"
       href="/assets/helpdesk/desk/manifest/apple-splash-2048-2732.jpg"
@@ -193,7 +211,10 @@
       window.helpdesk_version = "{{ helpdesk_version }}";
       window.site_name = "{{ site_name }}";
       window.favicon = "{{ favicon }}";
-      document.querySelector("link").href = window.favicon;
+
+      document.querySelectorAll("link[rel='icon']").forEach((link) => {
+        link.href = window.favicon;
+      });
     </script>
   </body>
 </html>

desk/src/components/CommunicationArea.vue

@@ -1,6 +1,8 @@
 <template>
   <div class="flex flex-col comm-area">
-    <div class="flex justify-between gap-3 border-t px-4 lg:px-10 py-2.5">
+    <div
+      class="flex justify-between gap-3 border-t px-4 lg:px-10 py-4 md:py-2.5"
+    >
       <div class="flex gap-1.5">
         <Button
           ref="sendEmailRef"

desk/src/components/ticket/TicketFeedback.vue

@@ -1,20 +1,23 @@
 <template>
-  <div>
-    <div class="flex">
-      <div class="min-w-[106px] pb-1.5">Rating</div>
-      <div class="px-1.5">
+  <div class="flex flex-col gap-3 border-b px-6 py-3">
+    <div class="flex items-center text-base leading-5">
+      <div class="min-w-[126px] text-sm">Rating</div>
+      <div class="">
         <StarRating :rating="ticket.feedback_rating" />
       </div>
     </div>
-    <div class="flex">
-      <div class="w-[106px] pb-1.5">Feedback</div>
-      <div class="px-1.5 text-gray-800">
+    <div class="flex items-center text-base leading-5">
+      <div class="min-w-[126px] text-sm">Feedback</div>
+      <div class="text-gray-800">
         {{ ticket.feedback_text }}
       </div>
     </div>
-    <div v-if="ticket.feedback_extra" class="flex">
-      <div class="min-w-[106px] pb-1.5">Comment</div>
-      <div class="px-1.5 text-gray-800">
+    <div
+      v-if="ticket.feedback_extra"
+      class="flex items-center text-base leading-5"
+    >
+      <div class="min-w-[126px] text-sm">Comment</div>
+      <div class="text-gray-800">
         {{ ticket.feedback_extra }}
       </div>
     </div>

desk/vite.config.js

@@ -25,10 +25,14 @@ export default defineConfig({
       devOptions: {
         enabled: true,
       },
+      workbox: {
+        cleanupOutdatedCaches: true,
+      },
       manifest: {
         display: "standalone",
         name: "Frappe Helpdesk",
-        short_name: "Frappe Helpdesk",
+        short_name: "Helpdesk",
+        start_url: "/helpdesk",
         description:
           "Modern, Streamlined, Free and Open Source Customer Service Software",
         start_url: "/helpdesk",