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.

Sign up for GitHub

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

Jump to bottom

[Bug]: Poor choice of right-arrow icon #1858

Closed
yurishkuro opened this issue Oct 9, 2023 · 5 comments · Fixed by #1869
Closed

[Bug]: Poor choice of right-arrow icon #1858

yurishkuro opened this issue Oct 9, 2023 · 5 comments · Fixed by #1869
Labels
bug good first issue help wanted

Comments

@yurishkuro
Copy link
Member

In v1.48:
image

In v1.50:
image

The arrow is thinner and does not align with the text vertically.
@MeenuyD
Copy link
Contributor

MeenuyD commented Oct 10, 2023

can you tell where i can see this

@yurishkuro
Copy link
Member Author

It's in the main trace view, e.g. when you run a HotROD demo app and open one of its traces

@yurishkuro
Copy link
Member Author

More concretely, you can run this example https://github.com/jaegertracing/jaeger/tree/main/examples/hotrod

@NineKama
Copy link
Contributor

The arrow in v1.48 was using IMArrowRight from react-icons/im
image

and we don't have the similar icon in react-icons/io5 to replace https://react-icons.github.io/react-icons/icons?name=io5. We are using:
image

We can revert it but it will conflict with idea #1723.

Do you have any suggestions?

@yurishkuro
Copy link
Member Author

I am fine to stick with thinner arrow, it just needs to be styled to align with the center of the circle

@NineKama NineKama mentioned this issue Oct 13, 2023
Merged
4 tasks
yurishkuro pushed a commit that referenced this issue Oct 13, 2023
@NineKama
fix: Add Style for IoArrowForward (#1869)
87e6e6f 
## Which problem is this PR solving?
- Resolves: #1858

## Description of the changes
- Add `vertical-align: middle` to align arrow with circle

## How was this change tested?
- Manually


![image](https://github.com/jaegertracing/jaeger-ui/assets/12762270/f6512bff-9a79-43f2-9512-d0a7b6a949f3)

## Checklist
- [x] I have read
https://github.com/jaegertracing/jaeger/blob/master/CONTRIBUTING_GUIDELINES.md
- [x] I have signed all commits
- [ ] I have added unit tests for the new functionality
- [x] I have run lint and test steps successfully
  - for `jaeger`: `make lint test`
  - for `jaeger-ui`: `yarn lint` and `yarn test`

---------

Signed-off-by: Dat Diep <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug good first issue help wanted
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

fix: Add Style for IoArrowForward NineKama/jaeger-ui
3 participants
@yurishkuro @NineKama @MeenuyD