Elgato_dark/ToolJet
1
0
Fork 0
mirror of https://github.com/ToolJet/ToolJet synced 2026-05-23 17:08:34 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Merge pull request #12465 from ToolJet/link-comp-bugs

Browse source 
[BugFixes] : fix link QA bugs
This commit is contained in:
Johnson Cherian 2025-04-23 09:35:10 +05:30 committed by GitHub
commit c00a32aac5
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 28 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
frontend/src/Editor/Components/Link/Link.jsx
View file

@ -19,8 +19,7 @@ export const Link = ({ height, properties, styles, fireEvent, setExposedVariable
const computedStyles = { const computedStyles = {
display: 'flex', display: 'flex',
alignItems: verticalAlignment === 'top' ? 'flex-start' : verticalAlignment === 'center' ? 'center' : 'flex-end', alignItems: verticalAlignment === 'top' ? 'flex-start' : verticalAlignment === 'center' ? 'center' : 'flex-end',
justifyContent: textAlign: horizontalAlignment === 'left' ? 'left' : horizontalAlignment === 'center' ? 'center' : 'right',
horizontalAlignment === 'left' ? 'flex-start' : horizontalAlignment === 'center' ? 'center' : 'flex-end',
height: '100%', height: '100%',
width: '100%', width: '100%',
boxShadow, boxShadow,
@ -113,10 +112,20 @@ export const Link = ({ height, properties, styles, fireEvent, setExposedVariable
onMouseOver={() => { onMouseOver={() => {
fireEvent('onHover'); fireEvent('onHover');
}} }}
style={{ color: textColor, fontSize: textSize, cursor: isDisabled ? 'not-allowed' : 'pointer' }} style={{ width: '100%' }}
ref={clickRef} ref={clickRef}
> >
<span className="d-flex justify-content-center"> <span
className="d-flex"
style={{
fontSize: textSize,
cursor: 'auto',
justifyContent:
horizontalAlignment === 'left' ? 'flex-start' : horizontalAlignment === 'center' ? 'center' : 'flex-end',
color: textColor,
paddingBottom: verticalAlignment === 'bottom' ? '1px' : '0px',
}}
>
{iconVisibility && ( {iconVisibility && (
<IconElement <IconElement
style={{ style={{
@ -130,7 +139,7 @@ export const Link = ({ height, properties, styles, fireEvent, setExposedVariable
stroke={1.5} stroke={1.5}
/> />
)} )}
{linkTextState} <span className="link-text">{linkTextState}</span>
</span> </span>
</a> </a>
</div> </div>

18
frontend/src/Editor/Components/Link/link.scss
View file

@ -1,8 +1,18 @@
.link-widget { .link-widget {
a { a {
text-underline-offset: 32%; // Adds space between text and underline text-decoration: none !important;
&:hover { pointer-events: none;
color: var(--link-hover-color) !important; cursor: none !important;
}
.link-text {
pointer-events: all;
text-underline-offset: 32%; // Adds space between text and underline
cursor: pointer;
&:hover {
text-decoration: underline;
text-decoration-color: var(--link-hover-color) !important;
color: var(--link-hover-color) !important;
}
} }
}
} }