{{ define "main" }}
<div class="notes-layout">
  <aside class="notes-sidebar open" id="notes-sidebar">
    <button class="notes-sidebar-toggle" id="notes-toggle">☰ Notes</button>
    <div class="notes-search">
      <input type="text" id="notes-filter" placeholder="Search notes…" autocomplete="off">
    </div>
    <ul class="notes-list" id="notes-list">
      {{ range .Pages.ByTitle }}
      <li data-url="{{ .RelPermalink }}" data-title="{{ .Title | lower }}" data-body="{{ .Plain | lower | truncate 500 }}">
        <span class="notes-item-title">{{ .Title }}</span>
      </li>
      {{ end }}
    </ul>
  </aside>
  <main class="notes-content" id="notes-content">
    <div class="notes-placeholder">
      <span>Select a note to view</span>
    </div>
  </main>
</div>
{{ end }}