diff --git a/index.html b/index.html
index 45baccb..668621a 100644
--- a/index.html
+++ b/index.html
@@ -3,7 +3,13 @@
+
+
+
+
+
+
Stargirlnails Kiel - Terminbuchung
diff --git a/public/icons/README.md b/public/icons/README.md
new file mode 100644
index 0000000..e226ab4
--- /dev/null
+++ b/public/icons/README.md
@@ -0,0 +1,45 @@
+# PWA Icons Required
+
+This directory must contain the following icon files for proper PWA installation on iOS and Android devices:
+
+## Required Icon Files
+
+### Android Icons
+- **icon-192x192.png** (192×192 pixels)
+ - Used for Android home screen and app drawer
+ - Should have transparent background or match theme color
+ - Include safe zone padding for maskable icons (40px margin)
+
+- **icon-512x512.png** (512×512 pixels)
+ - Used for Android splash screens and high-resolution displays
+ - Should have transparent background or match theme color
+ - Include safe zone padding for maskable icons (102px margin)
+
+### iOS Icon
+- **apple-touch-icon.png** (180×180 pixels)
+ - Used for iOS home screen
+ - Should NOT have transparent background (iOS adds its own rounded corners)
+ - Fill entire canvas with brand colors/logo
+ - iOS automatically applies rounded corners and shadow
+
+## Design Guidelines
+
+1. **Brand consistency**: Use Stargirlnails logo and brand colors
+2. **Theme color**: Primary pink (#ec4899) matches manifest theme_color
+3. **Contrast**: Ensure icon is visible on various backgrounds
+4. **Simplicity**: Icons should be recognizable at small sizes
+5. **No text**: Avoid small text that becomes unreadable when scaled
+
+## Testing
+
+After adding icons:
+- Test on Android: Check home screen icon appearance
+- Test on iOS Safari: Add to home screen and verify icon quality
+- Validate with Lighthouse PWA audit
+
+## Placeholder
+
+Until actual icons are created, you can use a favicon.png (if available) or generate placeholder icons using tools like:
+- https://realfavicongenerator.net/
+- https://www.pwabuilder.com/imageGenerator
+
diff --git a/public/manifest.json b/public/manifest.json
new file mode 100644
index 0000000..267cf3a
--- /dev/null
+++ b/public/manifest.json
@@ -0,0 +1,32 @@
+{
+ "name": "Stargirlnails Kiel - Terminbuchung",
+ "short_name": "Stargirlnails",
+ "description": "Online Terminbuchung für Nagelstudio Stargirlnails in Kiel",
+ "start_url": "/",
+ "scope": "/",
+ "display": "standalone",
+ "background_color": "#ffffff",
+ "theme_color": "#ec4899",
+ "orientation": "portrait",
+ "lang": "de",
+ "icons": [
+ {
+ "src": "/icons/icon-192x192.png",
+ "sizes": "192x192",
+ "type": "image/png",
+ "purpose": "any maskable"
+ },
+ {
+ "src": "/icons/icon-512x512.png",
+ "sizes": "512x512",
+ "type": "image/png",
+ "purpose": "any maskable"
+ },
+ {
+ "src": "/icons/apple-touch-icon.png",
+ "sizes": "180x180",
+ "type": "image/png"
+ }
+ ]
+}
+
diff --git a/src/server/routes/client-entry.tsx b/src/server/routes/client-entry.tsx
index c83dd75..e077c65 100644
--- a/src/server/routes/client-entry.tsx
+++ b/src/server/routes/client-entry.tsx
@@ -30,12 +30,18 @@ export function clientEntry(c: Context) {
}
return c.html(
-
+
+
+
+
+
Stargirlnails Kiel
+
+
{cssFiles && cssFiles.map((css: string) => (
))}