Address more options icon alignment on charts
Summary
On Operations > Metrics - we've implemented the "more options" menu as a button. Unfortunately, since this button has an invisible border, this creates a lot of strange alignment issues with the charts.
Steps to reproduce
On any project with a working metrics dashboard, go to Operations > Metrics.
Example Project
(If possible, please create an example project here on GitLab.com that exhibits the problematic behavior, and link to it here in the bug report)
(If you are using an older version of GitLab, this will also determine whether the bug is fixed in a more recent version)
What is the current bug behavior?
If the (invisible) edge of the button is aligned with the edge of the chart, the icon itself looks out-of-line until you hover over it. Unfortunately, most of the time, users aren't hovering over the icon so most of the time it looks out of line. Some examples showing the problem:
As a short-term fix in https://gitlab.com/gitlab-org/gitlab-ee/merge_requests/15789, we've aligned the icon itself to the edge of the chart but, this creates a weird effect when users hover over the button:
What is the expected correct behavior?
There seem to be two ways of addressing this problem longer-term:
- Re-introduce the border so it's no longer invisible
- Have the icon button be just an icon rather than a button. This would solve the border issues and better align what we're doing on charts with the current behaviors of the "more actions" icon on issue comments.
Relevant logs and/or screenshots
(Paste any relevant logs - please use code blocks (```) to format console output, logs, and code as it's tough to read otherwise.)
Output of checks
(If you are reporting a bug on GitLab.com, write: This bug happens on GitLab.com)
Results of GitLab environment info
Expand for output related to GitLab environment info
(For installations with omnibus-gitlab package run and paste the output of:
sudo gitlab-rake gitlab:env:info
)(For installations from source run and paste the output of:
sudo -u git -H bundle exec rake gitlab:env:info RAILS_ENV=production
)
Results of GitLab application Check
Expand for output related to the GitLab application check
(For installations with omnibus-gitlab package run and paste the output of:
sudo gitlab-rake gitlab:check SANITIZE=true
)(For installations from source run and paste the output of:
sudo -u git -H bundle exec rake gitlab:check RAILS_ENV=production SANITIZE=true
)(we will only investigate if the tests are passing)
Possible fixes
(If you can, link to the line of code that might be responsible for the problem)