Apollo theme: UI Issue with Frozen Columns and Selection Mode in Dark Mode

[Vseslavr]

Describe the bug

I'm using the latest Apollo theme and have encountered a UI bug. When using dark mode with frozen columns and selection mode enabled in the data table, the column values overlap with the frozen column values when a row is highlighted.

Reproducer

No response

PrimeReact version

10.2.1 and higher

React version

18.x

Language

TypeScript

Build / Runtime

Next.js

Browser(s)

Chrome 125

Steps to reproduce the behavior

1. Apply the Apollo theme.
2. Enable dark mode.
3. Configure the data table with frozen columns and selection mode enabled.
4. Highlight a row.
5. Observe the overlapping column values.

Expected behavior

Column values should not overlap with frozen column values when a row is highlighted.

[ryan-ju]

I believe this is an issue with the background's alpha value. In Chrome devtool, the selected <td>'s background color is rgba(129, 140, 248, 0.16), which is see through.

If you look at the theme.css file and search for tr.p-highlight, you'll see the alpha value is not 1.

I changed the alpha value to 1 and it's working fine for me now.

[melloware]

@ryan-ju can you sumbit a PR here: https://github.com/primefaces/primereact-sass-theme