Overview

This module aligns your Mendix UI with the Siemens User Experience Toolkit for Insights Hub and Industrial IoT.

Documentation

Description

Theme providing typical Insights Hub color codes, icons and a default application layout, based on the Mendix Atlas UI.

Typical usage scenario

Use the theme and get an application layout, colors and icons based on the User Experience Toolkit for Insights Hub and Industrial IoT.

Features

The Siemens Insights Hub Web Content provides you typical color codes, icons and a default application layout as used for Insights Hub apps.

Dependencies

⦁ Atlas_Core

⦁ Atlas_Web_Content

Installation

After importing the module, please replace the content of the file ./theme/web/custom-variables.scss with:

@import '../../themesource/siemensinsightshubwebcontent/web/custom-variables.scss';

Also make sure that within your project settings, the Siemens Insights Hub Web Content is after the Atlas modules:

Configuration

Default web page layout

The Siemens Insights Hub Web Content is providing a new default web page layout, called InsightsHub_Default. Please use this one, rather than the Atlas_Default provided by the Atlas_Core module on each and every Web Page to get the full Theme alive.

Insights Hub Icons

You can select Insights Hub icons from the Siemens Insights Hub Theme Pack to be displayed in your application.

1. Open the properties of a widget which can display an icon (for example a button).

2. Click Select… next to Icon.

3. Open the Insights Hub tab..

4. Find the icon that you want and click Select. The Insights Hub icons are in the module SiemensInsightsHubWebContent.

Insights Hub Icons as an Icon Font

The Siemens Insights Hub Theme Pack provides a font which contains icons. This means that you can use a Insights Hub icon in any page element where you can assign a class.

To do this:

1. Find the icon you wish to use. These have the same names as the icons in the Siemens Insights Hub Web Content and are listed in the App Explorer dock under App > Marketplace modules > SiemensInsightsHubWebContent > Icons.

2. Open the properties of the element to which you wish to add an icon.

3. Set Icon to (none).

4. Add the class iconUxt {icon-name}.

Bug

There are no known bugs