-
Notifications
You must be signed in to change notification settings - Fork 13.8k
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(viz): Header scrolling for Time Table in dashboard #20874
Conversation
- Increase the z-index so the sparkline doesn't overlap when scrolling in the dashboard
- Remove testing label
Codecov Report
@@ Coverage Diff @@
## master #20874 +/- ##
==========================================
- Coverage 66.27% 66.25% -0.02%
==========================================
Files 1757 1757
Lines 66955 66978 +23
Branches 7109 7117 +8
==========================================
+ Hits 44374 44377 +3
- Misses 20766 20784 +18
- Partials 1815 1817 +2
Flags with carried forward coverage won't be shown. Click here to find out more.
Help us with your feedback. Take ten seconds to tell us how you rate us. |
@@ -98,12 +98,13 @@ const defaultProps = { | |||
url: '', | |||
}; | |||
|
|||
// @z-index-above-dashboard-charts + 1 = 11 |
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.
FWIW, this is in the LESS codebase as z-index-above-dashboard-charts
but obviously we're not using LESS here. This PR seems fine, but I wonder if we should make a levels/z-index registry in our Emotion theme. @michael-s-molina @eric-briscoe we might want to have a chat about how we can clean/support/scale these layers.
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.
or review, most of those should not be needed at all
SUMMARY
Our dashboard includes
dnd.less
which makes our headers fall under the sparkline when scrolling. So we Increase the z-index in order to avoid such scenario.BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF
BEFORE:
AFTER:
TESTING INSTRUCTIONS
Expected Results:
ADDITIONAL INFORMATION