-
Notifications
You must be signed in to change notification settings - Fork 5k
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
fix(ui): Add title for full content without clicking (issue #17600) #18243
fix(ui): Add title for full content without clicking (issue #17600) #18243
Conversation
d6e8715
to
662e0a3
Compare
Signed-off-by: sunyeongchoi <suoung0716@gmail.com>
662e0a3
to
00512f7
Compare
Signed-off-by: sunyeongchoi <suoung0716@gmail.com>
<div className='columns small-1 xxxlarge-1'>{[res.group, res.kind].filter(item => !!item).join('/')}</div> | ||
<div className='columns small-1 xxxlarge-1'>{res.syncWave || '-'}</div> | ||
<div className='columns small-2 xxxlarge-1'>{res.namespace}</div> | ||
<div className='columns small-1 xxxlarge-1' title={[res.group, res.kind].filter(item => !!item).join('/')}> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
let's move this filtering to local variable, to reuse code
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks for your review! I applied your review and defined a local variable to reuse.
df59d79
<div className='columns small-1 xxxlarge-1'>{[res.group, res.kind].filter(item => !!item).join('/')}</div> | ||
<div className='columns small-1 xxxlarge-1'>{res.syncWave || '-'}</div> | ||
<div className='columns small-2 xxxlarge-1'>{res.namespace}</div> | ||
<div className='columns small-1 xxxlarge-1' title={[res.group, res.kind].filter(item => !!item).join('/')}> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Would you consider using the tooltip component from argo-ui, which is already available, instead of the native tooltip?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks for your review! I applied it as a tooltip in argo-ui as you said, and it looked much prettier :)
df59d79
Signed-off-by: sunyeongchoi <suoung0716@gmail.com>
Fixes #17600
If the text is long, it will be cut off and can't see the entire text. So I added
title
.When hovering the mouse, the user can see the entire text.
Checklist:
Results
Before
After(Before review)
NAME field title
GROUP/KIND field title
SYNC ORDER field title
NAMESPACE field title
CREATED AT field title
After(After review)
NAME field title
GROUP/KIND field title
SYNC ORDER field title
NAMESPACE field title
CREATED AT field title