Layout customization using skinning

The visual appearance of the Web Client can be customized using skinning. The required CSS files, images, and libraries can be saved on the file system.

Web Client

Please proceed as follows to create a customized skin for the Web Client:

1. Create a folder called design on the Data directory page. The location of the data directory is defined in the system property cmas-core-shared, data.directory, see Data directory.
2. Create a folder within the design directory and set the system property cmweb-server-adapter, themeOverlay to the name of this folder.
3. Add the customized layout files. There are two possibilities:
   • You can place everything in the theme folder. The theme folder can contain one or several files with the custom styling.
   • You can create a file called theme_<folder name>.css. Its content is merged with the default CSS file.
4. The changes to files are loaded automatically. If you create new folders, you need to restart ConSol CM to apply the changes.

info

If you do not want to set the system property, you can create a subfolder called default and use it for your skin files.

The existing default styling is only overwritten for the aspects which are explicitly configured in the custom skin. It is therefore possible to create, for example, a custom CSS file which only contains the settings which should be changed with respect to the default styling. This facilitates the maintenance of the custom CSS file after ConSol CM updates.

Authentication application

Please proceed as follows to create a custom skin for the OIDC login page of the Web Client:

1. Create a file cmas-auth-user.properties. Its location depends on the deployment method of the authentication application:
   • Overlay deployment: Create the file in the bin directory of the application server.
   • Standalone deployment: Create the file in the directory of the authentication application's jar file.
2. Copy the path to your data directory from the system property cmas-core-shared, data.directory and add the following line to file:

   spring.web.resources.static-locations=file:/<path to data directory>/design/auth/,classpath:/static/

3. On the Data directory page, create a subfolder auth in the design directory.
4. Add the files which you want to override to the auth directory. You need to overwrite complete files. It is not possible to overwrite single styles.

warning

If the authentication application is run in standalone mode on another machine which does not have access to the data directory, you need to create the auth folder on that machine and reference it in the spring.web.resources.static-locations property.