Major Features:
- Added complete UI element visibility controls (show/hide any element independently)
- Added system tray icon with live usage percentage display
- Added customizable tray icon colors and update interval (10-300 seconds)
- Added application settings (start on boot, start minimized, close to tray)
- Added theme customization (backgrounds, text colors, borders, opacity controls)
- Added configurable update intervals for both UI and tray (10-300 seconds)
- Added static color mode option for progress bars
- Added dynamic window resizing based on visible elements
UI/UX Improvements:
- Improved settings organization with collapsible sections
- Consistent typography and spacing throughout settings panel
- Larger, bolder section headers for better visual hierarchy
- Removed donations button from settings
- Element visibility controls for both Current Session and Weekly Limit sections
- Master toggles for entire sections
- Independent toggles for labels, bars, percentages, circles, and time text
Bug Fixes:
- Fixed element centering and responsive layout
- Fixed timer container visibility handling when children are hidden
- Fixed slider overlap with text above
- Fixed window resizing to properly fit content
- Fixed manual resizing while maintaining centered content
Technical Changes:
- Changed UI update interval from 1-10 minutes to 10-300 seconds
- Standardized all settings to use .setting-group wrapper class
- Removed inline styles in favor of CSS classes
- Improved CSS organization with consistent spacing rules
- Added proper flexbox centering for responsive layouts
- Window constraints: 320-600px width, 96-180px height
- Resizable window with content-based auto-sizing
Documentation:
- Comprehensive README update with all v1.4.2 features
- Added screenshot placeholders for user documentation
- Detailed settings explanations
- Troubleshooting section expanded
- Version history updated
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Implemented several major enhancements to the Claude Usage Widget:
Features Added:
- Dynamic tray icon with circular progress pie chart showing usage percentage
- Configurable tray display mode (Session/Weekly) and refresh interval (10-300s, default 30s)
- Optional percentage text overlay in tray icon (default: off)
- Independent color customization for tray icon (normal/warning/danger states)
- Static color mode toggle for both main window and tray icon (single color vs gradients)
- Comprehensive theming system for main widget and settings window:
* Background gradient customization
* Primary and secondary text color controls
* Title bar color with opacity slider
* Border color with opacity slider
- Collapsible settings sections with smooth animations (minimized by default)
- Custom dark-themed scrollbar with purple accents matching app theme
- Real-time theme synchronization between main and settings windows
Technical Implementation:
- Zero-dependency tray icon generation using Electron's built-in Canvas API via hidden BrowserWindow
- IPC-based bi-directional communication for real-time theme updates
- Persistent settings storage using electron-store
- Conditional UI rendering for static vs gradient color modes
- All changes maintain upstream compatibility (no external npm dependencies added)
Files Modified:
- main.js: Added icon generator window, tray icon generation, theme IPC handlers
- preload.js: Added IPC methods for tray settings and theme management
- src/renderer/app.js: Added theme application and usage data forwarding
- src/renderer/settings.html: Added theming controls, collapsible sections, toggles
- src/renderer/settings.css: Added styles for new UI components and custom scrollbar
- src/renderer/settings.js: Added theme/tray settings logic with real-time updates
Files Added:
- src/icon-generator.html: Hidden window for canvas-based tray icon generation
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
- Remove CHANGES.md (development planning document)
- Revert author field to original (contributors credited via git)
- Remove personal .gitignore entry
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
- Add customizable color preferences feature to Features section
- Document new Settings panel accessible from system tray
- Add comprehensive Color Preferences section with usage instructions
- Include settings window screenshot
- Update roadmap to reflect completed features (Settings panel, Custom colors)
- Bump version to 1.4.0
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
## New Features
- **Customizable Progress Bar Colors**: Users can now customize the colors for normal, warning, and danger states through a dedicated settings window
- **Separate Settings Window**: Settings now open in a frameless, resizable window (500x680px) with live preview of color changes
- **CSS Variables**: Converted hardcoded colors to CSS custom properties for dynamic theming
## Files Modified
- **main.js**: Added settings window creation, color preference storage (electron-store), and IPC handlers
- **preload.js**: Exposed color preference and settings IPC methods to renderer
- **app.js**: Implemented color preference loading and live updates from settings window
- **styles.css**: Added CSS variables for customizable colors, updated scrollbar styling
- **index.html**: Removed unused settings overlay
- **.gitignore**: Added CLAUDE_NOTES.md to prevent credential leaks
## Files Added
- **src/renderer/settings.html**: Settings window UI with 2-column color picker layout
- **src/renderer/settings.js**: Settings window logic and color management
- **src/renderer/settings-styles.css**: Settings window styling
- **CHANGES.md**: Tracking document for modifications
## Technical Details
- Color preferences stored in electron-store with encryption
- Live color updates via IPC communication between settings and main windows
- Default color scheme: Purple (normal), Orange (warning), Red (danger)
- Settings accessible via tray menu or settings button
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
