pwa: add manifest and related app icons
ci/woodpecker/pr/woodpecker Pipeline was successful Details
ci/woodpecker/push/woodpecker Pipeline was successful Details

That nostr.ch has a pretty app icon when adding to home screen.
pull/41/head
OFF0 2 years ago
parent 343413355f
commit b86cf6f687
Signed by: offbyn
GPG Key ID: 94A2F643C51F37FA

@ -8,19 +8,22 @@ import { replaceOnCopyPlugin } from './tools/esbuild-helper.js'
// see docs at https://esbuild.github.io/api/
export const options = {
entryPoints: [
'src/main.js',
'src/main.css',
'src/index.html',
'src/about.html',
'src/assets/comment.svg',
'src/assets/heart-fill.svg',
'src/assets/nostr-favicon.png',
'src/assets/nostr-favicon.svg',
'src/assets/star.svg',
'src/assets/star-fill.svg',
'src/favicon.ico',
'src/index.html',
'src/main.css',
'src/main.js',
'src/manifest.json',
],
outdir: 'dist',
//entryNames: '[name]-[hash]', TODO: replace urls in index.html with hashed paths
loader: {'.html': 'copy', '.svg': 'copy', '.ico': 'copy'},
loader: {'.html': 'copy', '.ico': 'copy', '.png': 'copy', '.svg': 'copy'},
bundle: true,
platform: 'browser',
minify: false, // TODO: true for release and enable sourcemap
@ -36,6 +39,7 @@ export const options = {
}),
NodeGlobalsPolyfillPlugin({buffer: true}),
replaceOnCopyPlugin(/about\.html$/),
replaceOnCopyPlugin(/manifest\.json$/),
]
};

@ -5,6 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>about / nostr</title>
<link rel="stylesheet" href="main.css" type="text/css">
<link rel="manifest" href="/manifest.json">
</head>
<body>
<main class="text">

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.6 KiB

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="331.088" height="331.088" viewBox="0 0 87.6 87.6">
<circle cx="90.953" cy="119.632" r="37.72" style="fill:none;fill-opacity:1;stroke:#f0f;stroke-width:12.16;stroke-dasharray:none;stroke-opacity:1" transform="translate(-47.152 -75.832)"/>
</svg>

After

Width:  |  Height:  |  Size: 294 B

@ -5,6 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>nostr</title>
<link rel="stylesheet" href="main.css" type="text/css">
<link rel="manifest" href="/manifest.json">
</head>
<body>
<main class="tabbed">

@ -0,0 +1,21 @@
{
"$schema": "https://json.schemastore.org/web-manifest-combined.json",
"background_color": "#191919",
"categories": ["news", "social"],
"description": "a nostr news client to connect with the world.",
"display": "fullscreen",
"name": "nostr",
"short_name": "nostr",
"start_url": "https://nostr.ch/",
"icons": [{
"src": "assets/nostr-favicon.png",
"sizes": "256x256",
"type": "image/png"
}, {
"src": "favicon.ico",
"sizes": "32x32"
}, {
"src": "assets/nostr-favicon.svg",
"sizes": "any"
}]
}
Loading…
Cancel
Save