Skip to main content
Announcements
See why Qlik is a Leader in the 2024 Gartner® Magic Quadrant™ for Analytics & BI Platforms. Download Now
cancel
Showing results for 
Search instead for 
Did you mean: 
zagahmadi
Partner - Contributor II
Partner - Contributor II

How to change font color in chart's View Data mode

Hi, i have converted my dashboards to "dark mode" with a combination of CSS and individual chart Style changes. However, when i enter "View Data" mode for any chart I can see that the font color is still black / dark grey. How can i change the font color of the text shown in View Data mode?
Labels (2)
1 Solution

Accepted Solutions
marksouzacosta
Partner - Specialist
Partner - Specialist

Hi @zagahmadi,

When you click on View Data the rendered HTML code of the chart changes so you have to locate the element that you would like to change based on the new HTML.

This is an example of View Data of a Table chart:

marksouzacosta_0-1718083180391.png

 

This is the regular view of the chart:

marksouzacosta_1-1718083206846.png

 

And this is the View Data formatted - I made the text red:

marksouzacosta_2-1718083245953.png

This is the CSS code I have injected in the Multi-KPI chart to make the magic.

[data-testid="table-container"] span {
    color: #FF0000 !important;
}

 

Please let me know if that helped you.

 

Regards

Mark Costa

Read more at Data Voyagers - datavoyagers.net

View solution in original post

2 Replies
marksouzacosta
Partner - Specialist
Partner - Specialist

Hi @zagahmadi,

When you click on View Data the rendered HTML code of the chart changes so you have to locate the element that you would like to change based on the new HTML.

This is an example of View Data of a Table chart:

marksouzacosta_0-1718083180391.png

 

This is the regular view of the chart:

marksouzacosta_1-1718083206846.png

 

And this is the View Data formatted - I made the text red:

marksouzacosta_2-1718083245953.png

This is the CSS code I have injected in the Multi-KPI chart to make the magic.

[data-testid="table-container"] span {
    color: #FF0000 !important;
}

 

Please let me know if that helped you.

 

Regards

Mark Costa

Read more at Data Voyagers - datavoyagers.net
zagahmadi
Partner - Contributor II
Partner - Contributor II
Author

Outstanding, Worked like charm. Thanks so much!