Creating a Custom Theme for Web Application

The fap10 theme is used in the web application by default. Themes are contained in the folder:

/opt/foresight/fp10.x-webserver/r/themes in Linux OS.
C:\Program Files (x86)\Foresight\Analytics Platform 10.x Web Application\r\themes in Windows OS.

The theme includes the following files:

icons. The folder with a set of used icons in the SVG format.
theme.json. Theme configuration file.

To create a custom theme for web application:

Copy the existing theme fap10, paste it to the current folder and rename the theme. For example, custom_theme:

/opt/foresight/fp10.x-webserver/r/themes/custom_theme in Linux OS.
C:\Program Files (x86)\Foresight\Analytics Platform 10.x Web Application\r\themes\custom_theme in Windows OS.

If required, themes can be put into any folder. The path to the folder with web application themes is set in the config.json file in the customThemesPath field.

Open the theme.json configuration file for edit:

{
  "key": "custom_theme",
  "name": "Custom theme",
  "palette": {
    ...
  },
  "size": {
    ...
  },
  "typography": {
    ...
  },
  ...
}

Change field values:

key. Theme key. It is set according to the theme name specified at Step 1.
name. Theme name. FAP 10 by default.
palette. Web application interface element colors.
size. Web application interface element size.
typography. Font options for web application interface elements.

If required, change the rest of the theme settings.

Change icons contained in the icons folder.
Specify theme key in the config.json file in the themes field:

"themes": ["custom_theme", "fap10"]

The first theme is used by default.

restart the web application back end depending on the server in use:

ASP.NET. It is available only in Windows OS. For details see the Internet Information Services documentation.
Apache2. It is available only in Linux OS. Execute the command:

Debian-based distributions:

sudo systemctl restart apache2-fp10.x-web

RedHat-based distributions:

sudo systemctl restart httpd-fp10.x-web

ALT Linux:

sudo systemctl restart httpd2-fp10.x-web

Clear browser cache if required.

After executing the operations the custom theme is used on opening the web application.

To use a different theme contained in the array of the themes field, use browser developer tools. Execute the command in the console:

Platform.Themes.select('<theme key>')

NOTE. The default theme will be used in the web application after the browser page is refreshed.