In Applications, the layout of Application elements can be edited at various points.
The "View" tab can be found in the elements properties dialog. Style classes that have been defined in the "Design" module can be assigned here.
Style class
Displays the name of the selected style class.
Edit style class
Layout
In this list, you can select from all the layouts that have been published in the "Design" module of the current portal.
In this list, you can select from all the layouts that have been published in the "Design" module of the current portal.
Style classes
Select the desired style class on the left-hand side of the dialog.
Preview
You will see a preview of the selected style class on the right.
Close the dialog by clicking "OK", which also saves all the changes made here.
Edit style class - Arrow symbol
If you activate "Display predefined style classes", you can select predefined style classes by clicking on the corresponding checkboxes. If "Display predefined style classes" is deactivated, the Preview area is displayed instead.
Preview
Displays a preview of the selected style class.
Individual settings
You will see all CSS adjustments listed in the "Individual adjustments" area.
Add CSS rule / Edit CSS rule
Opens a dialog where new CSS rules can be created or existing CSS rules can be edited.
Styles
Detailed information about the settings in the "Styles" area can be found here.
Options
The selector can be edited by clicking the "Options" button.
Click "OK" to save changes to the CSS rules and close the dialog.
Remove CSS rule
Removes the CSS rule from the list.
Move CSS rule up / down
Adjust the order of the CSS rules.
Individual styles are only valid within the application, not portal-wide.
The outside margin of elements on pages where the "Use table layout" setting is disabled can be defined in the design presets for elements.
You can access the "Design presets for elements" dialog via the main menu "Edit / Edit layout".
Control
This column lists all application elements for which the margins and style classes can be defined within a div container.
Top / Right / Bottom / Left
Clicking in one of the checkboxes in the column header selects all the checkboxes in the corresponding column. It is also possible to select or deselect individual checkboxes in the columns. If a checkbox in a column is selected, a margin is set up on the corresponding side of the element. The following style classes are initially assigned to the respective element:
Top
ix-margin-top
Right
ix-margin-right
Bottom
ix-margin-bottom
Left
ix-margin-left
The specification of the margin size is entered in the style classes and can be edited in the "Design" module. Simply search for the name of the style class there. When creating an element in a div container, when moving or copying to a div container or when grouping, the style classes named above will be used. If you move an element with these style classes to a container, which is not a div container, or if you remove a grouping, the style classes are maintained.
Style classes
Each element can be assigned additional style classes here, these will be added automatically to the control when creating an element in a div container.
Please make sure that you spell style classes correctly. And please note that they are case-sensitive. If you would like to specify multiple style classes, these need to be entered with a space between them (e.g. MyFirstClass MySecondClass). The specified style classes need to be in the Portal layout so that they can be used.
Reset to default
Clicking this button restores all settings to their default values.
The "Appearance" tab can be found in the properties dialog of buttons at Tooltip positioning. Style classes that have been defined in the "Design" module can be assigned here. Click here for more information about this dialog.