BTHLABS-49: WIP

services/backend/hotpocket_backend/apps/ui/templates/ui/base.html

@@ -23,8 +23,9 @@
     <meta name="apple-mobile-web-app-capable" content="yes">
     <meta name="apple-mobile-web-app-status-bar-style" content="black">
     <meta name="apple-mobile-web-app-title" content="HotPocket">
-    <link rel="apple-touch-icon" href="{% static 'ui/img/apple-touch-icon-180.png' %}">
-    <link rel="shortcut icon" href="{% static 'ui/img/apple-touch-icon-180.png' %}">
+    <link rel="apple-touch-icon" href="{% static 'ui/img/icon-180.png' %}">
+    <link rel="icon" type="image/png" sizes="32x32" href="{% static 'ui/img/icon-32.png' %}">
+    <link rel="icon" type="image/png" sizes="16x16" href="{% static 'ui/img/icon-16.png' %}">
     <link rel="manifest" href="{% url 'ui.meta.manifest_json' %}">
     {% block page_head %}{% endblock %}
   </head>

services/backend/hotpocket_backend/apps/ui/templates/ui/page.html

@@ -10,7 +10,7 @@
         <li class="nav-item dropdown">
           <a class="nav-link dropdown-toggle ui-navbar-brand" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
             {% spaceless %}
-              <img src="{% static 'ui/img/apple-touch-icon-180.png' %}">
+              <img src="{% static 'ui/img/icon-180.png' %}">
               <span class="ms-2">{% block top_nav_title %}HotPocket{% endblock %}</span>
             {% endspaceless %}
           </a>
@@ -35,7 +35,7 @@
       {% else %}
         <li class="nav-item">
           <a class="nav-link pe-none ui-navbar-brand">
-            <img src="{% static 'ui/img/apple-touch-icon-180.png' %}">
+            <img src="{% static 'ui/img/icon-180.png' %}">
             <span class="ms-2">{{ SITE_TITLE }}</span>
           </a>
         </li>

services/backend/hotpocket_backend/apps/ui/views/meta.py

@@ -18,8 +18,13 @@ def manifest_json(request: HttpRequest) -> JsonResponse:
         'theme_color': '#2b3035',
         'icons': [
             {
-                'src': static('ui/img/apple-touch-icon-180.png'),
-                'sizes': '180x180',
+                'src': static('ui/img/icon-192.png'),
+                'sizes': '192x192',
+                'type': 'image/png',
+            },
+            {
+                'src': static('ui/img/icon-512.png'),
+                'sizes': '512x512',
                 'type': 'image/png',
             },
         ],