fix: fix PWA for mobile

This commit is contained in:
2026-04-21 08:49:36 +02:00
parent b2a7c1a2e3
commit b7269601eb
3 changed files with 25 additions and 3 deletions

View File

@ -1,10 +1,18 @@
FROM node:22-alpine AS builder FROM node:22 AS builder
RUN apt-get update && apt-get install -y --no-install-recommends librsvg2-bin && rm -rf /var/lib/apt/lists/*
WORKDIR /app WORKDIR /app
COPY package.json package-lock.json* ./ COPY package.json package-lock.json* ./
RUN npm ci RUN npm ci
COPY . . COPY . .
# Generate PNG icons from SVG source
RUN mkdir -p public/icons && \
rsvg-convert -w 192 -h 192 public/icon-source.svg -o public/icons/icon-192.png && \
rsvg-convert -w 512 -h 512 public/icon-source.svg -o public/icons/icon-512.png
RUN npm run build RUN npm run build
FROM nginx:alpine FROM nginx:alpine

View File

@ -0,0 +1,13 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<!-- Background -->
<rect width="512" height="512" rx="96" fill="#0f172a"/>
<!-- Chart line scaled to center safe zone (~360px) -->
<g transform="translate(76, 76) scale(15)">
<polyline points="22 7 13.5 15.5 8.5 10.5 2 17"
fill="none" stroke="#3b82f6" stroke-width="2.2"
stroke-linecap="round" stroke-linejoin="round"/>
<polyline points="16 7 22 7 22 13"
fill="none" stroke="#3b82f6" stroke-width="2.2"
stroke-linecap="round" stroke-linejoin="round"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 570 B

View File

@ -16,9 +16,10 @@ export default defineConfig({
theme_color: '#0f172a', theme_color: '#0f172a',
background_color: '#0f172a', background_color: '#0f172a',
display: 'standalone', display: 'standalone',
start_url: '/',
icons: [ icons: [
{ src: '/icons/icon-192.png', sizes: '192x192', type: 'image/png' }, { src: '/icons/icon-192.png', sizes: '192x192', type: 'image/png', purpose: 'any' },
{ src: '/icons/icon-512.png', sizes: '512x512', type: 'image/png' }, { src: '/icons/icon-512.png', sizes: '512x512', type: 'image/png', purpose: 'any maskable' },
], ],
}, },
workbox: { workbox: {