Skin form — Components tab — Controls — Buttons |
Styles set here apply to buttons. For the following formats, you can specify the height of the button and the style of the text, border and background:
You can also create custom button formats.
A preview of the currently selected format displays to the right. To preview all Button formats, click Preview All.
You can also preview formats by selecting Actions > Launch in the toolbar and then choosing one of the following preview options: Run Process, Open Portal, Harness Preview, UI Gallery Preview, Skin Preview.
Use mixin |
Select to use a mixin to define the appearance of this element. The Mixin field displays the name and a preview of the currently selected mixin. Click the gear icon to select a different mixin from the list.
|
Specify styles |
Select this check box to define a custom text format:
|
Use mixin |
Select to use a mixin to define the appearance of this element. The Mixin field displays the name and a preview of the currently selected mixin. Click the gear icon to select a different mixin from the list. If desired, you can specify the Top, Left, Right, or Bottom border as none, solid, dashed, or dotted , rather than inheriting the style from the selected mixin. |
Specify styles |
Select to define a custom border:
|
enable rounded corners (HTML5 only) |
Select this check box if you want the border of the overlay to have rounded corners when rendered in HTML5 document type. You can select this option when using a mixin or a custom border. For information about rendering your application in HTML5 document type, see HTML5 Application Readiness. Rounded corners do not work when the UI is rendered in quirks mode. |
same for all corners |
Select to use the rounded corner settings that you specify in the Unit and Radius fields for all four corners or clear to specify the length of the x and y axis for the Top Left, Top Right, Bottom Left, and Bottom Right. |
same x and y axis radii |
Select to specify x and y radii of the same length. If you clear this check box, specify the length of the x and y axis for the Top Left, Top Right, Bottom Left, and Bottom Right. |
Unit | Select the unit of measurement for the rounded corner settings: pixels (px), em (the current font size), or percentage (%). |
Radius |
Define the curve of rounded corners by specifying the x (hortizontal) and y (vertical) radii of the quarter ellipse that makes the rounded corner of the overlay. |
Use mixin |
Select to use a mixin to define the appearance of this element. The Mixin field displays the name and a preview of the currently selected mixin. Click the gear icon to select a different mixin from the list. |
Specify styles |
Select this check box to define a custom background: Select the background Type:
|
Height | Specify the height of the button by entering a value in pixels. |
Padding |
Specify the width of the padding in pixels. Clear the Apply same padding on all sides checkbox if you want to specify a different amount of padding, in pixels, for Top, Left, Right, and Bottom. |
To create a new style format:
If you want to create a new format that is a copy of an existing format, right-click the format that you want copy and then click Clone.
Applying a custom button format
You can delete styles that you create; click .
Harness and Section forms — Adding a Button control | |
Skin rules — Completing the Components tab |