{{ 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-border"
      id="notebook-title"
      type="text"
      value="{{.notebook.Title}}"
    />
  </p>

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

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

  <p class="hide-small">
    <button type="submit" class="main"><i class="bi bi-floppy" title="Save"></i> Save</button>
    <a class="button secondary" 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 id="footer-navbar-container">
    <div id="footer-navbar" class="bar hide-medium hide-large">
      <div class="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="bar-item">
        <a class="button secondary" 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 }}