Make the app installable (PWA metadata)
- manifest.webmanifest with name, standalone display, theme color - PNG icons 192/512 + maskable variant + apple-touch-icon (from the Poké Ball favicon) - minimal pass-through service worker (installability requirement) - apple/mobile web app meta tags
This commit is contained in:
Binary file not shown.
|
After Width: | Height: | Size: 6.1 KiB |
@@ -0,0 +1,30 @@
|
|||||||
|
{
|
||||||
|
"name": "PokeShare",
|
||||||
|
"short_name": "PokeShare",
|
||||||
|
"description": "Gérez et partagez votre collection de cartes Pokémon TCG.",
|
||||||
|
"start_url": "/",
|
||||||
|
"scope": "/",
|
||||||
|
"display": "standalone",
|
||||||
|
"background_color": "#0a0a0a",
|
||||||
|
"theme_color": "#ee1515",
|
||||||
|
"icons": [
|
||||||
|
{
|
||||||
|
"src": "/pwa-192.png",
|
||||||
|
"sizes": "192x192",
|
||||||
|
"type": "image/png",
|
||||||
|
"purpose": "any"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"src": "/pwa-512.png",
|
||||||
|
"sizes": "512x512",
|
||||||
|
"type": "image/png",
|
||||||
|
"purpose": "any"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"src": "/pwa-maskable-512.png",
|
||||||
|
"sizes": "512x512",
|
||||||
|
"type": "image/png",
|
||||||
|
"purpose": "maskable"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 6.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
@@ -0,0 +1,16 @@
|
|||||||
|
/**
|
||||||
|
* Minimal service worker — network pass-through.
|
||||||
|
* Its only job is to make the app installable (browsers require a service
|
||||||
|
* worker to offer "Install app"); no offline caching for now.
|
||||||
|
*/
|
||||||
|
self.addEventListener("install", (event) => {
|
||||||
|
self.skipWaiting();
|
||||||
|
});
|
||||||
|
|
||||||
|
self.addEventListener("activate", (event) => {
|
||||||
|
event.waitUntil(clients.claim());
|
||||||
|
});
|
||||||
|
|
||||||
|
self.addEventListener("fetch", (event) => {
|
||||||
|
event.respondWith(fetch(event.request));
|
||||||
|
});
|
||||||
@@ -26,6 +26,16 @@ if (themePreference === "Dark") {
|
|||||||
<meta charset="utf-8" />
|
<meta charset="utf-8" />
|
||||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||||
<link rel="icon" href="/favicon.ico" />
|
<link rel="icon" href="/favicon.ico" />
|
||||||
|
<link rel="manifest" href="/manifest.webmanifest" />
|
||||||
|
<meta name="theme-color" content="#ee1515" />
|
||||||
|
<link rel="apple-touch-icon" href="/apple-touch-icon.png" />
|
||||||
|
<meta name="apple-mobile-web-app-capable" content="yes" />
|
||||||
|
<meta
|
||||||
|
name="apple-mobile-web-app-status-bar-style"
|
||||||
|
content="black-translucent"
|
||||||
|
/>
|
||||||
|
<meta name="apple-mobile-web-app-title" content="PokeShare" />
|
||||||
|
<meta name="mobile-web-app-capable" content="yes" />
|
||||||
<meta name="viewport" content="width=device-width" />
|
<meta name="viewport" content="width=device-width" />
|
||||||
<meta name="generator" content={Astro.generator} />
|
<meta name="generator" content={Astro.generator} />
|
||||||
<title>PokeShare</title>
|
<title>PokeShare</title>
|
||||||
@@ -59,5 +69,11 @@ if (themePreference === "Dark") {
|
|||||||
import "basecoat-css/tabs";
|
import "basecoat-css/tabs";
|
||||||
import "basecoat-css/dropdown-menu";
|
import "basecoat-css/dropdown-menu";
|
||||||
</script>
|
</script>
|
||||||
|
<script is:inline>
|
||||||
|
// Register the service worker so the browser offers "Install app"
|
||||||
|
if ("serviceWorker" in navigator) {
|
||||||
|
navigator.serviceWorker.register("/sw.js");
|
||||||
|
}
|
||||||
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
Reference in New Issue
Block a user