Skip to content

Conversation

chandanshyam
Copy link

fix(theme): Improve sidebar text color contrast with dynamic calculation

  • Add dynamic sidebar text color calculation based on background lightness
  • Implement calculateSidebarTextColor method in ThemeService
  • Update CSS to use CSS custom properties for sidebar text color
  • Add comprehensive unit tests for text color contrast calculation
  • Enhance theme adaptability by dynamically adjusting text color
  • Provide fallback color values for consistent readability

Changes made to:

  • src/gui/src/css/style.css

  •    Added Dynamic color Change support for Sidebar text through a css variable
    
  • src/gui/src/services/ThemeService.js

  • Added a Function CalculateSidebarColor Function to determine Sidebar text Color Based on background lightness

  • adjust the sidebar color based on lightness and contrast threshold dynamically

Added a new TestFile

  • src/gui/test/theme_service.test.js
  • to test the sidebar text color at different lightness and saturation levels

Steps to Test
run command(In terminal)/ run this test:
npx mocha src/gui/test/theme_service.test.js --reporter spec
check if all 9 testCases Pass

- Add dynamic sidebar text color calculation based on background lightness
- Implement `calculateSidebarTextColor` method in ThemeService
- Update CSS to use CSS custom properties for sidebar text color
- Add comprehensive unit tests for text color contrast calculation
- Enhance theme adaptability by dynamically adjusting text color
- Provide fallback color values for consistent readability
@chandanshyam chandanshyam changed the title Solution for Issue #2 - [BUG] Sidebar header text unreadable with certain theme lightness settings Fix Issue #2 - [BUG] Sidebar header text unreadable with certain theme lightness settings Oct 18, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant