{% load icon %}
{% if request.resolver_match.url_name == url_name %}
<a href="{% url url_name %}" class="bg-gray-900 text-white group flex items-center px-2 py-2 text-sm font-medium rounded-md" aria-current="page">
    {% icon icon_name "text-gray-300 mr-3 flex-shrink-0 h-6 w-6" %}
    <span class="truncate">
      {{ url_title }}
    </span>
</a>
{% else %}
<a href="{% url url_name %}" class="text-gray-300 hover:bg-gray-700 hover:text-white group flex items-center px-2 py-2 text-sm font-medium rounded-md" aria-current="page">
    {% icon icon_name "text-gray-400 group-hover:text-gray-300 mr-3 flex-shrink-0 h-6 w-6" %}
    <span class="truncate">
      {{ url_title }}
    </span>
</a>
{% endif %}
