[Controls] Time Slider text is not working properly with Dark Mode #145594
Assignees
Labels
bug
Fixes for quality problems that affect the customer experience
Feature:Input Control
Input controls visualization
impact:medium
Addressing this issue will have a medium level of impact on the quality/strength of our product.
loe:medium
Medium Level of Effort
Project:Controls
Team:Presentation
Presentation Team for Dashboard, Input Controls, and Canvas
Comments
ninoslavmiskovic
added
bug
|
Pinging @elastic/kibana-presentation (Team:Presentation) |
ThomThomson
changed the title
ThomThomson
added
loe:medium
|
time slider control embeddable does not wrap itself with KibanaThemeProvider. I will put up a fix |
nreese
added a commit
that referenced
this issue
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">
kibanamachine
pushed a commit
that referenced
this issue
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)
kibanamachine
referenced
this issue
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":"[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]>
![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
Kibana version:
8.5
Browser version:
Google Chrome 107.0.5304.110 (
Browser OS version:
MacOS Montery
Describe the bug:
Steps to reproduce:
Expected behavior:
To be able to see the text in the control.
Screenshots (if relevant):
The text was updated successfully, but these errors were encountered: