Changing the font of all labels

The label font is configured according to whether the object that is linked to the label is a predefined business object, a user-defined business object, or an attribute.

Properties for customizing the font of labels

The following properties are used to configure the label font.
CSS Property
Type of Value
Default
Usage
labelFont
Font
Network and Equipment:
Helvetica 12, except:
- in IltShelf: Helvetica 10
- in IltShelfItem: Helvetica 11 (Courier New 11 on Windows® )
Table and Tree:
null
Specifies the font to be used for the label. By default, it is a sans serif font.
alarmBalloonTextFont
Font
Helvetica 12 bold
Denotes the font used to display the text in the alarm balloon.
alarmCountFont
Font
Helvetica 12 bold
Denotes the font used in alarm counts displayed in the object base.
infoWindowTextFont
Font
Helvetica 10
Defines the font of the text displayed in the Information Window.
The desired configuration is obtained by changing the value of each of these properties through the appropriate CSS selectors. Since you want to see the modification reflected in all objects and attributes, modify these values using the selectors that contain only the CSS type information:
  • object : selector that identifies all business objects.
  • attribute : selector that applies to attributes in the table component header.

How to configure user-defined business objects

The following example shows the configuration for all user-defined business objects.
object {
    labelFont: "sansserif-PLAIN-12";
}

How to configure attributes in the table component header

The following example shows the configuration for all attributes.
attribute {
    labelFont: "sansserif-PLAIN-12"
}

How to configure predefined business objects

The following example shows the configuration for all predefined business objects.
object."ilog.tgo.model.IltObject" {
    labelFont:"sansserif-PLAIN-12";
    alarmBalloonTextFont:"sansserif-PLAIN-12";
    alarmCountFont:"sansserif-PLAIN-12";
    infoWindowTextFont:"sansserif-PLAIN-12";
}
To have these properties valid for all graphic components, you can use the cascading behavior in the style sheets, so that this style sheet is imported by all the style sheets set in your specific components.
For example, you should first create a style sheet, shared.css , that defines the values of these properties only. Then, you should import this style sheet into each component-specific style sheet with the @import statement:
@import "shared.css";