Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improve hyperlinks rendering in tables #3599

Open
wants to merge 1 commit into
base: develop
Choose a base branch
from

Conversation

L20L021902
Copy link

@L20L021902 L20L021902 commented Jul 11, 2022

Description

This PR adds cma css class to a tag when table is rendered. It also removes href attribute from a tag and adds title attribute with links.

Changes

  • Changes are done in table-editor.ts file. All a tags selected then loop through the tags. If a tag does not contain cma class then add the class to it.
  • The link-tooltips.ts search cma class and title to add tooltip on mouse hover. So, href removed and title added to a tags.

// Only for links with cma-class
if (a.tagName !== 'A' || !a.classList.contains('cma')) {
return
}
// If there's already a tippy on the instance, don't re-render it
if ('_tippy' in a) {
return
}
// Retrieve the link target
const linkTarget = a.getAttribute('title')

Additional information

Closes #2213

Tested on: Windows 11

image

@boring-cyborg
Copy link

boring-cyborg bot commented Jul 11, 2022

Thank you for opening your first PR! 🎉 We are very happy and would like to thank you very much for your contribution. If everything checks out, we'll make sure to review the PR as soon as possible and give feedback. In the meantime, to make the reviewing process as fast as possible, you can help us by checking the following things:

  • Did you follow the JSStandard coding style? - Did you comment everywhere where the necessity of a piece of code or the
    way it was implemented is not immediately obvious?
  • Did you attempt to stick as much to current coding habits as possible?
    (Note that this does not apply to pieces of code where we ourselves
    obviously violated good coding practices, which unfortunately happens
    sometimes. But please indicate this in your PR so that we know what you
    rectified!)

Furthermore, make sure that the linter does not complain, which will check your code on every new commit. If the linter task fails, make sure to run yarn lint locally and check the file eslint_report.htm which will tell you precisely what went wrong.
Stay sharp, and thanks again!

Copy link
Member

@nathanlesage nathanlesage left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In general a good idea, but it would be great if you could check my suggestion if that works as well, as it's then less prone to break.

Copy link
Member

@nathanlesage nathanlesage left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

A few minor changes making the code more efficient & readable

@krmanik
Copy link

krmanik commented Jul 13, 2022

A few minor changes making the code more efficient & readable

I have updated it.

create a function to add cma class to `a` tag
remove href from `a` tag and add title with url
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Enhancement] Improve hyperlinks rendering in tables
3 participants