fix hover color

This commit is contained in:
Nakul Nagargade 2025-03-25 14:21:53 +05:30
parent 16ab953649
commit 25e33d5ac2
2 changed files with 4 additions and 2 deletions

View file

@ -3,6 +3,7 @@ import * as Icons from '@tabler/icons-react';
import cx from 'classnames';
import Loader from '@/ToolJetUI/Loader/Loader';
import './link.scss';
const tinycolor = require('tinycolor2');
export const Link = ({ height, properties, styles, fireEvent, setExposedVariables, dataCy }) => {
const { linkTarget, linkText, targetType, visibility, disabledState, loadingState } = properties;
@ -27,6 +28,7 @@ export const Link = ({ height, properties, styles, fireEvent, setExposedVariable
opacity: isDisabled ? 0.5 : 1,
pointerEvents: isDisabled ? 'none' : 'auto',
fontWeight: '500',
'--link-hover-color': tinycolor(textColor).darken(15).toString(),
};
// eslint-disable-next-line import/namespace
const IconElement = Icons?.[icon] == undefined ? Icons['IconHome2'] : Icons[icon];

View file

@ -1,8 +1,8 @@
.link-widget {
a {
text-underline-offset: 4px; // Adds space between text and underline
text-underline-offset: 32%; // Adds space between text and underline
&:hover {
// color: var(--interactive-overlays-fill-hover) !important;
color: var(--link-hover-color) !important;
}
}
}