platform/io.sc.platform.lcdp.frontend/public/flowable/modeler/views/form-builder.html

<div class="subheader editor-toolbar" id="editor-header">
    <div class="fixed-container">
        <div class="btn-group">
            <div class="btn-toolbar pull-left" ng-controller="FormToolbarController" ng-cloak>
                <button id="{{item.id}}"
                        title="{{item.title | translate}}"
                        ng-repeat="item in items"
                        ng-switch on="item.type"
                        class="btn btn-inverse" ng-class="{'separator': item.type == 'separator'}"
                        ng-disabled="item.type == 'separator' || item.enabled == false"
                        ng-click="toolbarButtonClicked($index)">
                        
                    <i ng-switch-when="button" ng-class="item.cssClass" class="toolbar-button" data-toggle="tooltip"
                       title="{{item.title | translate}}"></i>

                    <div ng-switch-when="separator" ng-class="item.cssClass"></div>
                </button>
            </div>
        </div>
        <div class="btn-group pull-right" ng-show="!secondaryItems.length">
            <div class="btn-toolbar pull-right" ng-controller="FormToolbarController">
                <button title="{{item.title | translate}}" ng-repeat="item in secondaryItems track by $index"
                        ng-switch on="item.type" class="btn btn-inverse"
                        ng-class="{'separator': item.type == 'separator'}"
                        ng-disabled="item.type == 'separator'" ng-click="toolbarSecondaryButtonClicked($index)"
                        id="{{item.id}}">
                    <i ng-switch-when="button" ng-class="item.cssClass" class="toolbar-button" data-toggle="tooltip"
                       title="{{item.title | translate}}"></i>

                    <div ng-switch-when="separator" ng-class="item.cssClass"></div>
                </button>
            </div>
        </div>
    </div>
</div>
<div class="inset fixed-container form-palette" ng-mousedown="cancelEditing($event)">
    <div class="col-sm-2" auto-height style="overflow: auto;">
        <ul style="font-family: Arial, Regular;font-size: 17px;color: #323437;list-style: none;padding:0;">
            <li class="stencil-item" ng-repeat="palletteElement in palletteElements"
                class="palette-entry"
                ng-model="draggedElement"
                id="{{palletteElement.type}}"
                title="{{palletteElement.title}}"
                dnd-draggable="palletteElement"
                dnd-type="'width-1'">
                <img width="32" height="32" ng-src="{{palletteElement.icon}}"/>
                {{palletteElement.title}}
            </li>
        </ul>
    </div>
    <div class="col-sm-10" style="height:100%; overflow: auto;">
        <div class="center-pane">
            <div class="content">
                <div class="header clearfix">
                    <h2>{{currentForm.name}}</h2>

                    <div class="pull-left badge-wrapper">
                        <span class="badge">{{'FORM-BUILDER.VERSION' | translate:currentForm}}</span>
                        <span>&nbsp;&nbsp;{{'FORM-BUILDER.LAST-UPDATED' | translate:currentForm}}</span>
                    </div>
                </div>
                <div class="tabs-wrapper">

                    <div tab-control="tabs" active-tab="formBuilder.activeTab">
                    </div>
                    <div id="canvasSection" class="content-canvas-wrapper"
                         ng-show="formBuilder.activeTab == 'design'"
                         ng-class="{'editing': editState.editing}">

                        <ul style="min-height:400px; width: 100%"
                            class="form-canvas content-canvas"
                            dnd-list="formItems"
                            dnd-allowed-types="['width-1']"
                            dnd-drop="onFieldDrop(item, formItems, event, index)"
                            dnd-after-drop="afterDropField(item,formItems,event)">
                            <li ng-repeat="field in formItems track by field._guid" class="form-field-wrapper"
                                dnd-draggable="field"
                                dnd-effect-allowed="move"
                                dnd-type="'width-1'"
                                dnd-moved="onFieldMoved(field, formItems)">
                                <div draggable="true" id="{{field._guid}}" form-builder-element form-element="field" edit-state="editState"
                                     drop="onFieldDrop(item, list, event, index)" moved="onFieldMoved(item, list)" class="canvas-element">
                                </div>
                            </li>
                        </ul>
                    </div>

                    <div ng-show="formBuilder.activeTab == 'outcome'" class="detail-wrapper">
                        <div class="well">
                            <p>{{'FORM-BUILDER.OUTCOMES.DESCRIPTION' | translate}}</p>

                            <div class="radio">
                                <label>
                                    <input type="radio" name="outcome" ng-value="false" ng-model="model.useOutcomes">
                                    {{'FORM-BUILDER.OUTCOMES.NO-OUTCOMES-OPTION' | translate}}
                                </label>
                            </div>
                            <div class="radio">
                                <label>
                                    <input type="radio" name="outcome" ng-value="true" ng-model="model.useOutcomes">
                                    {{'FORM-BUILDER.OUTCOMES.OUTCOMES-OPTION' | translate}}
                                </label>
                            </div>
                        </div>
                        <div ng-if="model.useOutcomes">
                            <h4>{{'FORM-BUILDER.OUTCOMES.POSSIBLE-OUTCOMES' | translate}}</h4>

                            <div class="clearfix" ng-repeat="outcome in currentOutcomes track by $index"
                                 style="margin-bottom:5px">
                                <div class="col-xs-8">
                                    <input type="text" class="form-control"
                                           placeholder="{{'FORM-BUILDER.OUTCOMES.NEW-OUTCOME-PLACEHOLDER' | translate}}"
                                           ng-model="outcome.name">
                                </div>
                                <div class="col-xs-2">
                                    <button style="width:110px" ng-show="$index > 0" class="btn btn-default"
                                            ng-click="removeOutcome($index)">{{'FORM-BUILDER.OUTCOMES.REMOVE' | translate}}
                                    </button>
                                </div>
                                <div class="col-xs-2">
                                    <button style="width:110px" ng-show="($index + 1) === currentOutcomes.length"
                                            class="btn btn-default" ng-click="addOutcome()">
                                        {{'FORM-BUILDER.OUTCOMES.ADD' | translate}}
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>