Introduction

The CoreOne Admin User Interface Look and Feel can easily be adjusted to your needs. This article describes what is possible and how this can be done.

Branding

You can override the logo by changing the logo file in the following directory:

C:\ProgramData\itsense\Templates\AdminUI2\

Color theme

You can override specific colors within the CoreOne Admin User Interface by overriding following file:

C:\ProgramData\itsense\Templates\AdminUI2\theme.js

The content of the file should be in the following structure:

{
    "navigation": {
        "background-color": "#38fcff",
        "item": {
            "color": null,
            "background-color": null,
            "active": {
                "color": null,
                "background-color": null,
                "hover": {
                    "color": null,
                    "background-color": null
                }
            },
            "hover": {
                "color": null,
                "background-color": null
            }
        },
        "group": {
            "header": {
                "color": null,
                "background-color": null
            },
            "color": null,
            "background-color": null
        }
    },
    "app": {
        "text-color": null,
        "text-color-secondary": null,
        "primary-color": "#38fcff",
        "primary-color-text": null,
		"tag-severity-default": "#ff38ee",
		"tag-severity-info": null,
		"tag-severity-warning": null,
		"tag-severity-danger": null,
		"tag-severity-success": null,
        "surface-a": null,
        "surface-b": null,
        "surface-c": null,
        "surface-d": null,
        "surface-e": null,
        "surface-f": null,
        "font-family": null,
        "surface-0": null,
        "surface-50": null,
        "surface-100": null,
        "surface-200": null,
        "surface-300": null,
        "surface-400": null,
        "surface-500": null,
        "surface-600": null,
        "surface-700": null,
        "surface-800": null,
        "surface-900": null,
        "gray-50": null,
        "gray-100": null,
        "gray-200": null,
        "gray-300": null,
        "gray-400": null,
        "gray-500": null,
        "gray-600": null,
        "gray-700": null,
        "gray-800": null,
        "gray-900": null,
        "content-padding": null,
        "inline-spacing": null,
        "border-radius": null,
        "surface-ground": null,
        "surface-section": null,
        "surface-card": null,
        "surface-overlay": null,
        "surface-border": null,
        "surface-hover": null,
        "focus-ring": null,
        "maskbg": null,
        "highlight-bg": null,
        "highlight-text-color": null
      }
}

Custom styling

Most of the styling you can override using the color theme. Should you require any additional changes you can add the following css file to add any other styling:

C:\ProgramData\itsense\Templates\AdminUI2\theme.css

Translation

If you want to change any of the texts, you can do so by changing the appropriate translation files located in the following directory:

C:\ProgramData\itsense\LanguageData

All the default translations are store in the following file. So just search for the text to find the appropriate key:

itsense.moving.generated.xml

If you then want to change it, just add the appropriate value to the appropriate override file. So for example if you want to change the default text of the “Login” button in German, add the following entry to the following file:

itsense.moving.de.overrides.xml

"Global.Application.Button.Login": "Your new login button text"

There is also a step by step how-to article.