Fixes in the Container Element in Loree Editor
Fixes in the Container Element
In the previous version, the height of the Containers inside the editor was fixed at a minimum of 80px as default. However, this adjustment should only be applied when the user selects the container element. When the focus is removed from the container, the minimum height should be removed as well. The purpose of setting a minimum height was to prevent any overlapping issues with the + icon, which is used to add rows inside the container.
This issue is now resolved. Now, when users add a container element in Loree Editor, it will enter selection mode with a minimum height of 80px to prevent overlapping. However, once the element selection is removed, the minimum height will also be removed. It is important to note that this functionality is only applicable within the Loree editor.
For any existing container that has a minimum height defined in its CSS and comes from Canvas, the minimum height will be removed from its CSS due to the native behavior of the editor.
If a user wants to add a minimum height to a container as a required action, they can manually edit the HTML and CSS and apply the minimum height to the nested container <div>, but not the parent <container div>.
Additionally, in the Canvas editor, empty <div> elements are removed due to their native editor behavior.
Therefore, if a user adds an empty container and it does not appear in the Canvas editor, it is because Canvas removes any empty <div> elements from the HTML. It is recommended for users to use the Divider element to separate two elements so that it appears as created in Canvas.
When clicked on the container element:
When clicked outside the container element: