Find a way to load the custom-styles.scss files before all other styles - Mendix Forum

Find a way to load the custom-styles.scss files before all other styles

3

Hi everyone,

 

As described by this documentation article about styling in Mendix 9, custom styling can now be ordered and thus custom styles can overwrite Mendix / Atlas default styles.
The problem that comes with this is, that the variables would also be imported after they are used.
The article therefore correctly suggests to manually load them as part of the core variable definition.

Unfortunately, this leads us to a problem.
If you are ever to update the Atlas_Core module, those changes will be overwritten.
Also, it seems kind of unclean to have a system, where styles are nicely encapsulated into modules, just to then need to adjust the core scss files again.

Therefore, I would highly appreciate some way to automatically load the custom variables from UI modules before all others styles.
I would guess, doing this based on the file name would not be a problem.

asked
3 answers

Hi Jason,

Those features look really cool, and you can surely do a lot with them.

Unfortunately, at least as far as I can see, this will not let you do the following two things at the same time:

  • Import a modules custom-varaibles.scss before all the other styles are applied
  • Import the othe module styles through the main.scss after all the other styles

The only thing somewhat similar to this would be to completely disable the styling done by AtlasUI, but then you are left without default styles for many elements, unless you completely restyle everything in your custom styles.

Created

also feel free to join the MX-UX slack channel.

https://join.slack.com/t/mendix-ux/shared_invite/zt-4j76hu1d-QUGLLAGtDgzJXGVbP59f2Q

Created

Hi Karl,

I thought I’d give you a reply.

I completely agree with everything you are saying.

I unfortunately havn’t had time to experiment with MX9.4 but everything you say should be possible.

https://docs.mendix.com/howto/front-end/module-level-theme-settings

 

Created