H1
Description:
io.H1
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:
Card Body
Card Table Column
Col
DIV
Thumbnail
Allowed Child Components:
Popover
Pulse
Trigger Before Render
Trigger On Click
Properties
➤ Display
Select this to change layout of heading.
Allowed Values:
block
inline
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:
Pattern
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:
left
right
top
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:
Light
Normal
Semi Bold
Bold
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:
Small
Normal
Large
Default
➤ Text Align
Choose an option to change the alignment of the text.
Allowed Values:
Left
Center
Right
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:
default
normal
thick
thicker
➤ Border Type
Select an option to change the type of a border
Allowed Values:
solid
dashed
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