Add support for iOS app icons and PWA favicons

Updates `client/index.html` and `client/public/manifest.json` to include proper iOS icon links and specifies PNG format for favicons. Enhances the `/api/favicon` endpoint to generate PNG favicons using `sharp` for various sizes and includes the "go4" text for larger icons. Also adds `@types/compression` to `package.json` and `package-lock.json`.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: ab9cd02a-d0b2-4288-9ceb-1964d0059648
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/ab9cd02a-d0b2-4288-9ceb-1964d0059648/mbX83Mu
This commit is contained in:
sebastjanartic
2025-08-31 20:25:15 +00:00
parent 7c02d0310a
commit 87e07be40f
5 changed files with 85 additions and 40 deletions
+10 -10
View File
@@ -37,19 +37,19 @@
<meta name="format-detection" content="telephone=no" />
<!-- iOS ikone za različne velikosti -->
<link rel="apple-touch-icon" sizes="57x57" href="/api/favicon?size=57" />
<link rel="apple-touch-icon" sizes="60x60" href="/api/favicon?size=60" />
<link rel="apple-touch-icon" sizes="72x72" href="/api/favicon?size=72" />
<link rel="apple-touch-icon" sizes="76x76" href="/api/favicon?size=76" />
<link rel="apple-touch-icon" sizes="114x114" href="/api/favicon?size=114" />
<link rel="apple-touch-icon" sizes="120x120" href="/api/favicon?size=120" />
<link rel="apple-touch-icon" sizes="144x144" href="/api/favicon?size=144" />
<link rel="apple-touch-icon" sizes="152x152" href="/api/favicon?size=152" />
<link rel="apple-touch-icon" sizes="180x180" href="/api/favicon?size=180" />
<link rel="apple-touch-icon" sizes="57x57" href="/api/favicon?size=57&format=png" />
<link rel="apple-touch-icon" sizes="60x60" href="/api/favicon?size=60&format=png" />
<link rel="apple-touch-icon" sizes="72x72" href="/api/favicon?size=72&format=png" />
<link rel="apple-touch-icon" sizes="76x76" href="/api/favicon?size=76&format=png" />
<link rel="apple-touch-icon" sizes="114x114" href="/api/favicon?size=114&format=png" />
<link rel="apple-touch-icon" sizes="120x120" href="/api/favicon?size=120&format=png" />
<link rel="apple-touch-icon" sizes="144x144" href="/api/favicon?size=144&format=png" />
<link rel="apple-touch-icon" sizes="152x152" href="/api/favicon?size=152&format=png" />
<link rel="apple-touch-icon" sizes="180x180" href="/api/favicon?size=180&format=png" />
<!-- Favicon -->
<link rel="icon" type="image/svg+xml" href="/api/favicon" />
<link rel="apple-touch-icon" href="/api/favicon?size=180" />
<link rel="apple-touch-icon" href="/api/favicon?size=180&format=png" />
<link rel="manifest" href="/manifest.json" />
</head>
+11 -11
View File
@@ -14,67 +14,67 @@
"prefer_related_applications": false,
"icons": [
{
"src": "/api/favicon?size=57",
"src": "/api/favicon?size=57&format=png",
"sizes": "57x57",
"type": "image/png",
"purpose": "any"
},
{
"src": "/api/favicon?size=60",
"src": "/api/favicon?size=60&format=png",
"sizes": "60x60",
"type": "image/png",
"purpose": "any"
},
{
"src": "/api/favicon?size=72",
"src": "/api/favicon?size=72&format=png",
"sizes": "72x72",
"type": "image/png",
"purpose": "any"
},
{
"src": "/api/favicon?size=76",
"src": "/api/favicon?size=76&format=png",
"sizes": "76x76",
"type": "image/png",
"purpose": "any"
},
{
"src": "/api/favicon?size=114",
"src": "/api/favicon?size=114&format=png",
"sizes": "114x114",
"type": "image/png",
"purpose": "any"
},
{
"src": "/api/favicon?size=120",
"src": "/api/favicon?size=120&format=png",
"sizes": "120x120",
"type": "image/png",
"purpose": "any"
},
{
"src": "/api/favicon?size=144",
"src": "/api/favicon?size=144&format=png",
"sizes": "144x144",
"type": "image/png",
"purpose": "any"
},
{
"src": "/api/favicon?size=152",
"src": "/api/favicon?size=152&format=png",
"sizes": "152x152",
"type": "image/png",
"purpose": "any"
},
{
"src": "/api/favicon?size=180",
"src": "/api/favicon?size=180&format=png",
"sizes": "180x180",
"type": "image/png",
"purpose": "any"
},
{
"src": "/api/favicon?size=192",
"src": "/api/favicon?size=192&format=png",
"sizes": "192x192",
"type": "image/png",
"purpose": "any maskable"
},
{
"src": "/api/favicon?size=512",
"src": "/api/favicon?size=512&format=png",
"sizes": "512x512",
"type": "image/png",
"purpose": "any maskable"