[controls] fix Time Slider text is not working properly with Dark Mode #145612
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
nreese
added
release_note:fix
Team:Presentation
|
Pinging @elastic/kibana-presentation (Team:Presentation) |
ThomThomson
approved these changes
Nov 17, 2022
💚 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: |
kibanamachine
pushed a commit
that referenced
this pull request
Nov 17, 2022
#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 |
kibanamachine
added a commit
that referenced
this pull request
Nov 17, 2022
…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":"reese.nathan@elastic.co"},"sourceCommit":{"committedDate":"2022-11-17T20:24:47Z","message":"[controls] fix Time Slider text is not working properly with Dark Mode (#145612)\n\nFixes #145594 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 #145594 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 #145594 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 <reese.nathan@elastic.co>
![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]](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]){kind=link}
![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]](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]){kind=link}
![https://user-images.githubusercontent.com/373691/202536272-9ef9e9fe-debe-4722-a50e-03929b94c18d.png\">","sha":"d5ed16a86e105e3cd1418fa1a42a3745a46e0a9c](https://user-images.githubusercontent.com/373691/202536272-9ef9e9fe-debe-4722-a50e-03929b94c18d.png\">","sha":"d5ed16a86e105e3cd1418fa1a42a3745a46e0a9c){kind=link}
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
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:darkModeto true