How to add or edit a CSS style

Question

How can I add or edit a CSS  style?

Answer

To add the necessary style:

1) Create a new module. Add a css style on the Less tab. We recommend using the following structure:

body[OldUI=false][CustomUI="true"] {
    .control-width-15 .t-label {
        color: #7FFF00;
    }
}

2) Create the necessry replacing page using "Replacing client module". For example, you need to replace the BasePageV2 module. Add the module from the first step to define property of the replacing page.

Override the init() method and call the setAttributeToBody() method to add your style to the body.

define("BasePageV2", ["css!UsrBasePageV2CSS"],
    function() {
        return {
            messages: {},
            mixins: {},
            attributes: {},
            methods: {
                init: function() {
                    this.callParent(arguments);
                    this.initializeCustomCss();
                },
                initializeCustomCss: function() {
                    Terrasoft.utils.dom.setAttributeToBody("CustomUI", true);
                }
            },
            diff: /**SCHEMA_DIFF*/[]/**SCHEMA_DIFF*/
        };
});

3) Update the page