AkurAI-Notes / site/frontend/app.html

Latest change bdf7c9c318161bf8ea889239ed60d40de39453ff - AKURAI-NOTES-8 fix sidebar scrolling and add top search dropdown by Ólafur Búi Ólafsson

{% include "header" %}
<script>document.body.classList.add("is-app");</script>
<div class="workspace" id="workspace" aria-busy="true">
  <aside class="ws-sidebar" id="ws-sidebar" aria-label="Notebooks and views">
    <div class="ws-side-head">
      <div class="ws-user">
        <span class="ws-avatar" id="ws-avatar" aria-hidden="true">·</span>
        <span class="ws-user-meta">
          <span class="ws-user-name" id="ws-user-name">AkurAI Notes</span>
          <span class="ws-user-sub" id="ws-user-sub">Loading…</span>
        </span>
      </div>
      <button type="button" class="ws-search-btn" id="ws-open-search">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true"><circle cx="11" cy="11" r="7"/><path d="m21 21-4.3-4.3"/></svg>
        <span>Search notes</span>
        <span class="kbd">⌘K</span>
      </button>
    </div>
    <nav class="ws-nav" id="ws-views" aria-label="Quick views"></nav>
    <div class="ws-scroll">
      <div class="ws-section-label">
        Notebooks
        <button type="button" class="add" id="ws-add-notebook" title="New notebook" aria-label="New notebook">
          <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true"><path d="M12 5v14M5 12h14"/></svg>
        </button>
      </div>
      <div class="ws-tree" id="ws-tree"></div>
      <div class="ws-section-label">
        Tags
        <button type="button" class="add" id="ws-add-tag" title="New tag" aria-label="New tag">
          <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true"><path d="M12 5v14M5 12h14"/></svg>
        </button>
      </div>
      <div class="ws-tree" id="ws-tags"></div>
    </div>
    <div class="ws-side-foot" id="ws-foot"></div>
  </aside>
  <div class="ws-scrim" id="ws-scrim" aria-hidden="true"></div>
  <main class="ws-main">
    <div class="ws-topbar">
      <button type="button" class="ws-drawer-btn" id="ws-drawer" aria-label="Open navigation">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true"><path d="M3 6h18M3 12h18M3 18h18"/></svg>
      </button>
      <div class="ws-crumbs" id="ws-crumbs" aria-label="Breadcrumb"></div>
      <span class="spacer"></span>
      <div id="ws-topbar-actions" style="display:flex;align-items:center;gap:10px;"></div>
      <button type="button" class="ws-top-search" id="ws-top-search" aria-label="Search notes" title="Search notes">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true"><circle cx="11" cy="11" r="7"/><path d="m21 21-4.3-4.3"/></svg>
      </button>
    </div>
    <div class="ws-search-drop" id="ws-search-drop" hidden>
      <div class="ws-search-head">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true"><circle cx="11" cy="11" r="7"/><path d="m21 21-4.3-4.3"/></svg>
        <input type="text" id="ws-search-input" placeholder="Search notes by title and text…" autocomplete="off" spellcheck="false" aria-label="Search notes">
      </div>
      <div class="ws-search-results" id="ws-search-results"></div>
    </div>
    <div class="ws-body" id="ws-body" tabindex="-1"></div>
  </main>
</div>
<div class="ws-toasts" id="ws-toasts" aria-live="polite" aria-atomic="false"></div>
<script type="module" src="/notes-app.js"></script>
<script type="module">
  window.NotesApp.initWorkspace();
</script>
{% include "footer" %}