mozempk/insta-recipe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
81 Commits 2 Branches 0 Tags
22280d5536abc0fcdac03a6c2a97bcfef651dfeb
Commit Graph

4 Commits

Author SHA1 Message Date
Giancarmine Salucci
22280d5536 feat(pwa): dynamic theme-color meta tags + transparent/dark mode icons
All checks were successful
Build & Push Docker Image / test-and-build (push) Successful in 1m3s
Details 
- +layout.svelte: replace Svelte logo favicon with actual InstaChef icons;
  add two <meta name="theme-color"> tags with media queries so the browser
  chrome (mobile top bar) matches --bg for light (#FFF8F5) and dark (#110510);
  add <meta name="color-scheme" content="dark light">
- manifest.json: split 'any maskable' into separate 'any' and 'maskable' entries;
  maskable uses icon-512-maskable.png (icon with 10% safe-zone padding on gradient bg)
- New icons:
  - icon-256/512.png → replaced with transparent-background versions
  - icon-256/512-transparent.png → white bg removed via flood-fill BFS
  - icon-256/512-dark.png → transparent icon on brand gradient (#833AB4→#E1306C)
  - icon-512-maskable.png → 80% icon centered on gradient (PWA maskable safe zone)
  - favicon-32.png → 32x32 transparent icon for browser tab
  - favicon.png (192×192) → updated to transparent InstaChef icon

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
 2026-05-12 23:33:57 +02:00
Giancarmine Salucci
573cf49ac5 feat(ui): implement InstaChef design system
Some checks failed
Build & Push Docker Image / test-and-build (push) Failing after 38s
Details 
- Replace Tailwind with IC CSS design tokens (purple/pink/orange brand gradient,
  Lilita One / DM Sans / JetBrains Mono fonts, light+dark theme via data-theme)
- Add all SVG icon components (ic/Bell, BellOff, Check, Chevron, Clipboard,
  Close, Download, External, Filter, Link, Plus, Retry, Search, Settings,
  Share, Spark, Trash, PhasePrepping, PhaseSimmering, PhasePlating)
- Add shared primitives: Chip, RecipeThumb (deterministic gradient swatch),
  CookingPot (animated SVG), PhaseTrack, SectionHead
- Add TopBar with LIVE indicator and notification bell
- Add CookingHero: animated hero card for in-progress items
- Add TimelineRow: queue list row with status badges
- Add EmptyState: gradient hero + dismissible How it works card
- Add RecipeSheet: bottom-sheet detail overlay with phase progress
- Add AddUrlScreen: full-page URL input with clipboard paste
- Add NotificationsScreen: push toggle + SSE status
- Rewrite +page.svelte: screen router (home/addurl/notifs) + RecipeSheet;
  preserves all SSE, retry, remove, filter, auto-subscribe logic
- Rewrite share/+page.svelte: uses AddUrlScreen shell, preserves Share Target
  logic and auto-process on URL param
- Rewrite InstallPrompt.svelte: InstallSheet bottom-sheet design, all PWA logic intact
- Update manifest.json theme_color to #FFF8F5
- 282 unit tests passing (unchanged)

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
 2026-05-12 22:02:47 +02:00
Giancarmine Salucci
3810d0e401 feat(RECIPE-0002): complete iteration 0 — generate PWA icons and update manifest 2026-02-16 12:19:49 +01:00
Giancarmine Salucci
e8bcc09f29 feat(pwa): create native PWA manifest.json 
Story 1: Create Native PWA Manifest
- Extract manifest configuration from vite.config.ts to static/manifest.json
- Preserve exact configuration including share_target for Instagram URLs
- Update app.html to reference new manifest.json location
- Validated JSON syntax successfully

All PWA properties maintained:
- Share target: /share route for external app sharing
- Icons: favicon.png in 192x192 and 512x512 sizes
- Display: standalone mode for PWA installation
- Theme colors: white background and theme colors

Refs: docs/plans/MigrateToNativeSvelteKitPWA.md
 2025-12-22 05:27:17 +01:00