<template>
<div class="fl-empty-result">
  <fl-icon
    name="warning"
    :width="58"
    :height="52"
    class="fl-empty-result-icon"
  />
  <div class="fl-empty-result-title">
    По выбранным параметрам объекты не найдены
  </div>
  <div class="fl-empty-result-description">
    Попробуйте изменить фильтры
  </div>
</div>
</template>

<script>
import FlIcon from '@/core-components/icon/FlIcon'
export default {
  name: 'FlEmptyResult',
  components: { FlIcon }
}
</script>

<style lang="scss" scoped>
.fl-empty-result {
  flex-direction: column;
  height: 100%;

  @include flex-center;
}

.fl-empty-result-icon {
  margin-bottom: 30px;
  fill: $grey-04;
}

.fl-empty-result-title {
  margin-bottom: 8px;
  color: $grey-02;
  font-size: 22px;
  text-align: center;
}

.fl-empty-result-description {
  color: $grey-02;
  font-size: 18px;
}
</style>
