feat: make favicon react to theme (#2786)

Co-authored-by: Matt Hill <mattnine@protonmail.com>

web/projects/ui/src/index.html

@@ -12,13 +12,21 @@
     />
     <meta name="format-detection" content="telephone=no" />
     <meta name="msapplication-tap-highlight" content="no" />
-
-    <link rel="icon" type="image/x-icon" href="assets/icon/favicon.ico" />
+    <link
+      rel="icon"
+      type="image/png"
+      href="/assets/icons/favicon-96x96.png"
+      sizes="96x96"
+    />
+    <link rel="icon" type="image/svg+xml" href="/assets/icons/favicon.svg" />
+    <link rel="shortcut icon" href="/assets/icons/favicon.ico" />
     <link
       rel="apple-touch-icon"
-      sizes="256x256"
-      href="assets/img/icon_apple_touch.png"
+      sizes="180x180"
+      href="/assets/icons/apple-touch-icon.png"
     />
+    <meta name="apple-mobile-web-app-title" content="StartOS" />
+
     <link rel="manifest" href="manifest.webmanifest" />
     <meta name="theme-color" content="#ff5b71" />
     <style>

web/projects/ui/src/manifest.webmanifest

@@ -9,10 +9,16 @@
   "id": "/?version=036",
   "icons": [
     {
-      "src": "assets/img/icon.png",
-      "sizes": "256x256",
+      "src": "/assets/icons/web-app-manifest-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png",
+      "purpose": "any"
+    },
+    {
+      "src": "/assets/icons/web-app-manifest-512x512.png",
+      "sizes": "512x512",
       "type": "image/png",
       "purpose": "any"
     }
-  ]
+  ],
 }