Skip to content

Commit 1994e14

Browse files
ariel-frischerariel-frischer
committed
feat(app.html): add favicon and PWA support with icons and manifest file
Add various favicon sizes, an Apple Touch Icon, and a Web App Manifest to enhance the application's branding and support for Progressive Web Apps (PWA). This improves user experience by providing a consistent icon across different platforms and devices, and allows the app to be installed on mobile devices.
1 parent b2f02c6 commit 1994e14

File tree

8 files changed

+53
-0
lines changed

8 files changed

+53
-0
lines changed

‎src/app.html‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,26 @@
33
<head>
44
<meta charset="utf-8" />
55
<meta name="viewport" content="width=device-width, initial-scale=1" />
6+
7+
<!-- Favicon -->
8+
<link rel="icon" type="image/svg+xml" href="%sveltekit.assets%/favicon.svg" />
9+
<link rel="alternate icon" type="image/x-icon" href="%sveltekit.assets%/favicon.ico" />
10+
<link rel="icon" type="image/png" sizes="32x32" href="%sveltekit.assets%/favicon-32x32.png" />
11+
<link rel="icon" type="image/png" sizes="16x16" href="%sveltekit.assets%/favicon-16x16.png" />
12+
13+
<!-- Apple Touch Icon -->
14+
<link rel="apple-touch-icon" sizes="180x180" href="%sveltekit.assets%/apple-touch-icon.png" />
15+
16+
<!-- PWA Icons -->
17+
<link rel="icon" type="image/png" sizes="192x192" href="%sveltekit.assets%/icon-192x192.png" />
18+
<link rel="icon" type="image/png" sizes="512x512" href="%sveltekit.assets%/icon-512x512.png" />
19+
20+
<!-- Theme Color -->
21+
<meta name="theme-color" content="#1e40af" />
22+
23+
<!-- Web App Manifest -->
24+
<link rel="manifest" href="%sveltekit.assets%/site.webmanifest" />
25+
626
%sveltekit.head%
727
</head>
828
<body data-sveltekit-preload-data="hover">

‎static/apple-touch-icon.png‎

19.9 KB
Loading

‎static/favicon-16x16.png‎

832 Bytes
Loading

‎static/favicon-32x32.png‎

1.7 KB
Loading

‎static/favicon.ico‎

3.54 KB
Binary file not shown.

‎static/icon-192x192.png‎

19.8 KB
Loading

‎static/icon-512x512.png‎

94.1 KB
Loading

‎static/site.webmanifest‎

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
{
2+
"name": "Programming Personality Quiz",
3+
"short_name": "Code Quiz",
4+
"description": "Discover your perfect programming language based on your personality type",
5+
"theme_color": "#1e40af",
6+
"background_color": "#0f172a",
7+
"display": "standalone",
8+
"start_url": "/",
9+
"icons": [
10+
{
11+
"src": "/favicon-16x16.png",
12+
"sizes": "16x16",
13+
"type": "image/png"
14+
},
15+
{
16+
"src": "/favicon-32x32.png",
17+
"sizes": "32x32",
18+
"type": "image/png"
19+
},
20+
{
21+
"src": "/icon-192x192.png",
22+
"sizes": "192x192",
23+
"type": "image/png",
24+
"purpose": "any maskable"
25+
},
26+
{
27+
"src": "/icon-512x512.png",
28+
"sizes": "512x512",
29+
"type": "image/png",
30+
"purpose": "any maskable"
31+
}
32+
]
33+
}

0 commit comments

Comments
 (0)