RI-7774 Fix Copilot button styles #5243
Conversation
valkirilov
changed the title
valkirilov
requested review from
ArtemHoruzhenko,
DimoHG,
KrumTy,
dantovska,
pawelangelow and
pd-redis
as code owners
…onents Migrated CopilotTrigger component from SCSS modules to styled-components following the project's migration guidelines. Replaced styles.module.scss with CopilotTrigger.styles.ts using FlexGroup and IconButton styled components. Removed classnames dependency and improved type safety. References: #RI-7774
valkirilov
force-pushed
the
refactor/RI-7774/migrate-copilot-trigger-styles
branch
from
4eaf25d to
70f78ce
Compare
![cursor[bot]](https://avatars.githubusercontent.com/in/1210556?s=60&v=4){kind=small}
| isOpen && | ||
| css` | ||
| background-color: ${({ theme }) => | ||
| theme.semantic.color.background.primary200}; |
There was a problem hiding this comment.
Bug: Missing important flag on background color
The background-color property when isOpen is true lacks the !important flag that was present in the original SCSS implementation. The similar BulbIconButton in the insights trigger uses !important for the same property. Without this flag, the background color may not apply correctly if conflicting styles exist with higher specificity, breaking the visual indication that the panel is open.
| svg { | ||
| width: 21px; | ||
| height: 21px; | ||
| color: var(--triggerIconActiveColor); |
There was a problem hiding this comment.
Bug: Missing important flag on SVG color
The SVG color property lacks the !important flag that was present in the original SCSS implementation. Without this flag, the icon color may be overridden by other styles with higher specificity, potentially breaking the visual appearance of the Copilot icon.
redisinsight/ui/src/components/triggers/copilot-trigger/CopilotTrigger.styles.ts
Show resolved
Hide resolved
redisinsight/ui/src/components/triggers/copilot-trigger/CopilotTrigger.styles.ts
Show resolved
Hide resolved
![jit-ci[bot]](https://avatars.githubusercontent.com/in/142441?s=60&v=4){kind=small}
There was a problem hiding this comment.
❌ The following Jit checks failed to run:
- secret-detection-trufflehog
#jit_bypass_commit in this PR to bypass, Jit Admin privileges required.
More info in the Jit platform.
See #5247