base.html

 1{% import "macros.html" as macros %}
 2<!DOCTYPE html>
 3<html lang="en">
 4<head>
 5  <meta charset="UTF-8">
 6  <meta name="viewport" content="width=device-width, initial-scale=1.0">
 7  <title>{% block title %}td{% endblock %}</title>
 8  <link rel="stylesheet" href="/static/oat.min.css">
 9  <link rel="stylesheet" href="/static/td.css">
10  <script src="/static/oat.min.js" defer></script>
11  <script src="/static/td.js" defer></script>
12</head>
13<body data-sidebar-layout>
14  <a href="#main-content" class="skip-link">Skip to main content</a>
15
16  <nav data-topnav>
17    <button data-sidebar-toggle aria-label="Toggle sidebar" class="outline"></button>
18    <strong>td</strong>
19  </nav>
20
21  <aside data-sidebar>
22    <nav aria-label="Project navigation">
23      <ul>
24        <li><a href="/"{% if active_project.is_none() %} aria-current="page"{% endif %}>All projects</a></li>
25        {% for p in all_projects %}
26        <li>
27          <a href="/projects/{{ p }}"{% if active_project.as_deref() == Some(p.as_str()) %} aria-current="page"{% endif %}>{{ p }}</a>
28        </li>
29        {% endfor %}
30      </ul>
31    </nav>
32  </aside>
33
34  <main id="main-content" tabindex="-1">
35    <div class="container p-4">
36      {% block content %}{% endblock %}
37    </div>
38  </main>
39
40  <!-- FAB -->
41  <div class="fab-group" id="fab-group">
42    <div class="fab-actions" id="fab-actions" hidden>
43      <button commandfor="dlg-new-task" command="show-modal" class="fab-action" aria-label="New task">
44        <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 10.656V19a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h12.344"/><path d="m9 11 3 3L22 4"/></svg>
45        <span>Task</span>
46      </button>
47      <button commandfor="dlg-new-project" command="show-modal" class="fab-action" aria-label="New project">
48        <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 10v6"/><path d="M9 13h6"/><path d="M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z"/></svg>
49        <span>Project</span>
50      </button>
51    </div>
52    <button class="fab-toggle" id="fab-toggle" aria-label="Create new…" aria-expanded="false">
53      <svg class="fab-icon-plus" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>
54      <svg class="fab-icon-close" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg>
55    </button>
56  </div>
57
58  {% call macros::task_form_dialog("dlg-new-task", "New task", "", "Create", "create", all_projects, active_project, "nt", "", "", "task", "medium", "medium", "", "") %}{% endcall %}
59
60  <!-- New project dialog -->
61  <dialog id="dlg-new-project" closedby="any">
62    <form method="post" action="/projects">
63      <header>
64        <h3>New project</h3>
65      </header>
66      <div class="vstack">
67        <label data-field>
68          Project name
69          <input type="text" name="name" required placeholder="my-project">
70        </label>
71        <label data-field>
72          Bind path <small class="text-light">(optional directory to link)</small>
73          <input type="text" name="bind_path" placeholder="/home/user/repos/project">
74        </label>
75      </div>
76      <footer>
77        <button type="button" commandfor="dlg-new-project" command="close" class="outline">Cancel</button>
78        <button type="submit">Create</button>
79      </footer>
80    </form>
81  </dialog>
82</body>
83</html>