Andy - Is there any way to change the backgroun...
Is there any way to change the background colour of a filter on a dashboard when it has a value selected? e.g. have Age Group filter be a different colour that it is has a field selected
I have tested the filter chip css options and it doesn't seem to cover it https://developers.thoughtspot.com/docs/css-variables-reference#_filter_chips_on_liveboard_and_answers
As well is there a way to be able to filters into a drop down? (we have a lot of filters on our dashboards - that we can't remove) but would like to collapse them together so that the liveboard looks less busy
CSS variables reference
Reference to pre-defined CSS variables for CSS customization framework
12 Replies
Hey I assume, you meant - "Age Group" be different color to : "20-24"
https://developers.thoughtspot.com/docs/custom-css#_css_rules_using_selectors
https://developers.thoughtspot.com/docs/Interface_customCssInterface#_rules_unstable
Try rules_UNSTABLE.
CSS customization framework
Customize UX elements and layout of embedded ThoughtSpot interface using custom CSS
customCssInterface
inline customCSS within the {@link CustomisationsInterface}. Use {@link CustomCssVariables} or css rules.
Also can you clarify second question - "a way to be able to filters into a dropdown"
Not sure what you meant.
Thanks
ideally i want the
Age Group: 20-24 to be a different colour to Business Entity: (Select), i just want some way to show that a particular filter is active on the page (as opposed to just being available to filter)
in regards to the second one: lets say i have 10 filters on a liveboard.
I want to have 3 filters showing as they usually do (as a pill) and then a drop down box that contains the remaining 7 filtersFor the first one - This customizatoin is not available, you might have to write some customcss like for first chip shows different color and second one different, you try doing it with rules_UNSTABLE, you can access particular elements and modify as per your needs. read the examples in above, that should help.
As for the second part - To actually customize showing particular number of filters in chips for each filter. Currently it might not be achievable, but you can raise a feature request for the same. ( try with some css hacks )
Example
is there a list of elements available with rules_UNSTABLE?
No, it's like you select custom elements through some css selectors which is available in html, then you override and apply your styles.
In above example it shows, I 've used data-testid on span to override background.
You can check in the page itself what element to choose with developer tab and then override.
It's a way to pretty much override any style on page. If you still facing any problem or you are trying to ask something different. We can connect whenever you avaiable quick to resolve that.
Thanks.
ah ok i think i understand. thanks
was able to hack this
usign the below css. so it is possible
is there any risks with using rules_UNSTABLE that i should be aware of for putting into production?
Yes, actually they could break if you upgrade your cluster version. Otherwise it should be fine.
So, when upgrading to next version you can check if they are breaking.
Not to worry too much not many changes are introduced suddenly, unless there is big release changes.
Hey team, could you confirm that the variable with --active is used in the app? I was able to make color changes on hover but adding the active does nothing.
Hey @Suvash , please check if you are working with filters exactly,
For parameter chips, this will not work. You have different variables.
You can check it like this - I have added : "--ts-var-chip--active-background": "red",
If still persists, you can add some more info. Thanks.
Hi @yuichirio_ha would you be able to replicate the same without emulating the active state? From what I can understand, the way this chip currently operates is it goes into an active state for a brief moment when the user clicks the chip. Once the user selects a value, it doesn't have its active state. So is the definition of Selected in Background color of the filter chips when selected. the user selected it? Or Selected means there are values assgined to the chips?