Skip to content

Fix layout overflow in "Tag Breakdown" table #2316

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

Merged
merged 3 commits into from
Aug 28, 2023
Merged

Conversation

bryanhuhta
Copy link
Contributor

When running Pyroscope as a Grafana app plugin, the "Tag Breakdown" table rendered poorly. See Before screenshot.

This PR makes a few small changes to improve how the table is rendered. Namely,

  • the table columns now will take up as much space as they need, instead of being fixed width
  • if a cell still cannot render everything, it will become scrollable
  • the percentage is moved off the "Tag name" column and put on the "Total" column where it feels more natural

Before

Screenshot 2023-08-25 at 5 51 15 PM

After

Screenshot 2023-08-25 at 5 50 49 PM

This commit cleans up the "Tag Breakdown" table by:
  * making each column take up as much space as it needs
  * moving the percentage text to the "Total" column where it feels
    more natural
  * if a cell still doesn't have enough space to render its content,
    it will become scrollable
@bryanhuhta bryanhuhta self-assigned this Aug 25, 2023
@bryanhuhta bryanhuhta requested a review from a team as a code owner August 25, 2023 23:00
@bryanhuhta bryanhuhta merged commit 19ee3be into next Aug 28, 2023
@bryanhuhta bryanhuhta deleted the fix-text-overflow branch August 28, 2023 16:22
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.

2 participants