{# Overriding media_slot just for Storybook #}
{% embed 'mercury:card-project' %}
  {% block media %}
    {% if media.src is not empty %}
      <img class="hg:h-full hg:w-full hg:object-cover" src="{{ componentMetadata.path ~ '/' ~ media.src }}" alt="{{ media.alt }}" />
    {% endif %}
  {% endblock %}
  {% block badges %}
    <ul class="hg:flex hg:list-none hg:items-center hg:gap-2 hg:ps-0">
      {% for badge in storybook.badges %}
        <li>
          {{
            include(
              'mercury:badge',
              {
                url: badge.url,
                label: badge.label,
                style: 'secondary'
              }
            )
          }}
        </li>
      {% endfor %}
    </ul>
  {% endblock %}
{% endembed %}
