<div class="alert flex justify-between w-fit border-3 bg-base-100 border-opacity-100 {% if message.tags %}{{ message.tags }}{% endif %}">
  {% block message-content %}
    <div>{{ message }}</div>
  {% endblock message-content %}
  <button type="button"
          class="rounded-full p-2 hover:bg-gray-100/10 ring-gray-500/50 ring-inset hover:ring-1 focus:outline-none focus:ring-2"
          _="on click remove closest .alert">
    <svg class="h-6 w-6"
         xmlns="http://www.w3.org/2000/svg"
         fill="none"
         viewBox="0 0 24 24"
         stroke="currentColor"
         aria-hidden="true">
      <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
    </svg>
  </button>
</div>
