<div id="calendar-description">
  <form
    hx-post="{{ url_for(
      'calendars.calendar.admin.calendar_description_save',
      slug=post.slug,
      calendar_slug=calendar.slug,
    ) }}"
    hx-target="#calendar-description"
    hx-swap="outerHTML"
  >
    <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">

    <textarea
      name="description"
      autocomplete="off"
      rows="4"
      class="w-full p-2 border rounded"
    >{{ calendar.description or '' }}</textarea>

    <div class="mt-2 flex gap-2 text-xs">
      <button
        type="submit"
        class="px-3 py-1 rounded bg-stone-800 text-white"
      >
        Save
      </button>

      <button
        type="button"
        class="px-3 py-1 rounded border"
        hx-get="{{ url_for(
          'calendars.calendar.admin.calendar_description_view',
          slug=post.slug,
          calendar_slug=calendar.slug,
        ) }}"
        hx-target="#calendar-description"
        hx-swap="outerHTML"
      >
        Cancel
      </button>
    </div>
  </form>
</div>
