 Skin form — Components tab — Controls — Dropdowns
|
Styles that you set here apply to dropdown lists. You can define the Standard dropdown style or create custom dropdown formats.
A preview of the currently selected format displays to the right. To preview all dropdown 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.
Text
Applies to the text within the dropdown list.
| 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  to select a different mixin from the list.
- Mixin overrides — Click Add mixin override to override a style set by the mixin:
- Font — Select the font family. The font family defaults to (use overall), which is the font you specified in the Overall Font field at the top of the Mixins tab.
- Font Size — Select the font size in pixels (px), points (pts), em (the current font size), or percentage (%).
- Color — Enter a hexadecimal value (such as #3d3d3d) or click the box next to the field to Choose a Color.
- Font Weight — Select a font weight from the list.
- Text Decoration — Select a text decoration option from the list, if desired. For example, Underline. The blank selection indicates that no additional attributes are applied.
- Transform Text — Select a text transformation option from the list, if desired. For example, Lowercase. The blank selection indicates that no additional attributes are applied.
- Additional styles — Add additional styles, specific to styling the text for this element, by specifying a CSS Attribute and Value. Specify only CSS related to text styles. Click Add additional styles to define another CSS attribute-value pair. Click delete to remove an additional style.
|
| Specify styles
|
Select this checkbox to define a custom text format:
- Font — Select the font family. The font family defaults to (use overall), which is the font you specified in the Overall Font field at the top of the Mixins tab.
- Font Size — Select the font size in pixels (px), points (pts), em (the current font size), or percentage (%).
- Color — Enter a hexadecimal value (such as #3d3d3d) or click the box next to the field to Choose a Color.
- Font Weight — Select a font weight from the list.
- Text Decoration — Select a text decoration option from the list, if desired. For example, Underline. The blank selection is the default, for backward compatibility, and indicates that no additional attributes are applied.
- Transform Text — Select a text transformation option from the list, if desired. For example, Lowercase. The blank selection is the default, for backward compatibility, and indicates that no additional attributes are applied.
- Additional styles — Add additional styles, specific to styling the text for this element, by specifying a CSS Attribute and Value. Specify only CSS related to text styles. Click Add additional styles to define another CSS attribute-value pair. Click delete to remove an additional style.
|
Group Text
Apples to the category under which elements are grouped in the dropdown list.
| 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 to select a different mixin from the list.
- Mixin overrides — Click Add mixin override to override a style set by the mixin:
- Font — Select the font family. The font family defaults to (use overall), which is the font you specified in the Overall Font field at the top of the Mixins tab.
- Font Size — Select the font size in pixels (px), points (pts), em (the current font size), or percentage (%).
- Color — Enter a hexadecimal value (such as #3d3d3d) or click the box next to the field to Choose a Color.
- Font Weight — Select a font weight from the list.
- Text Decoration — Select a text decoration option from the list, if desired. For example, Underline. The blank selection indicates that no additional attributes are applied.
- Transform Text — Select a text transformation option from the list, if desired. For example, Lowercase. The blank selection indicates that no additional attributes are applied.
- Additional styles — Add additional styles, specific to styling the text for this element, by specifying a CSS Attribute and Value. Specify only CSS related to text styles. Click Add additional styles to define another CSS attribute-value pair. Click delete to remove an additional style.
|
| Specify styles
|
Select to define a custom color for the group text. Click the box next to the field to Choose a Color or enter a hexadecimal value (such as #3d3d3d) .
- Additional styles — Add additional styles, specific to styling the text for this element, by specifying a CSS Attribute and Value. Specify only CSS related to text styles. Click Add additional styles to define another CSS attribute-value pair. Click delete to remove an additional style.
|
| Use browser styles for Border and Background
|
Select to use the browser style for the border and background of the dropdown. Clear this checkbox if you want to define styles for the dropdown border and background.
|
Border
Applies to the border of the dropdown.
| 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 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:
- Apply to all sides — select this checkbox to specify the same border style to the top, left, right, and bottom borders. Choose from none, solid, dashed, or dotted.
- If you clear the Apply to all sides checkbox, select a border style for the Top, Left, Right, and Bottom borders. For each of these borders, you can select none, solid, dashed, or dotted. Specify the pixel width and color of the border, if applicable.
|
Background
Applies to the background of the dropdown.
| 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 to select a different mixin from the list.
|
| Specify styles
|
Select to define a custom background color. Click the box next to the field to Choose a Color or enter a hexadecimal value (such as #3d3d3d) .
- Additional styles — Add additional styles, specific to styling the background for this element, by specifying a CSS Attribute and Value. Specify only CSS related to background styles. Click Add additional styles to define another CSS attribute-value pair. Click delete to remove an additional style.
|
Group Background
| 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 to select a different mixin from the list.
|
| Specify styles
|
Select to define a custom background color. Click the box next to the field to Choose a Color or enter a hexadecimal value (such as #3d3d3d) .
- Additional styles — Add additional styles, specific to styling the background for this element, by specifying a CSS Attribute and Value. Specify only CSS related to background styles. Click Add additional styles to define another CSS attribute-value pair. Click delete to remove an additional style.
|
You can create custom dropdown formats that you can apply within your application.
Creating a custom dropdown format
To create a new style format:
- Click Add a format.
- In the Create a new format dialog, type the Format name using only alphanumeric characters (a-z and 0-9) and spaces. The name cannot begin with a number. The style name that you enter is converted into the name CSS class/classes.
- Type a Usage annotation, if desired.
- Click OK. The new format is populated with default values.
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 dropdown format
- In the cell containing the dropdown control, click
to open the Cell Properties panel.
- On the Presentation tab, press the down arrow in the Style field to select the custom format that you want to use.
About Skin rules
Help Home
