Example Directed Edge recommendation style for Shopify's "Debut" theme

debut.liquid

<div class="page-width">
  {%- for group in groups -%}
  <div class="product-recommendations__inner">
    <div class="section-header text-center">
      <h2>{{ group.label }}</h2>
    </div>
    <ul class="grid grid--uniform grid--view-items">
      {%- for product in group.products -%}
      <li class="grid__item small--one-half medium-up--one-quarter">
        {% include 'product-card-grid', max_height: 250, product: product, show_vendor: false %}
      {%- endfor -%}
    </ul>
  </div>
  {% endfor %}
</div>