<style>
  ion-list {
  	position: absolute;
    width: 100%;
    max-height: 50%;
  	z-index: 999;
  }
  ion-item.place:active:after {
  	cursor: pointer;
  	background-color: #ff7d00 !important;
  }
</style>
<ion-header>
  <ion-toolbar color="primary">
    <ion-buttons slot="start">
      <ion-back-button></ion-back-button>
    </ion-buttons>
    <ion-title>{{'categories.header' | translate}}</ion-title>
  </ion-toolbar>
</ion-header>
<ion-content>
  <ion-item>
    <ion-label position="fixed">{{'categories.category' | translate}}</ion-label>
    <ion-input value="{{ category }}" disabled></ion-input>
  </ion-item>
  <ion-item>
    <ion-label position="fixed">{{'categories.address' | translate}}</ion-label>
    <ion-input [(ngModel)]="addressAutocomplete" (ionInput)="autocomplete($event)" (ionFocus)="showlist()"></ion-input>
  </ion-item>
  <ion-list *ngIf="showif && placesSearch && placesSearch.length > 0">
    <ion-item button=true (click)="geoloc(places.place_id, places.description)" *ngFor="let places of placesSearch" class="place">
      {{ places.description }}
    </ion-item>
  </ion-list>
  <ion-item>
    <ion-label position="fixed">{{'categories.int_number' | translate}}</ion-label>
    <ion-input [(ngModel)]="myIntnumber" placeholder="Opcional"></ion-input>
  </ion-item>
  <ion-item>
    <ion-label position="fixed">{{'categories.references' | translate}}</ion-label>
    <ion-textarea [(ngModel)]="references" placeholder="{{'categories.references_placeholder' | translate}}"></ion-textarea>
  </ion-item>
  <ion-item hidden>
    <ion-label position="fixed">Latitud</ion-label>
    <ion-input value="{{ myPosition.latitude }}" disabled></ion-input>
  </ion-item>
  <ion-item hidden>
    <ion-label position="fixed">Longitud</ion-label>
    <ion-input value="{{ myPosition.longitude }}" disabled></ion-input>
  </ion-item>
  <ion-item>
    <ion-label position="fixed">{{'categories.date' | translate}}</ion-label>
    <ion-datetime presentation="date" [(ngModel)]="setDate" (ionChange)="changedate($event)" [min]="minyear" [max]="maxyear"></ion-datetime>
  </ion-item>
  <ion-item>
    <ion-label position="fixed">{{'categories.time' | translate}}</ion-label>
    <ion-datetime presentation="time" [(ngModel)]="setHour" (ionChange)="changehour($event)"></ion-datetime>
  </ion-item>
  <ion-item>
    <ion-label position="fixed">{{'categories.commentaries' | translate}}</ion-label>
    <ion-textarea [(ngModel)]="details"></ion-textarea>
  </ion-item>
  <ion-button type="submit" expand="full" color="primary" (click)="addpostulation()">{{'categories.add_postulation' | translate}}</ion-button>
</ion-content>
