feat(web): branded green PWA icons + maskable, installable app polish
Replace the stale blue calendar icon with the real green Calendarr app icon (matching iOS/Android) for the installable web app: - icon-192/512.png regenerated from the branded 1024 app icon - add dedicated maskable icons (192/512) with brand-green safe-zone padding so Android/Chrome render a proper adaptive icon (no white box) - manifest: maskable purpose entries, id, description, lang/dir, categories; theme_color -> brand green (#16713d) - index.html: theme-color -> green, add modern mobile-web-app-capable - favicon.svg + icon.svg recolored to brand green Bump APP_VERSION v89 -> v90. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
@@ -1,4 +1,4 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="#4285f4" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="#2ea05a" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||||
<rect x="3" y="4" width="18" height="18" rx="2"/>
|
<rect x="3" y="4" width="18" height="18" rx="2"/>
|
||||||
<line x1="16" y1="2" x2="16" y2="6"/>
|
<line x1="16" y1="2" x2="16" y2="6"/>
|
||||||
<line x1="8" y1="2" x2="8" y2="6"/>
|
<line x1="8" y1="2" x2="8" y2="6"/>
|
||||||
|
|||||||
|
Before Width: | Height: | Size: 332 B After Width: | Height: | Size: 332 B |
|
Before Width: | Height: | Size: 1.9 KiB After Width: | Height: | Size: 8.4 KiB |
|
Before Width: | Height: | Size: 5.9 KiB After Width: | Height: | Size: 27 KiB |
BIN
frontend/icons/icon-maskable-192.png
Normal file
|
After Width: | Height: | Size: 8.3 KiB |
BIN
frontend/icons/icon-maskable-512.png
Normal file
|
After Width: | Height: | Size: 26 KiB |
@@ -1,5 +1,5 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
|
||||||
<rect width="512" height="512" fill="#4285f4"/>
|
<rect width="512" height="512" fill="#16713d"/>
|
||||||
<g fill="none" stroke="#ffffff" stroke-width="23" stroke-linecap="round" stroke-linejoin="round">
|
<g fill="none" stroke="#ffffff" stroke-width="23" stroke-linecap="round" stroke-linejoin="round">
|
||||||
<rect x="102" y="154" width="307" height="266" rx="26"/>
|
<rect x="102" y="154" width="307" height="266" rx="26"/>
|
||||||
<line x1="102" y1="234" x2="409" y2="234"/>
|
<line x1="102" y1="234" x2="409" y2="234"/>
|
||||||
|
|||||||
|
Before Width: | Height: | Size: 432 B After Width: | Height: | Size: 432 B |
@@ -7,7 +7,8 @@
|
|||||||
<title>Calendarr</title>
|
<title>Calendarr</title>
|
||||||
<link rel="icon" type="image/svg+xml" href="/static/favicon.svg" />
|
<link rel="icon" type="image/svg+xml" href="/static/favicon.svg" />
|
||||||
<link rel="manifest" href="/manifest.json" />
|
<link rel="manifest" href="/manifest.json" />
|
||||||
<meta name="theme-color" content="#4285f4" />
|
<meta name="theme-color" content="#16713d" />
|
||||||
|
<meta name="mobile-web-app-capable" content="yes" />
|
||||||
<meta name="apple-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-status-bar-style" content="black-translucent" />
|
||||||
<meta name="apple-mobile-web-app-title" content="Calendarr" />
|
<meta name="apple-mobile-web-app-title" content="Calendarr" />
|
||||||
|
|||||||
@@ -1,2 +1,2 @@
|
|||||||
// Increment APP_VERSION with every code change
|
// Increment APP_VERSION with every code change
|
||||||
export const APP_VERSION = 'v89';
|
export const APP_VERSION = 'v90';
|
||||||
|
|||||||
@@ -1,12 +1,17 @@
|
|||||||
{
|
{
|
||||||
|
"id": "/",
|
||||||
"name": "Calendarr",
|
"name": "Calendarr",
|
||||||
"short_name": "Calendarr",
|
"short_name": "Calendarr",
|
||||||
|
"description": "Dein privater, selbst gehosteter Kalender.",
|
||||||
|
"lang": "de",
|
||||||
|
"dir": "ltr",
|
||||||
"start_url": "/",
|
"start_url": "/",
|
||||||
"scope": "/",
|
"scope": "/",
|
||||||
"display": "standalone",
|
"display": "standalone",
|
||||||
"orientation": "any",
|
"orientation": "any",
|
||||||
"background_color": "#0e0e14",
|
"background_color": "#0e0e14",
|
||||||
"theme_color": "#4285f4",
|
"theme_color": "#16713d",
|
||||||
|
"categories": ["productivity", "utilities"],
|
||||||
"icons": [
|
"icons": [
|
||||||
{
|
{
|
||||||
"src": "/icons/icon-192.png",
|
"src": "/icons/icon-192.png",
|
||||||
@@ -21,10 +26,16 @@
|
|||||||
"purpose": "any"
|
"purpose": "any"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"src": "/icons/icon.svg",
|
"src": "/icons/icon-maskable-192.png",
|
||||||
"sizes": "any",
|
"sizes": "192x192",
|
||||||
"type": "image/svg+xml",
|
"type": "image/png",
|
||||||
"purpose": "any"
|
"purpose": "maskable"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"src": "/icons/icon-maskable-512.png",
|
||||||
|
"sizes": "512x512",
|
||||||
|
"type": "image/png",
|
||||||
|
"purpose": "maskable"
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|||||||