<div class="spacer"></div>
<div *ngIf="item;let item">
  <div class="card border-0">
    <div class="card-body">
      <div class="mb-2"><a href="#" (click)="handleBackToList($event)" i18n>Back</a></div>
      <h1>{{item.name}}</h1>
      <div class="legend-container" *ngIf="item?.data.layers;let layers">
        <!--<div *ngIf="layers.length>1">
          <select (change)="onLayerChanged($event.target.value)">
            <option *ngFor="let l of layers;let layerIndex = index" [value]="layerIndex">{{l.name}}</option>
          </select>
        </div>-->
        <fm-map-layer-legend [layer]="layers[selectedLayer]" [histogramenabled]="false" histogramunit="ha"></fm-map-layer-legend>
      </div>
      <ul class="p-0 mt-2">
        <!--<li><a href="/api/v1/items/{{item.code}}/file" class="mt-1 mr-1" i18n><i class="fa fa-download" aria-hidden="true" title="Download"></i> Download</a></li>-->
        <li><a href="#" class="mt-1 mr-1" (click)="handleOnEdit(item)" i18n><i class="fa fa-pencil" aria-hidden="true" title="Edit"></i> Edit</a></li>
        <li *ngIf="itemTypeService.isLayer(item)"><a href="#" (click)="handleAddAsLayer(item)" class="mt-1 mr-1" i18n><i class="fa fa-eye" aria-hidden="true" title="Add as layer"></i> Add as overlay</a></li>
      </ul>      
    </div>   
  </div>
 </div>