feat: add major new features including 6 color palettes, interactive logo mode, and mobile-first improvements

CHANGELOG.md

@@ -2,6 +2,101 @@
 
 All notable changes to the Shadoll Animated Placeholder project will be documented in this file.
 
+## [2.0.0] - 2025-12-28
+
+### Major New Features
+
+- **6 Color Palettes**: Complete color theming system
+  - Default (Purple/Pink/Blue) - original colors
+  - Blue-Yellow (Ocean Sunset) - deep blues with golden yellows
+  - Dark (Deep Space) - moody dark tones
+  - Light (Pastel Dream) - soft pastel colors
+  - Fire (Red/Orange/Yellow) - vibrant warm colors
+  - Nature (Green/Teal) - fresh natural tones
+  - New keyboard shortcut: `P` cycles through palettes
+  - URL parameter: `?palette=blue-yellow`
+
+- **Interactive Logo Mode**: Logo responds to user input
+  - **Desktop**: Logo tilts based on cursor/mouse position
+  - **Mobile**: Logo tilts based on device orientation (gyroscope)
+  - Auto-switching between cursor and gyroscope inputs
+  - ±35° tilt range for dramatic effect
+  - iOS 13+ permission handling for gyroscope
+  - URL parameter: `?logoAnim=interactive`
+
+- **Mixed Mode** (NEW DEFAULT): Best of both worlds
+  - Starts with automatic tilt animation
+  - Becomes interactive when cursor/device moves
+  - Returns to auto tilt after 2 seconds of inactivity
+  - Seamless transitions between modes
+  - URL parameter: `?logoAnim=mixed`
+
+- **Apple-Style Liquid Glass UI**: Modern, vibrant design system
+  - Help window with frosted glass effect
+  - Toast notifications with glass styling
+  - Heavy blur (40px) with color saturation (180%)
+  - Multi-layered shadows for depth
+  - Smooth bouncy animations
+  - Gradient backgrounds with inset highlights
+
+### Mobile-First Improvements
+
+- **Responsive Logo Sizing**: Logo optimized for all devices
+  - Mobile: ~60% of screen height (was ~10%)
+  - Unified viewBox approach (900×900) for all devices
+  - No more separate mobile/desktop scaling
+  - Maintains animation space while prioritizing visibility
+
+- **Touch-Friendly Controls**:
+  - All kbd buttons clickable on touch devices
+  - Simulates keyboard events when tapped
+  - Help button repositioned to bottom-right on all devices
+  - Larger touch targets on mobile
+
+- **Enhanced Interactive Sensitivity**:
+  - Increased tilt range: ±20° → ±35°
+  - Improved gyroscope sensitivity (60-100% more responsive)
+  - More dramatic, visible movements on mobile
+
+### UI/UX Enhancements
+
+- **Help System Improvements**:
+  - Multiple help toggles: `H`, `?`, `/` keys
+  - `ESC` key closes help window
+  - Toast notifications moved to top
+  - Help button always at bottom-right corner
+  - Removed duplicate/conflicting media query styles
+
+- **Footer**: Added copyright notice at bottom center
+  - Semi-transparent white text
+  - Subtle shadow for visibility
+  - Responsive sizing
+
+### Changed
+
+- **Default Animation**: Changed from `tilt` to `mixed`
+- **ViewBox Strategy**: Unified single viewBox for all devices (mobile-first)
+- **Help Button Position**: Fixed to bottom-right on all screen sizes
+- **Palette Display**: Toast now shows current palette name
+
+### Technical Improvements
+
+- Removed CSS transform scaling conflicts
+- Cleaner responsive media queries (removed duplicates)
+- Improved JavaScript viewBox management
+- Better auto-detection of input methods
+- Enhanced idle detection for mixed mode
+
+### Files Modified
+- [index.html](index.html) - Added palette param, footer, data-key attributes
+- [css/styles.css](css/styles.css) - 6 palettes, liquid glass styles, mobile fixes
+- [js/app.js](js/app.js) - Interactive controller, viewBox setup, palette cycling
+- [README.md](README.md) - Updated features and examples
+- [TODO.md](TODO.md) - Marked completed tasks
+- [CHANGELOG.md](CHANGELOG.md) - This file
+
+---
+
 ## [1.1.0] - 2025-12-27
 
 ### Added