Repository navigation
Fix colors in filters widgets #2429
Description
Hi Mendix Team;
I noticed that some colors inside the css of data widget ( datagrid / filters ) are not using css variables.
With the passage of Atlas V4 that is using css variables for color customisation, it will be great if also those widgets can use css variables for colors.
Those are some changes that I had to made to make this widgets to follow the atlas core variables:
.widget-dropdown-filter-state-icon, .widget-dropdown-filter-toggle {
fill: currentColor;
}
.react-datepicker-time__header, .react-datepicker-year-header, .react-datepicker__current-month {
color: inherit;
}
.react-datepicker {
background-color: var(--bg-color-secondary, #FFF);
color: var(--font-color-default, #000);
--dg-day-color: var(--font-color-default);
}
.react-datepicker__month-select, .react-datepicker__month-year-select, .react-datepicker__year-select {
background-color: var(--bg-color-secondary, #FFF);
}
.pagination-bar {
color: var(--font-color-default, #000);
}
.widget-dropdown-filter-menu {
--scroll-shadow: var(--bg-color-secondary, #FFF);
}
Is it possible to "include" those inside the widget css? Or better create a dedicated set of variables like the ones that I see for accordion / labels etc..?
Thanks
M
Activity
github-actions commentedon Nov 2, 2026
Understood: some colors in the Data Grid 2 and filter widget styles (dropdown filter icons, date picker background/text, pagination bar text, dropdown scroll shadow) are not driven by CSS variables. With Atlas v4 theming you would like them to follow the Atlas color variables, either directly or through a dedicated set of variables.
The overrides you shared give maintainers a concrete starting point. Maintainers will review this request.
Automated triage by Claude. It can be wrong, and a maintainer makes the final decision.