Dark theme inconsistencies in Grid samples

[viktorkombov]

Description

In the dark theme, the Grid has several visual inconsistencies compared to the same components in 22.0.x.

The following elements use colors that do not match the expected dark theme styling:

• Grid scrollbars are displayed with light colors.
• The Paginator uses light colors.
• Group By chips use light colors.
• The Excel Style Filtering dialog uses different colors for some of its items.
• The sorting buttons in the Excel Style Filtering dialog are not highlighted when selected.

Framework

Angular

Angular Version

22

Ignite UI for Angular Version

22.1.0-beta.4

Component / Area

Grid

Browser

Chrome

Operating System

Windows

Steps to Reproduce

1. Use the chore: apply migrations and improve dialog drag sample igniteui-angular-samples#4004 branch in the igniteui-angular-samples repository, or any branch that uses an igniteui-angular version higher than 22.1.0-beta.4.
2. Run the app-lob samples: npm run start:app-lob
3. Open the FinJs Grids with Dock Manager sample.
4. Compare the sample with the same sample currently available in production.

Actual Result

Several Grid-related elements do not use the expected dark theme styling:

• Scrollbars are light.
• The Paginator is light.
• Group By chips are light.
• Items in the Excel Style Filtering dialog have inconsistent colors.
• Selected sorting buttons in the Excel Style Filtering dialog are not visually highlighted.

Expected Result

The Grid and all related UI elements should use consistent dark theme styling, matching the appearance of the same sample in 22.0.x / production.

Selected sorting buttons in the Excel Style Filtering dialog should also have a clear selected/highlighted state.

Reproduction URL

N/A

Attachments