This has been asked before, but in my case I can not change CSS (opacity -> rgba) of the parent.
I have a tooltip react component in a button that I need to display when the button is disabled (opacity: 0.65). Button has classes from bootstrap, so can not be changed. I need to fully remove transparency on the tooltip. Is there a way to solve this?
Code:
const showTooltip = () => {
if (ALLOW_CREATION) return null;
return (
<a href={"#"}>{gettext('Info to show on a tooltip')}</a>
);
};
<button
type="button"
className={classnames('btn btn-icon text-uppercase pull-right', {
disabled: !ALLOW_CREATION,
})}
onClick={this.openModal}
disabled={!ALLOW_CREATION}
>
<Tooltip
content={showTooltip()}
style={{
fontSize: '85%',
width: '220',
padding: 3,
whiteSpace: 'normal',
textTransform: 'none',
opacity: 1,
}}
leftOffset={-1}
topOffset={-2}
noBreak={false}
>
{gettext('Push button')}
</Tooltip>
</button>