<div class="d-flex justify-content-center flex-wrap mt-5">
  <div class="d-flex justify-content-center">
    <img src="../../../assets/not-found.svg" width="100%" />
  </div>

  <div class="d-flex flex-column justify-content-md-center justify-content-sm-start ps-2 pt-2">
    <h1 class="text-warning">Ops...</h1>
    <h5>{{messageNotFound}}</h5>
    <h5>{{messageAddRecipe}}</h5>
    <div>
      <button type="button" class="btn btn-outline-primary" [routerLink]="['/add']">Adicionar receita</button>
    </div>
  </div>
</div>
