till/managarten
1
0
Fork 0
mirror of https://github.com/Memo-2023/mana-monorepo.git synced 2026-05-14 22:21:10 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 4

fix(storage): add PWA icons and meta tags to fix build and enable install

Browse source 
The prerendered /offline page referenced /favicon.png which didn't exist,
causing Docker build failure. Added favicon.svg, generated all PWA icons,
and added proper PWA meta tags to app.html.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Till JS 2026-03-24 19:22:16 +01:00
parent 994abf3ece
commit 91daba062f
7 changed files with 63 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

21
apps/storage/apps/web/scripts/generate-icons.mjs Normal file
View file

@ -0,0 +1,21 @@
#!/usr/bin/env node
import { readFileSync } from 'fs';
import { join, dirname } from 'path';
import { fileURLToPath } from 'url';
const __dirname = dirname(fileURLToPath(import.meta.url));
const staticDir = join(__dirname, '..', 'static');
const sizes = [
{ name: 'favicon.png', size: 32 },
{ name: 'pwa-192x192.png', size: 192 },
{ name: 'pwa-512x512.png', size: 512 },
{ name: 'apple-touch-icon.png', size: 180 },
];
async function generateIcons() {
const sharp = (await import('sharp')).default;
const svgBuffer = readFileSync(join(staticDir, 'favicon.svg'));
for (const { name, size } of sizes) {
await sharp(svgBuffer).resize(size, size).png().toFile(join(staticDir, name));
console.log(`Generated: ${name} (${size}x${size})`);
}
}
generateIcons();

21
apps/storage/apps/web/src/app.html
View file

@ -2,10 +2,23 @@
<html lang="de">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="description" content="Storage - Dein sicherer Cloud-Speicher für Dateien, Ordner und mehr. Hochladen, organisieren und teilen." />
<meta name="theme-color" content="#64748b" />
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
<!-- PWA Meta Tags -->
<meta name="theme-color" content="#06b6d4" />
<meta name="application-name" content="Storage" />
<meta name="description" content="Storage - Dein sicherer Cloud-Speicher für Dateien, Ordner und mehr." />
<!-- PWA/iOS Meta Tags -->
<meta name="mobile-web-app-capable" content="yes" />
<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="Storage" />
<link rel="apple-touch-icon" href="%sveltekit.assets%/apple-touch-icon.png" />
<!-- Favicon -->
<link rel="icon" type="image/svg+xml" href="%sveltekit.assets%/favicon.svg" />
<link rel="icon" type="image/png" sizes="32x32" href="%sveltekit.assets%/favicon.png" />
<meta property="og:type" content="website" />
<meta property="og:title" content="Storage - Cloud Drive" />
<meta property="og:description" content="Dein sicherer Cloud-Speicher für Dateien, Ordner und mehr." />

BIN
apps/storage/apps/web/static/apple-touch-icon.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 4.7 KiB

BIN
apps/storage/apps/web/static/favicon.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 959 B

25
apps/storage/apps/web/static/favicon.svg Normal file
View file

@ -0,0 +1,25 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<defs>
<linearGradient id="bg" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:#06b6d4"/>
<stop offset="100%" style="stop-color:#0891b2"/>
</linearGradient>
</defs>
<rect width="512" height="512" rx="96" ry="96" fill="url(#bg)"/>
<!-- Folder base -->
<path d="M120 200 L120 380 Q120 400 140 400 L372 400 Q392 400 392 380 L392 200 Z" fill="rgba(255,255,255,0.2)"/>
<!-- Folder tab -->
<path d="M120 200 L120 170 Q120 150 140 150 L220 150 L240 170 L260 150 L392 150 Q392 150 392 170 L392 200 Z" fill="rgba(255,255,255,0.3)"/>
<!-- Cloud icon -->
<g fill="white" opacity="0.9">
<ellipse cx="256" cy="290" rx="60" ry="40"/>
<ellipse cx="220" cy="300" rx="40" ry="35"/>
<ellipse cx="290" cy="300" rx="40" ry="35"/>
<rect x="196" y="295" width="120" height="40" rx="0"/>
</g>
<!-- Upload arrow -->
<g stroke="rgba(6,182,212,0.8)" stroke-width="16" stroke-linecap="round" fill="none">
<line x1="256" y1="320" x2="256" y2="265"/>
<polyline points="232,285 256,265 280,285"/>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.1 KiB

BIN
apps/storage/apps/web/static/pwa-192x192.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 4.9 KiB

BIN
apps/storage/apps/web/static/pwa-512x512.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 16 KiB