CSS in Analytic Application (SAC)

[avsalynin]

 

As an application designer, from release 2020.20 (or Q4 2020) we can now define multiple CSS class styles either as a global default or per widget! This is amazing news!

Globally, it became possible to go to editing the css from the general canvas (Application Level CSS):

Also, here

It is quite convenient that the css editor itself has a convenient help: when you select a visualization element, a list of available css classes of this component appears (supported class names and properties):

It's simple with separate classes:

About standard component classes - you can only refer with a user define class name as the first part of selector:

As you can see hover is also supported.

Binding to the class name is defined in the styling menu of the component:

 

 

Of course, now you can change the css class from scripts:

 

It is also possible to link the CSS with a pre-configured theme (Theme Level CSS):

CSS is stored together with the application or together with the application theme (not as in a lumira designer as a separate file). Some of the existing theme settings can be overwritten.

Unfortunately, not all css properties are currently supported:

2022 RELEASE PLANS (Q2 2022)

Advanced Customization Options for Tab Strips

We hope that this is only the first step and in the future SAC Analytics Applications will be even more customized in terms of the capabilities of the CSS!