bielwarm
bielwarm13mo ago

Components css classes

The Tabs component's css classes aren't applying the styles to the component on a Windmill cloud App. I noticed that on the elements html (with chrome inspect) the class ".wm-tabs-alltabs" is not on any elements. Also for agGrid-EE is there any way to remove the outer border, not the one being defined by the aggrid styling, but the one outside of the aggrid element (picture attached)? I achieved this by changing the border-width for the global .border class to 0px, but that changes all elements that use the .border class.
No description
5 Replies
bielwarm
bielwarm13mo ago
Another approach to remove the agGrid-EE border is to use a child combinator in conjunction with nested targeting (very specific), starting from the component's ID. This workaround is effective for the time being; however, I'm wondering if there are plans to offer more granular control over the CSS in future updates?
Faton
Faton12mo ago
Hi, I wasn't able to reproduce the issue with tabs. Do you mind sharing the JSON of your app ?
No description
Faton
Faton12mo ago
About Ag Grid styling, It's indeed something we need to improve. I'll add proper global styling for this component today
bielwarm
bielwarm12mo ago
Hi @Faton! Here is a screenshot of the problem. It happens when editing the style through the style menu specific for that component. On a side note I noticed the global styling changes are only applied on "Editor" mode on the Team plan, so unfortunately changing the global CSS editor isn't a solution for me. For the time being I'm using the React App Import feature in order to import my own React App and be able to make more advanced CSS style changes.
No description
Faton
Faton12mo ago
Thanks for the details! There is indeed an issue with styling in sidebar mode, will fix asap!