image-folder-dialog.html

<div class="image-folder-dialog template modal">
    <div class="modal-header">
        <h1 class="dialog-title">{{Strings.LIVE_DEV_IMAGE_FOLDER_DIALOG_TITLE}}</h1>
    </div>
    <div class="modal-body">
        <p>{{Strings.LIVE_DEV_IMAGE_FOLDER_DIALOG_DESCRIPTION}}</p>
        <input type="text"
               id="folder-path-input"
               placeholder="{{Strings.LIVE_DEV_IMAGE_FOLDER_DIALOG_PLACEHOLDER}}"
               value=""
               autocomplete="off"
               spellcheck="false">

        <!-- the folder suggestions will come here dynamically -->
        <div id="folder-suggestions"></div>

        <p class="folder-help-text">
            {{Strings.LIVE_DEV_IMAGE_FOLDER_DIALOG_HELP}}
        </p>

        <div class="remember-folder-container">
            <label>
                <input type="checkbox" id="remember-folder-checkbox" checked>
                <span>{{Strings.LIVE_DEV_IMAGE_FOLDER_DIALOG_REMEMBER}}</span>
            </label>
        </div>
    </div>
    <div class="modal-footer">
        <button class="dialog-button btn" data-button-id="cancel">{{Strings.CANCEL}}</button>
        <button class="dialog-button btn primary" data-button-id="ok">{{Strings.OK}}</button>
    </div>
</div>