H4

Description:

io.H4

It can be used as a header for a whole page (the most common usage), but can also be used as the header for any other piece of on-page content.

Allowed Parent Components:

  1. Card Body

  2. Card Table Column

  3. Col

  4. DIV

  5. Thumbnail

Allowed Child Components:

  1. Popover

  2. Pulse

  3. Trigger Before Render

  4. Trigger On Click

Properties

➤ Display

Select this to change layout of heading.

Allowed Values:

  1. block

  2. inline

  3. Default

➤ Small

Check this to display heading in small size.

Allowed Values: Yes/No

➤ Text

Enter a static or expression based heading. e.g. Heading, Heading1 etc.

Allowed Values: An expression which should return string after evaluation

➤ View Attribute

Select the view attribute associated to this field.

Allowed Values: Select the view attribute associated to this field.

➤ Class Name Expression

Allowed Values: An expression which should return string after evaluation

➤ Format Type

Allowed Values:

  1. Pattern

  2. Custom

➤ Format

Allowed Values: Free text field

➤ Pattern Format

If hash format defined, hash string allow number input inplace of hash. ex: #### #### #### ####

Allowed Values: Free text field

➤ Mask Format

If mask defined, component will show non entered placed with masked value. ex: _

Allowed Values: Free text field

➤ Prefix

Provide a symbol which is placed before the value. e.g. $50.

Allowed Values: Free text field

➤ Thousand Separator

Add thousand separators on number

Allowed Values: Yes/No

➤ Decimal Scale

If defined it limits to given decimal scale

Allowed Values: Any number value

➤ Fixed Decimal Scale

If true it add 0s to match given decimalScale

Allowed Values: Yes/No

➤ Pretty Date

Allowed Values: Yes/No

➤ Tool Tip

A message which appears when a cursor is positioned over.

Allowed Values: An expression which should return string after evaluation

➤ Tool Tip Position

Select an option to change the placement of the tooltip when appears.

Allowed Values:

  1. left

  2. right

  3. top

  4. bottom

➤ Min Height

Provide a numerical value to specify minimum height. In most cases, you can leave this blank.

Allowed Values: Any number value

➤ Max Height

Provide a numerical value to specify maximum height. In most cases, you can leave this blank.

Allowed Values: Any number value

➤ Min Width

Provide a numerical value to specify minimum width. In most cases, you can leave this blank.

Allowed Values: Any number value

➤ Max Width

Provide a numerical value to specify maximum width. In most cases, you can leave this blank.

Allowed Values: Any number value

➤ On Click

Allowed Values: Controller Function

➤ All Caps

Select this property for capitalizing the text.

Allowed Values: Yes/No

➤ Text Color

Select a color or enter the custom class to change the color of the text.

Allowed Values: Select a color or enter the custom class to change the color of the text.

➤ Font Weight

This property sets how thick or thin characters in text should be displayed.

Allowed Values:

  1. Light

  2. Normal

  3. Semi Bold

  4. Bold

  5. Default

➤ Hint Text

Check this property to fade the font color of the text.

Allowed Values: Yes/No

➤ Italic

Check this property to change the font style of the text to italic.

Allowed Values: Yes/No

➤ Muted

Check this property to change the color of the font to light grey.

Allowed Values: Yes/No

➤ No Decoration

Check this property to remove decoration of the text

Allowed Values: Yes/No

➤ Overflow Ellipsis

Check this property to show hidden overflow content as an ellipsis ('…').

Allowed Values: Yes/No

➤ Text Size

Select an option to change the size of the text.

Allowed Values:

  1. Small

  2. Normal

  3. Large

  4. Default

➤ Text Align

Choose an option to change the alignment of the text.

Allowed Values:

  1. Left

  2. Center

  3. Right

  4. Default

➤ Border Top

Select this to add a border on top

Allowed Values: Yes/No

➤ Border Right

Select this to add a border on right

Allowed Values: Yes/No

➤ Border Bottom

Select this to add a border on bottom

Allowed Values: Yes/No

➤ Border Left

Select this to add a border on left

Allowed Values: Yes/No

➤ Border Width

Select an option to change the width of a border

Allowed Values:

  1. default

  2. normal

  3. thick

  4. thicker

➤ Border Type

Select an option to change the type of a border

Allowed Values:

  1. solid

  2. dashed

  3. dotted

➤ Border Color

Select a color or enter the custom class to set the color on the sides of the element's border.

Allowed Values: Select a color or enter the custom class to set the color on the sides of the element's border.

➤ Margin

Select a value to add margin on all four sides of the component. It is a shorthand for margin-top, margin-right, margin-bottom, and margin-left.

Allowed Values: Any number value

➤ Margin Bottom

Select a value to add margin on the bottom of the component.

Allowed Values: Any number value

➤ Margin Left

Select a value to add margin on the left of the component.

Allowed Values: Any number value

➤ Margin Right

Select a value to add margin on the right of the component.

Allowed Values: Any number value

➤ Margin Top

Select a value to add margin on the top of the component.

Allowed Values: Any number value

➤ Padding

Select a value to add padding on all four sides of the component. It is a shorthand for padding-top, padding-right, padding-bottom, and padding-left.

Allowed Values: Any number value

➤ Padding Bottom

Select a value to add padding in the bottom of the component.

Allowed Values: Any number value

➤ Padding Left

Select a value to add padding in the left of the component.

Allowed Values: Any number value

➤ Padding Right

Select a value to add padding in right of the component.

Allowed Values: Any number value

➤ Padding Top

Select a value to add padding in top of the component.

Allowed Values: Any number value

➤ Use Server Timezone

Check this prop if this date should not be converted to browser's timezone. Also make sure the attribute type is set to 'String Date & Time 2' on the server side DataSource definition.

Allowed Values: Yes/No

➤ Timezone Attribute

Select an attribute to set the timezone to the respective field

Allowed Values: Select an attribute to set the timezone to the respective field

Last updated