Allow for editing SASS files in the Mendix modeler itself. And compile them there too in real time based on Calypso.
That way SASS definitions can become project independent. As definitions can be moved towards their own namespaces.
https://sass-lang.com/blog/the-module-system-is-launched
https://css-tricks.com/introducing-sass-modules/
For example my namespace becomes
@use "my-client-apps-namespace" as client;
.element {
background-color: client.$body-bg;
@include client.float-left;
}
but one could also easily use the @forward component specific styles sass functions and mixins to other modules and components
For example I could forward mixins, styles and functions from button to my modal pop-ups or data-grid.
The modular approach would also allow for not including styles for elements that are not being used. Like right now Mendix comes with tons of styling variants in
listviews/template grid etc, and then you get custom sass which overwrites these adding on top of the specificity. And pretty much resulting in a 2MB css file.
Hi Jason,
just to give some feedback on your feedback:
Hi Marnix,
I’m going to break your post down a bit, cause there’s a bit to unpack.
1 I think working with mixins is great in a small team, but its hard to keep all people (with different skill levels) aligned, let alone developers that sometimes want to mess around in the sass.
2 Having Sass in mendix, would solve some sync issues (multi app landscape). Also makes it easier for devs to mess around in it, not sure if this is good or bad, but creates some opportunities.
3 I have to admit that Mendix Legacy css is a bit of a mess, not sure if this is the way to solve it though, I’d rather see a cleanup of the legacy css
4 this is a bit of a result of the legacy mess, small css is always good :D