PSP-8566 : FT: Lease & Licences - Tenants: Select Tenants button gets… #4109
Conversation
… blue after clicking on it.
|
✅ No secrets were detected in the code. |
| @@ -19,7 +19,10 @@ export const SectionListHeader: React.FunctionComponent< | |||
| React.PropsWithChildren<ISectionListHeaderProps> | |||
| > = props => { | |||
| const { hasClaim } = useKeycloakWrapper(); | |||
| const onClick = () => props.onAdd && props.onAdd(); | |||
| const onClick = (e): void => { | |||
There was a problem hiding this comment.
@eddherrera I think this bug is a styling issue (CSS) not a functionality issue (JS).
try something like this in the styles.ts for the add button:
export const StyledAddButton = styled(Button)
&.btn.btn-primary {
background-color: ${props => props.theme.bcTokens.iconsColorSuccess};
}
&.btn.btn-primary:active,
&.btn.btn-primary:focus {
background-color: ${props => props.theme.bcTokens.iconsColorSuccess};
outline-color: ${props => props.theme.css.pimsGreen80};
}
&.btn.btn-primary:hover {
background-color: ${props => props.theme.css.pimsGreen80};
}
;
There was a problem hiding this comment.
@devinleighsmith not so sure about this one. The styling definitions are as expected. This is a well-known issue with many workarounds. Either bootstrap or react is not resetting the button state.
There was a problem hiding this comment.
Hmm, is this an issue with other buttons? I think the problem here is that a green button turns blue, not that it goes into some kind of "clicked" state that isn't reset properly.
There was a problem hiding this comment.
Confirmed with reporter the issue is setting the focus to last active element after modal is closed. Which is a bootstrap modal option. So I am turning it off.
|
✅ No secrets were detected in the code. |
… blue after clicking on it.