-
Notifications
You must be signed in to change notification settings - Fork 8.3k
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
[controls] fix Time Slider text is not working properly with Dark Mode #145612
Conversation
Pinging @elastic/kibana-presentation (Team:Presentation) |
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.
ThemeProvider addition LGTM! Code only review
💚 Build Succeeded
Metrics [docs]Async chunks
Unknown metric groupsESLint disabled in files
ESLint disabled line counts
Total ESLint disabled count
To update your PR or re-run it, just comment with: |
#145612) Fixes #145594 TimeSlider component is not wrapped by KibanaThemeProvider and therefore does not properly use kibana themeing. This PR resolves the issues by wrapping TimeSlider by KibanaThemeProvider. To test * set advanced setting `theme:darkMode` to true * open dashboard * add time slider * verify timeslider is using dark theme <img width="500" alt="Screen Shot 2022-11-17 at 12 04 40 PM" src="https://user-images.githubusercontent.com/373691/202536272-9ef9e9fe-debe-4722-a50e-03929b94c18d.png"> (cherry picked from commit d5ed16a)
💚 All backports created successfully
Note: Successful backport PRs will be merged automatically after passing CI. Questions ?Please refer to the Backport tool documentation and see the Github Action logs for details |
…rk Mode (#145612) (#145623) # Backport This will backport the following commits from `main` to `8.6`: - [[controls] fix Time Slider text is not working properly with Dark Mode (#145612)](#145612) <!--- Backport version: 8.9.7 --> ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sqren/backport) <!--BACKPORT [{"author":{"name":"Nathan Reese","email":"[email protected]"},"sourceCommit":{"committedDate":"2022-11-17T20:24:47Z","message":"[controls] fix Time Slider text is not working properly with Dark Mode (#145612)\n\nFixes https://github.com/elastic/kibana/issues/145594\r\n\r\nTimeSlider component is not wrapped by KibanaThemeProvider and therefore\r\ndoes not properly use kibana themeing. This PR resolves the issues by\r\nwrapping TimeSlider by KibanaThemeProvider.\r\n\r\nTo test\r\n* set advanced setting `theme:darkMode` to true\r\n* open dashboard\r\n* add time slider\r\n* verify timeslider is using dark theme\r\n\r\n<img width=\"500\" alt=\"Screen Shot 2022-11-17 at 12 04 40 PM\"\r\nsrc=\"https://user-images.githubusercontent.com/373691/202536272-9ef9e9fe-debe-4722-a50e-03929b94c18d.png\">","sha":"d5ed16a86e105e3cd1418fa1a42a3745a46e0a9c","branchLabelMapping":{"^v8.7.0$":"main","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:fix","Team:Presentation","auto-backport","v8.6.0","v8.7.0"],"number":145612,"url":"https://github.com/elastic/kibana/pull/145612","mergeCommit":{"message":"[controls] fix Time Slider text is not working properly with Dark Mode (#145612)\n\nFixes https://github.com/elastic/kibana/issues/145594\r\n\r\nTimeSlider component is not wrapped by KibanaThemeProvider and therefore\r\ndoes not properly use kibana themeing. This PR resolves the issues by\r\nwrapping TimeSlider by KibanaThemeProvider.\r\n\r\nTo test\r\n* set advanced setting `theme:darkMode` to true\r\n* open dashboard\r\n* add time slider\r\n* verify timeslider is using dark theme\r\n\r\n<img width=\"500\" alt=\"Screen Shot 2022-11-17 at 12 04 40 PM\"\r\nsrc=\"https://user-images.githubusercontent.com/373691/202536272-9ef9e9fe-debe-4722-a50e-03929b94c18d.png\">","sha":"d5ed16a86e105e3cd1418fa1a42a3745a46e0a9c"}},"sourceBranch":"main","suggestedTargetBranches":["8.6"],"targetPullRequestStates":[{"branch":"8.6","label":"v8.6.0","labelRegex":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"main","label":"v8.7.0","labelRegex":"^v8.7.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/145612","number":145612,"mergeCommit":{"message":"[controls] fix Time Slider text is not working properly with Dark Mode (#145612)\n\nFixes https://github.com/elastic/kibana/issues/145594\r\n\r\nTimeSlider component is not wrapped by KibanaThemeProvider and therefore\r\ndoes not properly use kibana themeing. This PR resolves the issues by\r\nwrapping TimeSlider by KibanaThemeProvider.\r\n\r\nTo test\r\n* set advanced setting `theme:darkMode` to true\r\n* open dashboard\r\n* add time slider\r\n* verify timeslider is using dark theme\r\n\r\n<img width=\"500\" alt=\"Screen Shot 2022-11-17 at 12 04 40 PM\"\r\nsrc=\"https://user-images.githubusercontent.com/373691/202536272-9ef9e9fe-debe-4722-a50e-03929b94c18d.png\">","sha":"d5ed16a86e105e3cd1418fa1a42a3745a46e0a9c"}}]}] BACKPORT--> Co-authored-by: Nathan Reese <[email protected]>
Fixes #145594
TimeSlider component is not wrapped by KibanaThemeProvider and therefore does not properly use kibana themeing. This PR resolves the issues by wrapping TimeSlider by KibanaThemeProvider.
To test
theme:darkMode
to true