Need custom styling for search bar of a data grid

Hi, I’ve a data grid with it’s data source as xpath. I’ve couple of drop downs for the search bar for this data grid. Can i have custom styling for the search bar?  
2 answers

Hi Pranav,

Yes, you can apply custom styling to the search bar. Not sure if you have already seen this but if not than I will recommend your to go through Style your App with CSS learning path on Mendix academy. 

Also have a look at this forum post for reference.



Hope this helps!


Yes you can.

In your project go to the folder theme /styles/web/sass/app… there you can find the custom sass files (_custom.scss and _custom-variables.scss)  where you can make any adjustment you like.

When, like for this example, you want to overwrite a default styling class (like your grid searchbar), you can find it in this folder: theme/styles/web/sass/core/widgets, where you find the sass file ‘_grid.scss’ wich holds the styling of a datagrid, including the search field.

Copy the class you want to overwrite to your _custom.scss file and there you can start styling it.

Don’t forget to compile your sass with Calypso like explained here: Mendix docs