egroupware/api/templates/default/insert_merge_placeholder.xet

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE overlay PUBLIC "-//EGroupware GmbH//eTemplate 2.0//EN" "https://www.egroupware.org/etemplate2.0.dtd">
<overlay>
    <template id="etemplate.insert_merge_placeholder" template="" lang="" group="0" version="21.1.001">
        <et2-vbox  id="outer_box">
            <et2-hbox  id="selects">
                <et2-vbox>
                    <et2-select  id="app"></et2-select>
                    <et2-select  id="group"></et2-select>

                </et2-vbox>
                <et2-listbox  id="placeholder_list" rows="10"/>
            </et2-hbox>
            <et2-hbox  class="preview">
                <et2-description  id="preview_placeholder"></et2-description>
                <et2-button  id="insert_placeholder" label="Insert" statustext="Insert placeholder" align="right" image="export"></et2-button>
            </et2-hbox>
            <hrule/>
            <et2-link-entry  id="entry" label="Preview with entry"></et2-link-entry>
            <et2-hbox  class="preview">
                <et2-description  id="preview_content"></et2-description>
                <et2-button  id="insert_content" label="Insert" statustext="Insert merged content" align="right" image="export" noSubmit="true"></et2-button>
            </et2-hbox>
        </et2-vbox>
        <styles>
            /** Structural stuff **/
            #insert_merge_placeholder #_outer_box > #api\.insert_merge_placeholder_selects {
            flex: 1 1 80%;
            }
            #insert_merge_placeholder #_outer_box > label.et2_label {
            flex: 0 1 auto;
            }
            #insert_merge_placeholder #_outer_box .preview {
            flex: 1 1 2em;
            font-size: larger;
            }
            select#_app {
            flex-grow: 0;
            }
            .ui-dialog-content, div.et2_box_widget, div.et2_box_widget > div.et2_box_widget {
            display: flex;
            flex: 1 1 auto;
            }
            div.et2_hbox {
            flex-direction: row;
            flex-grow: 1;
            }
            div.et2_vbox {
            flex-direction: column;
            gap: 5px;
            }
            div.et2_box_widget > * {
            flex: 1 1 auto;
            width: 100%;
            }
            div.et2_link_entry {
            flex-grow: 0;
            }
            div.et2_link_entry input.ui-autocomplete-input {
            width: 75%
            }
            div.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button, button#cancel, .et2_button {
            border: none;
            border-radius: 0px;
            background-color: transparent;
            }
            div.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button:hover, button#cancel:hover {
            box-shadow: none;
            -webkit-box-shadow: none;
            }
            .preview .et2_button {
            flex: 0 1 24px;
            height: 24px;
            border: none;
            border-radius: 0px;
            background-color: transparent;
            }

            /** Cosmetics **/
            #insert_merge_placeholder {
            min-width: 500px;
            min-height: 250px;
            }
            #_outer_box option:first-letter {
            text-transform: capitalize;
            }
        </styles>
    </template>
</overlay>