Elements
An entity contains elements of different types, specific properties can be modeled for each of these types.
Some elements may contain other elements, in these cases they are called superior elements while the elements they contain are called inferior elements.
Superior Elements
Operations
Add Elements to the Entity
The elements can be added to an entity via “drag-and-drop”, at any location within a superior element.
When adding an element, it automatically docks to the top or bottom border of a higher-hierarchy element, always to the nearest one.
When elements are added, their width is defined by default as a percentage, with the exception of the button element, which has an automatic width.
Modify Position of an Element
Once the element is added, its position can be changed by dragging it within the entity or by changing its structure and position properties with respect to the superior element.
If an element changes its position, this applies to all breakpoints.
Modify Element Size
The dimensions of an element can be modified by dragging the handles on its outline or by modifying its structure properties.
Guides
There are different types of guides that are displayed when selecting an element and pressing the “Alt” key.
•Docking guides: they are displayed when moving an element and the position where it is moved depends on how close it is to its highest hierarchy element. In addition, the distance to the margins of the superior elements is indicated.
•Alignment Guides: they are displayed to help elements stay aligned.
•Guides to know the space between elements.
Properties
Each element has specific properties that are displayed using a context menu, which is enabled when selecting the element. Properties are grouped according to their functionality and are detailed for each element type.
