# Code
<a href="#" data-toggle="modal" data-target="#overview-modal-<%= index %>">
    <%= render layout: 'recipe_card', locals: { recipe: planned_recipe } do %>
      <%= link_to recipe_path(planned_recipe) do %>
        <i class="fa fa-cutlery btn btn-primary mr-2" aria-hidden="true"></i>
      <% end %>
      <a href="#" data-toggle="modal" data-target="#cooked-modal-<%= index %>">
        <i class="fa fa-check-square-o btn btn-primary" aria-hidden="true"></i>
      </a>
    <% end %>
</a>

# Partial
<div class="recipe-card col-md-4 p-3">
  <div class="card">
    <img class="card-img-top" src="http://via.placeholder.com/350x250" alt="<%= recipe.title %>">
    <div class="card-body">
      <h4 class="card-title text-truncate"><%= recipe.title %></h4>
    </div>
    <div class="card-footer bg-transparent d-flex justify-content-end border-top-0">
      <%= yield if block_given? %>
    </div>
  </div>
</div>

# Result
<a href="#" data-toggle="modal" data-target="#overview-modal-0"></a>
<div class="recipe-card col-md-4 p-3"><a href="#" data-toggle="modal" data-target="#overview-modal-0">
  </a><div class="card"><a href="#" data-toggle="modal" data-target="#overview-modal-0">
    <img class="card-img-top" src="http://via.placeholder.com/350x250" alt="Roasted Cherry Tomatoes with Angel Hair">
    <div class="card-body">
      <h4 class="card-title text-truncate">Roasted Cherry Tomatoes with Angel Hair</h4>
    </div>
    </a><div class="card-footer bg-transparent d-flex justify-content-end border-top-0"><a href="#" data-toggle="modal" data-target="#overview-modal-0">

      </a><a href="/recipes/21">
        <i class="fa fa-cutlery btn btn-primary mr-2" aria-hidden="true"></i>
</a>      <a href="#" data-toggle="modal" data-target="#cooked-modal-0">
        <i class="fa fa-check-square-o btn btn-primary" aria-hidden="true"></i>
      </a>

    </div>
  </div>
</div>