<script>
import ValueUnit from "./valueUnit.vue";

export default {
  name: "iconStaPanel",
  components: {ValueUnit},
  props: ["icon", "label", "value", "unit"]
}
</script>

<template>
  <section class="iconStaPanel">
    <div class="block">
      <img class="icon" :src="icon">
      <div v-text="label"/>
      <value-unit :value="value" :unit="unit" size="large"/>
    </div>
  </section>
</template>

<style scoped lang="scss">
.iconStaPanel {
  font-weight: 400;
  font-size: 18px;
  color: #FFFFFF;


  .block {
    padding-left: 96px;
    position: relative;

    .icon {
      position: absolute;
      top: -16px;
      left: -32px;
      width: 144px;
    }
  }
}
</style>
