catalog-ui/src/app/ng2/components/ui/modal/add-elements/add-elements.component.html

   1 <div class="component-add-element">
   2     <div class="add-element-selection-container">
   3         <sdc-dropdown class="add-element-selection" selectedOption="selectedElement" placeHolder="Please choose option"
   4                       (changed)="onElementSelected($event)" [options]="dropdownOptions"></sdc-dropdown>
   5         <svg-icon-label class="add-element-button" [class.disabled]="!selectedElement"
   6                         name="plus-circle-o"
   7                         mode="primary"
   8                         size="medium"
   9                         label="ADD"
  10                         labelPlacement="right"
  11                         clickable="{{!!selectedElement}}"
  12                         (click)="addElement()">
  13         </svg-icon-label>
  14     </div>
  15
  16     <div class="elements-list">
  17         <ul>
  18             <li *ngFor="let element of existingElements" class="elements-list-item">
  19                 <span>{{element.name}}</span>
  20                 <svg-icon-label name="trash-o" clickable="true" size="small" class="elements-list-item-delete"
  21                                 data-tests-id="delete_target" (click)="removeElement(element)"></svg-icon-label>
  22             </li>
  23         </ul>
  24         <div *ngIf="existingElements.length===0" class="add-element-no-data">
  25             <div class="add-element-no-data-title">No {{elementName}} have been added yet.</div>
  26             <div class="add-element-no-data-content">Begin typing or select {{elementName}} above</div>
  27         </div>
  28     </div>
  29
  30 </div>