Did you face an issue that sometimes, while creating an email template in Stripo, the scroll of the Settings Panel stops interacting?
Or do some elements seem to be collapsed? And does this create more outside space?
If yes, it means that the editor is not displayed in the correct size, and, obviously, the editor itself cannot calculate the available height normally.
Due to this, you need to correctly specify the sizes of the containers in which the editor is embedded and identify the max-height styles.
From the perspective of UI, it is just a 2-div area (Settings Panel and Preview Area) and one JS that can be configured in accordance with your needs to be embedded into these areas.
You can independently choose where they should be displayed inside your application and what size to set:
you may set the width of each container according to your preferences;
the height of
stripoPreviewContainer, by default, stretches from the place where it was inserted to the bottom of the screen. To set another value, you need to set the max-height inline style for this container;
the height of
stripoSettingsContaineris, by default, stretched to the height of the content and limited to the bottom of the screen. To set another value, you need to set the max-height inline style for this container;
For example, max-height: calc (100vh - 100px); where 100px is the total height of the top and bottom panels. The max-height style must be specified for each panel separately, if not specified, the height will be adjusted by default from the insertion point to the bottom of the screen.
Thank you for taking the time to read our articles. We hope you will find this information helpful.
If you have any additional questions, please email us at support@stripo.email.
We would be glad to talk with you.