diff --git a/.changeset/add_maskable_icons_for_pwas.md b/.changeset/add_maskable_icons_for_pwas.md
new file mode 100644
index 000000000..31a141083
--- /dev/null
+++ b/.changeset/add_maskable_icons_for_pwas.md
@@ -0,0 +1,5 @@
+---
+default: minor
+---
+
+Add Android/iOS PWA-specific icon variants.
diff --git a/index.html b/index.html
index 62ce1dabb..c22ea4274 100644
--- a/index.html
+++ b/index.html
@@ -35,55 +35,86 @@
+
+
+
+
+
+
+
diff --git a/public/manifest.json b/public/manifest.json
index 696b875ee..134a5eb4b 100644
--- a/public/manifest.json
+++ b/public/manifest.json
@@ -11,49 +11,166 @@
"theme_color": "#1b1a21",
"icons": [
{
- "src": "./public/android/android-chrome-36x36.png",
- "sizes": "36x36",
- "type": "image/png"
+ "src": "./public/svg/cinny-logo-maskable.svg",
+ "sizes": "any",
+ "type": "image/svg+xml",
+ "purpose": "maskable"
},
{
- "src": "./public/android/android-chrome-48x48.png",
- "sizes": "48x48",
- "type": "image/png"
+ "src": "./public/logo-maskable/cinny-logo-maskable-512x512.png",
+ "sizes": "512x512",
+ "type": "image/png",
+ "purpose": "maskable"
},
{
- "src": "./public/android/android-chrome-72x72.png",
- "sizes": "72x72",
- "type": "image/png"
+ "src": "./public/logo-maskable/cinny-logo-maskable-384x384.png",
+ "sizes": "384x384",
+ "type": "image/png",
+ "purpose": "maskable"
},
{
- "src": "./public/android/android-chrome-96x96.png",
- "sizes": "96x96",
- "type": "image/png"
+ "src": "./public/logo-maskable/cinny-logo-maskable-256x256.png",
+ "sizes": "256x256",
+ "type": "image/png",
+ "purpose": "maskable"
},
{
- "src": "./public/android/android-chrome-144x144.png",
+ "src": "./public/logo-maskable/cinny-logo-maskable-192x192.png",
+ "sizes": "192x192",
+ "type": "image/png",
+ "purpose": "maskable"
+ },
+ {
+ "src": "./public/logo-maskable/cinny-logo-maskable-180x180.png",
+ "sizes": "180x180",
+ "type": "image/png",
+ "purpose": "maskable"
+ },
+ {
+ "src": "./public/logo-maskable/cinny-logo-maskable-167x167.png",
+ "sizes": "167x167",
+ "type": "image/png",
+ "purpose": "maskable"
+ },
+ {
+ "src": "./public/logo-maskable/cinny-logo-maskable-152x152.png",
+ "sizes": "152x152",
+ "type": "image/png",
+ "purpose": "maskable"
+ },
+ {
+ "src": "./public/logo-maskable/cinny-logo-maskable-144x144.png",
"sizes": "144x144",
- "type": "image/png"
+ "type": "image/png",
+ "purpose": "maskable"
},
{
- "src": "./public/android/android-chrome-192x192.png",
- "sizes": "192x192",
- "type": "image/png"
+ "src": "./public/logo-maskable/cinny-logo-maskable-120x120.png",
+ "sizes": "120x120",
+ "type": "image/png",
+ "purpose": "maskable"
},
{
- "src": "./public/android/android-chrome-256x256.png",
- "sizes": "256x256",
- "type": "image/png"
+ "src": "./public/logo-maskable/cinny-logo-maskable-114x114.png",
+ "sizes": "114x114",
+ "type": "image/png",
+ "purpose": "maskable"
},
{
- "src": "./public/android/android-chrome-384x384.png",
- "sizes": "384x384",
- "type": "image/png"
+ "src": "./public/logo-maskable/cinny-logo-maskable-96x96.png",
+ "sizes": "96x96",
+ "type": "image/png",
+ "purpose": "maskable"
+ },
+ {
+ "src": "./public/logo-maskable/cinny-logo-maskable-76x76.png",
+ "sizes": "76x76",
+ "type": "image/png",
+ "purpose": "maskable"
+ },
+ {
+ "src": "./public/logo-maskable/cinny-logo-maskable-72x72.png",
+ "sizes": "72x72",
+ "type": "image/png",
+ "purpose": "maskable"
+ },
+ {
+ "src": "./public/logo-maskable/cinny-logo-maskable-60x60.png",
+ "sizes": "60x60",
+ "type": "image/png",
+ "purpose": "maskable"
+ },
+ {
+ "src": "./public/logo-maskable/cinny-logo-maskable-57x57.png",
+ "sizes": "57x57",
+ "type": "image/png",
+ "purpose": "maskable"
},
{
- "src": "./public/android/android-chrome-512x512.png",
+ "src": "./public/logo-maskable/cinny-logo-maskable-48x48.png",
+ "sizes": "48x48",
+ "type": "image/png",
+ "purpose": "maskable"
+ },
+ {
+ "src": "./public/logo-maskable/cinny-logo-maskable-36x36.png",
+ "sizes": "36x36",
+ "type": "image/png",
+ "purpose": "maskable"
+ },
+ {
+ "src": "./public/svg/cinny-logo.svg",
+ "sizes": "any",
+ "type": "image/svg+xml",
+ "purpose": "any"
+ },
+ {
+ "src": "./public/logo/cinny-logo-512x512.png",
"sizes": "512x512",
- "type": "image/png"
+ "type": "image/png",
+ "purpose": "any"
+ },
+ {
+ "src": "./public/logo/cinny-logo-384x384.png",
+ "sizes": "384x384",
+ "type": "image/png",
+ "purpose": "any"
+ },
+ {
+ "src": "./public/logo/cinny-logo-256x256.png",
+ "sizes": "256x256",
+ "type": "image/png",
+ "purpose": "any"
+ },
+ {
+ "src": "./public/logo/cinny-logo-192x192.png",
+ "sizes": "192x192",
+ "type": "image/png",
+ "purpose": "any"
+ },
+ {
+ "src": "./public/logo/cinny-logo-144x144.png",
+ "sizes": "144x144",
+ "type": "image/png",
+ "purpose": "any"
+ },
+ {
+ "src": "./public/logo/cinny-logo-96x96.png",
+ "sizes": "96x96",
+ "type": "image/png",
+ "purpose": "any"
+ },
+ {
+ "src": "./public/logo/cinny-logo-72x72.png",
+ "sizes": "72x72",
+ "type": "image/png",
+ "purpose": "any"
+ },
+ {
+ "src": "./public/logo/cinny-logo-48x48.png",
+ "sizes": "48x48",
+ "type": "image/png",
+ "purpose": "any"
}
]
}
diff --git a/public/res/apple/apple-touch-icon-114x114.png b/public/res/apple/apple-touch-icon-114x114.png
deleted file mode 100644
index 6b9654552..000000000
Binary files a/public/res/apple/apple-touch-icon-114x114.png and /dev/null differ
diff --git a/public/res/apple/apple-touch-icon-120x120.png b/public/res/apple/apple-touch-icon-120x120.png
deleted file mode 100644
index 657e436e9..000000000
Binary files a/public/res/apple/apple-touch-icon-120x120.png and /dev/null differ
diff --git a/public/res/apple/apple-touch-icon-144x144.png b/public/res/apple/apple-touch-icon-144x144.png
deleted file mode 100644
index a2d3a55eb..000000000
Binary files a/public/res/apple/apple-touch-icon-144x144.png and /dev/null differ
diff --git a/public/res/apple/apple-touch-icon-152x152.png b/public/res/apple/apple-touch-icon-152x152.png
deleted file mode 100644
index 2088a7384..000000000
Binary files a/public/res/apple/apple-touch-icon-152x152.png and /dev/null differ
diff --git a/public/res/apple/apple-touch-icon-167x167.png b/public/res/apple/apple-touch-icon-167x167.png
deleted file mode 100644
index 0f1a60a66..000000000
Binary files a/public/res/apple/apple-touch-icon-167x167.png and /dev/null differ
diff --git a/public/res/apple/apple-touch-icon-180x180.png b/public/res/apple/apple-touch-icon-180x180.png
deleted file mode 100644
index 9d863d8d8..000000000
Binary files a/public/res/apple/apple-touch-icon-180x180.png and /dev/null differ
diff --git a/public/res/apple/apple-touch-icon-57x57.png b/public/res/apple/apple-touch-icon-57x57.png
deleted file mode 100644
index 12dd241f6..000000000
Binary files a/public/res/apple/apple-touch-icon-57x57.png and /dev/null differ
diff --git a/public/res/apple/apple-touch-icon-60x60.png b/public/res/apple/apple-touch-icon-60x60.png
deleted file mode 100644
index 9992a65db..000000000
Binary files a/public/res/apple/apple-touch-icon-60x60.png and /dev/null differ
diff --git a/public/res/apple/apple-touch-icon-72x72.png b/public/res/apple/apple-touch-icon-72x72.png
deleted file mode 100644
index 5b12fd929..000000000
Binary files a/public/res/apple/apple-touch-icon-72x72.png and /dev/null differ
diff --git a/public/res/apple/apple-touch-icon-76x76.png b/public/res/apple/apple-touch-icon-76x76.png
deleted file mode 100644
index 522d74c13..000000000
Binary files a/public/res/apple/apple-touch-icon-76x76.png and /dev/null differ
diff --git a/public/res/logo-maskable/cinny-logo-maskable-114x114.png b/public/res/logo-maskable/cinny-logo-maskable-114x114.png
new file mode 100644
index 000000000..59463adb8
Binary files /dev/null and b/public/res/logo-maskable/cinny-logo-maskable-114x114.png differ
diff --git a/public/res/logo-maskable/cinny-logo-maskable-120x120.png b/public/res/logo-maskable/cinny-logo-maskable-120x120.png
new file mode 100644
index 000000000..4e185fba3
Binary files /dev/null and b/public/res/logo-maskable/cinny-logo-maskable-120x120.png differ
diff --git a/public/res/logo-maskable/cinny-logo-maskable-144x144.png b/public/res/logo-maskable/cinny-logo-maskable-144x144.png
new file mode 100644
index 000000000..f674110ff
Binary files /dev/null and b/public/res/logo-maskable/cinny-logo-maskable-144x144.png differ
diff --git a/public/res/logo-maskable/cinny-logo-maskable-152x152.png b/public/res/logo-maskable/cinny-logo-maskable-152x152.png
new file mode 100644
index 000000000..8de192a1e
Binary files /dev/null and b/public/res/logo-maskable/cinny-logo-maskable-152x152.png differ
diff --git a/public/res/logo-maskable/cinny-logo-maskable-167x167.png b/public/res/logo-maskable/cinny-logo-maskable-167x167.png
new file mode 100644
index 000000000..146db2de3
Binary files /dev/null and b/public/res/logo-maskable/cinny-logo-maskable-167x167.png differ
diff --git a/public/res/logo-maskable/cinny-logo-maskable-180x180.png b/public/res/logo-maskable/cinny-logo-maskable-180x180.png
new file mode 100644
index 000000000..14e2764bd
Binary files /dev/null and b/public/res/logo-maskable/cinny-logo-maskable-180x180.png differ
diff --git a/public/res/logo-maskable/cinny-logo-maskable-192x192.png b/public/res/logo-maskable/cinny-logo-maskable-192x192.png
new file mode 100644
index 000000000..45b3f74d4
Binary files /dev/null and b/public/res/logo-maskable/cinny-logo-maskable-192x192.png differ
diff --git a/public/res/logo-maskable/cinny-logo-maskable-256x256.png b/public/res/logo-maskable/cinny-logo-maskable-256x256.png
new file mode 100644
index 000000000..ebfadb35b
Binary files /dev/null and b/public/res/logo-maskable/cinny-logo-maskable-256x256.png differ
diff --git a/public/res/logo-maskable/cinny-logo-maskable-36x36.png b/public/res/logo-maskable/cinny-logo-maskable-36x36.png
new file mode 100644
index 000000000..f80ba44c3
Binary files /dev/null and b/public/res/logo-maskable/cinny-logo-maskable-36x36.png differ
diff --git a/public/res/logo-maskable/cinny-logo-maskable-384x384.png b/public/res/logo-maskable/cinny-logo-maskable-384x384.png
new file mode 100644
index 000000000..e6fbb3dc0
Binary files /dev/null and b/public/res/logo-maskable/cinny-logo-maskable-384x384.png differ
diff --git a/public/res/logo-maskable/cinny-logo-maskable-48x48.png b/public/res/logo-maskable/cinny-logo-maskable-48x48.png
new file mode 100644
index 000000000..4dd14e8f8
Binary files /dev/null and b/public/res/logo-maskable/cinny-logo-maskable-48x48.png differ
diff --git a/public/res/logo-maskable/cinny-logo-maskable-512x512.png b/public/res/logo-maskable/cinny-logo-maskable-512x512.png
new file mode 100644
index 000000000..e4e31a720
Binary files /dev/null and b/public/res/logo-maskable/cinny-logo-maskable-512x512.png differ
diff --git a/public/res/logo-maskable/cinny-logo-maskable-57x57.png b/public/res/logo-maskable/cinny-logo-maskable-57x57.png
new file mode 100644
index 000000000..cc23be00a
Binary files /dev/null and b/public/res/logo-maskable/cinny-logo-maskable-57x57.png differ
diff --git a/public/res/logo-maskable/cinny-logo-maskable-60x60.png b/public/res/logo-maskable/cinny-logo-maskable-60x60.png
new file mode 100644
index 000000000..6a11f2073
Binary files /dev/null and b/public/res/logo-maskable/cinny-logo-maskable-60x60.png differ
diff --git a/public/res/logo-maskable/cinny-logo-maskable-72x72.png b/public/res/logo-maskable/cinny-logo-maskable-72x72.png
new file mode 100644
index 000000000..35e533ec3
Binary files /dev/null and b/public/res/logo-maskable/cinny-logo-maskable-72x72.png differ
diff --git a/public/res/logo-maskable/cinny-logo-maskable-76x76.png b/public/res/logo-maskable/cinny-logo-maskable-76x76.png
new file mode 100644
index 000000000..197658153
Binary files /dev/null and b/public/res/logo-maskable/cinny-logo-maskable-76x76.png differ
diff --git a/public/res/logo-maskable/cinny-logo-maskable-96x96.png b/public/res/logo-maskable/cinny-logo-maskable-96x96.png
new file mode 100644
index 000000000..0cd72dbf2
Binary files /dev/null and b/public/res/logo-maskable/cinny-logo-maskable-96x96.png differ
diff --git a/public/res/android/android-chrome-144x144.png b/public/res/logo/cinny-logo-144x144.png
similarity index 100%
rename from public/res/android/android-chrome-144x144.png
rename to public/res/logo/cinny-logo-144x144.png
diff --git a/public/res/android/android-chrome-192x192.png b/public/res/logo/cinny-logo-192x192.png
similarity index 100%
rename from public/res/android/android-chrome-192x192.png
rename to public/res/logo/cinny-logo-192x192.png
diff --git a/public/res/android/android-chrome-256x256.png b/public/res/logo/cinny-logo-256x256.png
similarity index 100%
rename from public/res/android/android-chrome-256x256.png
rename to public/res/logo/cinny-logo-256x256.png
diff --git a/public/res/android/android-chrome-36x36.png b/public/res/logo/cinny-logo-36x36.png
similarity index 100%
rename from public/res/android/android-chrome-36x36.png
rename to public/res/logo/cinny-logo-36x36.png
diff --git a/public/res/android/android-chrome-384x384.png b/public/res/logo/cinny-logo-384x384.png
similarity index 100%
rename from public/res/android/android-chrome-384x384.png
rename to public/res/logo/cinny-logo-384x384.png
diff --git a/public/res/android/android-chrome-48x48.png b/public/res/logo/cinny-logo-48x48.png
similarity index 100%
rename from public/res/android/android-chrome-48x48.png
rename to public/res/logo/cinny-logo-48x48.png
diff --git a/public/res/android/android-chrome-512x512.png b/public/res/logo/cinny-logo-512x512.png
similarity index 100%
rename from public/res/android/android-chrome-512x512.png
rename to public/res/logo/cinny-logo-512x512.png
diff --git a/public/res/android/android-chrome-72x72.png b/public/res/logo/cinny-logo-72x72.png
similarity index 100%
rename from public/res/android/android-chrome-72x72.png
rename to public/res/logo/cinny-logo-72x72.png
diff --git a/public/res/android/android-chrome-96x96.png b/public/res/logo/cinny-logo-96x96.png
similarity index 100%
rename from public/res/android/android-chrome-96x96.png
rename to public/res/logo/cinny-logo-96x96.png
diff --git a/public/res/svg/cinny-logo-maskable.svg b/public/res/svg/cinny-logo-maskable.svg
new file mode 100644
index 000000000..1b3b15eb3
--- /dev/null
+++ b/public/res/svg/cinny-logo-maskable.svg
@@ -0,0 +1,60 @@
+
+
diff --git a/public/res/svg/cinny.svg b/public/res/svg/cinny-logo.svg
similarity index 100%
rename from public/res/svg/cinny.svg
rename to public/res/svg/cinny-logo.svg
diff --git a/src/app/features/settings/about/About.tsx b/src/app/features/settings/about/About.tsx
index 1f399991c..44f42c8f6 100644
--- a/src/app/features/settings/about/About.tsx
+++ b/src/app/features/settings/about/About.tsx
@@ -3,7 +3,7 @@ import { Box, Text, IconButton, Icon, Icons, Scroll, Button, config, toRem, Spin
import { Page, PageContent, PageHeader } from '$components/page';
import { SequenceCard } from '$components/sequence-card';
import { SettingTile } from '$components/setting-tile';
-import CinnySVG from '$public/res/svg/cinny.svg';
+import CinnySVG from '$public/res/svg/cinny-logo.svg';
import { clearCacheAndReload } from '$client/initMatrix';
import { useMatrixClient } from '$hooks/useMatrixClient';
import { SequenceCardStyle } from '$features/settings/styles.css';
diff --git a/src/app/pages/client/BackgroundNotifications.tsx b/src/app/pages/client/BackgroundNotifications.tsx
index 2d382fcc7..395718223 100644
--- a/src/app/pages/client/BackgroundNotifications.tsx
+++ b/src/app/pages/client/BackgroundNotifications.tsx
@@ -33,7 +33,7 @@ import {
import { NotificationType, StateEvent } from '$types/matrix/room';
import { createLogger } from '$utils/debug';
import { createDebugLogger } from '$utils/debugLogger';
-import LogoSVG from '$public/res/svg/cinny.svg';
+import LogoSVG from '$public/res/svg/cinny-logo.svg';
import { nicknamesAtom } from '$state/nicknames';
import {
buildRoomMessageNotification,
diff --git a/src/app/pages/client/ClientNonUIFeatures.tsx b/src/app/pages/client/ClientNonUIFeatures.tsx
index d8228ccdd..d9d78772d 100644
--- a/src/app/pages/client/ClientNonUIFeatures.tsx
+++ b/src/app/pages/client/ClientNonUIFeatures.tsx
@@ -14,7 +14,7 @@ import parse from 'html-react-parser';
import { getReactCustomHtmlParser, LINKIFY_OPTS } from '$plugins/react-custom-html-parser';
import { sanitizeCustomHtml } from '$utils/sanitize';
import { roomToUnreadAtom } from '$state/room/roomToUnread';
-import LogoSVG from '$public/res/svg/cinny.svg';
+import LogoSVG from '$public/res/svg/cinny-logo.svg';
import LogoUnreadSVG from '$public/res/svg/cinny-unread.svg';
import LogoHighlightSVG from '$public/res/svg/cinny-highlight.svg';
import NotificationSound from '$public/sound/notification.ogg';
diff --git a/src/app/pages/client/WelcomePage.tsx b/src/app/pages/client/WelcomePage.tsx
index 4b605e59e..91d1d9d5e 100644
--- a/src/app/pages/client/WelcomePage.tsx
+++ b/src/app/pages/client/WelcomePage.tsx
@@ -1,6 +1,6 @@
import { Box, Button, Icon, Icons, Text, config, toRem } from 'folds';
import { Page, PageHero, PageHeroSection } from '$components/page';
-import CinnySVG from '$public/res/svg/cinny.svg';
+import CinnySVG from '$public/res/svg/cinny-logo.svg';
export function WelcomePage() {
return (
diff --git a/src/app/utils/notificationStyle.ts b/src/app/utils/notificationStyle.ts
index 6a616b448..1a0f2fa17 100644
--- a/src/app/utils/notificationStyle.ts
+++ b/src/app/utils/notificationStyle.ts
@@ -1,5 +1,6 @@
-export const DEFAULT_NOTIFICATION_ICON = '/public/res/apple/apple-touch-icon-180x180.png';
-export const DEFAULT_NOTIFICATION_BADGE = '/public/res/apple/apple-touch-icon-72x72.png';
+export const DEFAULT_NOTIFICATION_ICON =
+ '/public/res/logo-maskable/cinny-logo-maskable-180x180.png';
+export const DEFAULT_NOTIFICATION_BADGE = '/public/res/logo-maskable/cinny-logo-maskable-72x72.png';
export const DEFAULT_MESSAGE_PREVIEW = 'new message';
export const ENCRYPTED_MESSAGE_PREVIEW = 'Encrypted message';
diff --git a/src/sw.ts b/src/sw.ts
index 064b293fc..627081914 100644
--- a/src/sw.ts
+++ b/src/sw.ts
@@ -366,8 +366,8 @@ async function handleMinimalPushPayload(
console.debug('[SW push] minimal payload: no session, showing generic notification');
await self.registration.showNotification('New Message', {
body: undefined,
- icon: '/public/res/apple/apple-touch-icon-180x180.png',
- badge: '/public/res/apple/apple-touch-icon-72x72.png',
+ icon: '/public/res/logo-maskable/cinny-logo-maskable-180x180.png',
+ badge: '/public/res/logo-maskable/cinny-logo-maskable-72x72.png',
tag: `room-${roomId}`,
renotify: true,
data: { room_id: roomId, event_id: eventId },
@@ -384,8 +384,8 @@ async function handleMinimalPushPayload(
if (!rawEvent) {
await self.registration.showNotification('New Message', {
body: undefined,
- icon: '/public/res/apple/apple-touch-icon-180x180.png',
- badge: '/public/res/apple/apple-touch-icon-72x72.png',
+ icon: '/public/res/logo-maskable/cinny-logo-maskable-180x180.png',
+ badge: '/public/res/logo-maskable/cinny-logo-maskable-72x72.png',
tag: `room-${roomId}`,
renotify: true,
data: { room_id: roomId, event_id: eventId, user_id: session.userId },
diff --git a/vite.config.ts b/vite.config.ts
index a66f458a8..6f6c7d58d 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -81,7 +81,15 @@ const copyFiles = {
dest: '',
},
{
- src: 'public/res/android',
+ src: 'public/res/logo-maskable',
+ dest: 'public/',
+ },
+ {
+ src: 'public/res/logo',
+ dest: 'public/',
+ },
+ {
+ src: 'public/res/svg',
dest: 'public/',
},
{