{{ define "page:content" }}
<form
  method="POST"
  hx-post="{{.formAction}}"
  hx-target="{{.formTarget}}"
  style="margin-bottom: 10px;"
>
  <div class="w3-container page-container">
  <p>
    <label for="notebook-title">Title</label>
    <input
      name="Title"
      class="w3-input w3-border"
      id="notebook-title"
      type="text"
      value="{{.notebook.Title}}"
    />
  </p>

  <p>
    <label for="type-icon">Icon</label>
    <input
      name="Icon"
      class="w3-input w3-border"
      id="notebook-icon"
      type="text"
      value="{{.notebook.Icon}}"
    />
  </p>

  <p>
    <label for="type-description">Description</label>
    <textarea
      name="Description"
      class="w3-input w3-border"
      id="notebook-description"
      type="text"
      rows="5"
      >{{.notebook.Description}}</textarea
    >
  </p>

  <p class="w3-hide-small w3-container">
    <button type="submit" class="w3-btn w3-metro-dark-blue w3-round-large">
      <i class="bi bi-floppy" title="Save"></i> Save
    </button>
    <a
      class="w3-btn w3-metro-blue w3-round-large"
      hx-target="#page-content"
      hx-push-url="true"
      hx-get="/notebooks"
      ><i class="bi bi-arrow-left-circle" title="Back"></i> Back</a>
  </p>
  </div>
  <div class="footerNavbar-container">
  <div class="w3-bar footerNavbar w3-hide-medium w3-hide-large w3-round-large">
    <div class="w3-bar-item">
    <button type="submit" class="w3-btn w3-metro-dark-blue w3-round-large" title="Save">
      <i class="bi bi-floppy"></i>
    </button>
    </div>
    <div class="w3-bar-item">
      <a
    class="w3-btn w3-metro-dark-blue w3-round-large"
    href="/notebooks"
    hx-get="/notebooks"
    hx-push-url="true"
    hx-target="#page-content"
    title="Back"
    ><i class="bi bi-arrow-left-circle"></i>
  </a>
    </div>
    </div>
</form>
{{ end }}