projektarbeit_duelger_waldhauser_caliskan/software/Frontend/src/app/Plants/plant-card/plant-card.component.html

<div class="container">
  <div class="item-header-content">
    <div class="item-header">
      <p class="card-title">{{plant.PlantName}}</p>
    </div>
    <div class="item-Measurements-IconsAndNames">
      <img class="icons-measurements" src="assets/images/Icons-Card/air_humidity_icon.png" alt="not available">
      Air Humidity: <br>
      <img class="icons-measurements" src="assets/images/Icons-Card/air_temperature_icon.png" alt="not available">
      Air Temperature: <br>
      <img class="icons-measurements" src="assets/images/Icons-Card/soil_moisture_icon.png" alt="not available">
      Soil Moisture: <br>
      <img class="icons-measurements" src="assets/images/Icons-Card/brightness_icon.png" alt="not available">
      Brightness:<br>
      <img class="icons-measurements" src="assets/images/Icons-Card/Timestamp_icon.png" alt="not available">
      Timestamp:
    </div>
    <div class="item-Measurements-Values">
      <p>{{plant.AirHumidity}} %</p>
      <p>{{plant.AirTemperature}} °C</p>
      <p>{{plant.SoilMoisture}} %</p>
      <p>{{plant.Brightness}} Lux</p>
      <p>{{getFormattedLastRequestedTimestamp() | async}}</p>
    </div>
  </div>
  <div class="item-IMG">
    <img class="IMG-Plants" src="assets/images/Pflanze.png" alt="Plant is not available">
    <img class="IMG-Plants" src="assets/images/Pflanze.png" alt="Plant is not available">
  </div>
  <div class="item-delete">
    <button class="item-Configure" mat-icon-button color="primary" (click)="onConfigurePlant()">
      <mat-icon>create</mat-icon>
    </button>
    <button mat-icon-button color="warn" (click)="onDeletePlant()">
      <mat-icon class="delete-icon">delete</mat-icon>
    </button>
  </div>
</div>