How can we use different CSS files for different users?

Support
#1

Hello!
I want to extend/add another css file to the theme, depending on the user login.
Some should get the red view, some the blue view…

Is this possible?
Where is the best place to place the switch for that?

Secondly, is it possible to choose the menu.xml depending on login information, too?

Thanks in advance,
br, HP

#2

Hi,

What Jmix version do you use?

Regards,
Gleb

#3

Hi, sorry for that missing info,

it’s a 1.5.3 project (with always latest plug-in version).

#4

Hi,

In general, in order to load some resource dynamically (like js, css files) the io.jmix.ui.screen.ScreenDependencyUtils#addScreenDependency can be used. The example of its usage can be found in the Login screen with branding image template.

Screenshot 2023-09-25 at 11.40.13

private void loadStyles() {
    ScreenDependencyUtils.addScreenDependency(this,
            "vaadin://brand-login-screen/login.css", Dependency.Type.STYLESHEET);
}

Alternatively, you can define several color presets for the Helium theme and allow users to select one. In this case, selected preset is remembered in their user settings and loaded automatically after login.

https://docs.jmix.io/1.x/jmix/1.5/ui/themes/custom_theme.html#helium-configuration

Gleb