-
Notifications
You must be signed in to change notification settings - Fork 3.7k
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
ui: right align stats on node list #28545
Conversation
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.
LGTM, but I didn't know we were adding in specialty styles at this granularity. Why not add right-alighted-stat to the same style file where sort-table__cell is defined?
Also, might want to right align uptime as well.
Reviewed 1 of 1 files at r1, 2 of 2 files at r2.
Reviewable status:complete! 0 of 0 LGTMs obtained
These don't actually fail the linter, but are inconsistent with style elsewhere. Should make the linter more strict. Release note: None
Not as good as a bar graph, but still makes it easier to compare quantities. Release note: None
823ec45
to
a45f250
Compare
Good point. Knew there was a better place for this. Moved it. bors r+ |
28545: ui: right align stats on node list r=vilterp a=vilterp Not as good as a bar graph, but still makes it easier to compare quantities. Before: ![image](https://user-images.githubusercontent.com/7341/44059269-d04f430e-9f1e-11e8-8b92-1b6eb3d162b0.png) After: ![image](https://user-images.githubusercontent.com/7341/44059242-ba7e3eea-9f1e-11e8-9133-0d1e5d16e022.png) Co-authored-by: Pete Vilter <vilterp@cockroachlabs.com>
Build succeeded |
sure, the full text is right-aligned, but only the percentage is truly right-aligned. kind of frustrating that the values jump around based on the width of the percentages... |
Yeah, this was a quick fix which makes it better but not great. Filed #29373 to revisit this with a better design. |
Not as good as a bar graph, but still makes it easier to compare quantities.
Before:
![image](https://user-images.githubusercontent.com/7341/44059269-d04f430e-9f1e-11e8-8b92-1b6eb3d162b0.png)
After:
![image](https://user-images.githubusercontent.com/7341/44059242-ba7e3eea-9f1e-11e8-9133-0d1e5d16e022.png)