{% extends "main.html" %} {% block title %} Audit Log {% endblock %} {% block
content %}

<div class="relative h-auto mx-auto max-w-[68.75rem] w-[95vw] px-4 py-4">
  <h1 class="mb-4 text-4xl font-extrabold uppercase">Audit Log (Coming soon)</h1>

  <section class="mb-4">
    <form
            action="/history"
            hx-get="/history"
            hx-trigger="change"
            hx-target="#items"
    >
      <div class="flex between">
        <div class="px-2">
          <label for="start-date" class="block">Start Date</label>
          <input
                  type="date"
                  id="start-date"
                  name="start-date"
                  value="{{ start_date }}"
                  class="block"
          />
        </div>
        <div class="px-2">
          <label for="start-time" class="block">Start Time</label>
          <input
                  type="time"
                  id="start-time"
                  name="start-time"
                  value="{{ start_time }}"
                  class="block"
          />
          <small class="block text-sm">Timezone {{ time_zone }}</small>
        </div>
        <div class="px-2">
          <label for="end-date" class="block">End Date</label>
          <input
                  type="date"
                  id="end-date"
                  name="end-date"
                  value="{{ end_date }}"
                  class="block"
          />
        </div>
        <div class="px-2">
          <label for="end-time" class="form-label">End Time</label>
          <input
                  type="time"
                  id="end-time"
                  name="end-time"
                  value="{{ end_time }}"
                  class="block"
          />
          <small class="text-sm block">Timezone {{ time_zone }}</small>
        </div>
      </div>
    </form>
  </section>

  <section id="items" class="mb-4">
    {% include "history_item_fragment.html" %}
  </section>
</div>

{% endblock %}