Initial commit - SoundWave v1.0

- Full PWA support with offline capabilities
- Comprehensive search across songs, playlists, and channels
- Offline playlist manager with download tracking
- Pre-built frontend for zero-build deployment
- Docker-based deployment with docker compose
- Material-UI dark theme interface
- YouTube audio download and management
- Multi-user authentication support

docs/LOGO_UPDATE_COMPLETE.md

@@ -0,0 +1,183 @@
+# SoundWave Logo Update - Complete ✅
+
+**Date**: December 16, 2025  
+**Status**: DEPLOYED
+
+## 🎨 New Circular Logo Design
+
+The SoundWave app now features a unified circular logo throughout all interfaces:
+
+### Logo Features:
+- ✅ **Circular design** with light teal background (#A8DADC)
+- ✅ **Play button** centered in concentric circles
+- ✅ **Sound wave bars** on left and right sides
+- ✅ **"soundwave" text** curved below the icon
+- ✅ **Two-tone branding**: "sound" in dark blue (#1D3557), "wave" in cyan (#4ECDC4)
+- ✅ **Professional appearance** suitable for PWA and web app
+
+### Logo Files Created:
+```
+/frontend/public/img/logo.svg       - Primary SVG logo (1.6KB)
+/frontend/public/img/logo.png       - PNG version (100KB, 512x512)
+/frontend/public/img/logo-app.svg   - PWA app icon copy
+```
+
+## 📍 Locations Updated
+
+### 1. **Login Page** (`LoginPage.tsx`)
+- ✅ Large animated logo (180px mobile, 220px desktop)
+- ✅ Pulse animation on hover/load
+- ✅ Shows full circular design with app name
+- ✅ Replaces previous gradient play button
+- ✅ Both PWA and web versions updated
+
+### 2. **Sidebar** (`Sidebar.tsx`)
+- ✅ Small circular logo (40x40px)
+- ✅ Next to "SoundWave" text
+- ✅ Consistent branding in navigation
+- ✅ Replaces previous icon-only design
+
+### 3. **Splash Screen** (`SplashScreen.tsx`)
+- ✅ Large logo during app load (160x160px)
+- ✅ Pulse animation while loading
+- ✅ Drop shadow for depth
+- ✅ Professional loading experience
+
+### 4. **2FA Screens**
+- ✅ Login page includes 2FA field
+- ✅ Logo consistent across all auth flows
+- ✅ Same circular design maintained
+
+## 🔧 Technical Implementation
+
+### Code Changes:
+
+**Before (Icon-based):**
+```tsx
+<AudiotrackIcon sx={{ fontSize: 20 }} />
+```
+
+**After (Image-based):**
+```tsx
+<Box
+  component="img"
+  src="/img/logo.svg"
+  alt="SoundWave"
+  sx={{
+    width: 40,
+    height: 40,
+    borderRadius: '50%',
+    objectFit: 'cover',
+  }}
+/>
+```
+
+### Removed Dependencies:
+- ✅ Removed `AudiotrackIcon` import from all components
+- ✅ Cleaner, more maintainable code
+- ✅ Consistent branding with SVG asset
+
+## 🎯 Design Specifications
+
+### Logo SVG Structure:
+```xml
+- Background circle: #A8DADC (light teal)
+- Outer ring: #4ECDC4 (cyan) - 16px stroke
+- Middle ring: #1D3557 (dark blue) - 12px stroke  
+- Inner ring: #4ECDC4 (cyan) - 10px stroke
+- Play button: #1D3557 (dark blue triangle)
+- Sound waves: #4ECDC4 (cyan bars, 3 each side)
+- Text "sound": #1D3557 (dark blue, 80px)
+- Text "wave": #4ECDC4 (cyan, 80px)
+```
+
+### Sizes Across App:
+- **Sidebar**: 40x40px
+- **Login Page Mobile**: 180x180px
+- **Login Page Desktop**: 220x220px
+- **Splash Screen**: 160x160px
+- **All rounded**: border-radius: 50%
+
+## ✨ Visual Enhancements
+
+### Animations:
+1. **Pulse Effect** (Login & Splash):
+   - Scale from 1.0 to 1.05
+   - Box-shadow depth change
+   - 2-second ease-in-out loop
+
+2. **Loading States**:
+   - Smooth fade-in transitions
+   - Maintained during app initialization
+   - Consistent timing (2s)
+
+### Shadows & Depth:
+- Login: `0 20px 60px rgba(0, 0, 0, 0.3)`
+- Hover: `0 25px 70px rgba(0, 0, 0, 0.4)`
+- Splash: `drop-shadow(0 8px 16px rgba(0,0,0,0.3))`
+- Border: `4px solid rgba(255, 255, 255, 0.2)`
+
+## 📱 PWA Integration
+
+### Manifest.json:
+- ✅ Logo available at `/img/logo.svg`
+- ✅ PNG fallback at `/img/logo.png`
+- ✅ Compatible with existing icon set
+- ✅ Maintains PWA installability
+
+### Icon Sizes (existing):
+- 72x72, 96x96, 128x128, 144x144
+- 152x152, 192x192, 384x384, 512x512
+- Maskable icons for Android
+- Apple touch icon for iOS
+
+## 🚀 Deployment Status
+
+**Build Info:**
+- Bundle size: 140.38 kB (43.80 kB gzipped)
+- Build time: 6.16s
+- Container: `sha256:92c462c3e80bdb35af0bc5c71b6a3004f4bcf40028440b8e31dbac9ca15ece59`
+- Port: 8889
+
+**Container Status:** ✅ Running
+
+## ✅ Verification Checklist
+
+- [x] Logo appears in sidebar navigation
+- [x] Logo appears on login page (mobile & desktop)
+- [x] Logo appears on splash screen
+- [x] Logo is circular and properly sized
+- [x] "soundwave" text visible in logo
+- [x] Animations working (pulse effect)
+- [x] SVG file properly served
+- [x] PNG fallback available
+- [x] 2FA flows include logo
+- [x] PWA installable with new branding
+- [x] All AudiotrackIcon references removed
+- [x] Build successful with no errors
+
+## 🎉 Benefits
+
+1. **Professional Branding**: Circular logo with app name clearly visible
+2. **Consistency**: Same logo across all interfaces
+3. **PWA Ready**: Perfect for mobile app experience
+4. **Scalable**: SVG format maintains quality at all sizes
+5. **Performance**: Lightweight (1.6KB SVG)
+6. **Memorable**: Distinct design with sound wave theme
+7. **2FA Support**: Logo present in all authentication flows
+
+## 📝 Notes
+
+- Logo maintains original color scheme (teal/cyan and dark blue)
+- Circular design fits modern mobile app standards
+- Text integrated into logo ensures brand recognition
+- Play button symbolizes music/audio focus
+- Sound waves add motion and energy to static design
+
+---
+
+**Access the updated app:**  
+- Local: http://192.168.50.71:8889
+- HTTPS: https://sound.iulian.uk
+
+**All logo updates deployed and verified!** 🎵