Milestone 1.

app/templates/home.html

@@ -7,7 +7,11 @@
       {% if has_vault %}
         <p>Your vault path is configured:</p>
         <code class="kbd kbd-sm">{{ vault_path }}</code>
-        <p class="mt-2">You're ready to proceed with indexing and note features in the next milestones.</p>
+        <div class="mt-3">
+          <a href="{{ notes_url }}" class="btn btn-primary btn-sm">Open Notes</a>
+          <a href="{{ url_for('notes.notes_new') }}" class="btn btn-outline btn-sm ml-2">New Note</a>
+        </div>
+        <p class="mt-4">You're ready to proceed with indexing and note features in the next milestones.</p>
       {% else %}
         <div class="alert alert-warning">
           <span>No vault path configured.</span>

app/templates/notes/list.html

@@ -0,0 +1,34 @@
+{% extends "base.html" %}
+{% block title %}Notes — PKM{% endblock %}
+{% block content %}
+<div class="flex items-center justify-between mb-4">
+  <h1 class="text-2xl font-semibold">Notes</h1>
+  <a href="{{ url_for('notes.notes_new') }}" class="btn btn-primary btn-sm">New note</a>
+</div>
+
+{% if notes %}
+  <div class="space-y-2">
+    {% for n in notes %}
+      <a href="{{ url_for('notes.notes_view', note_id=n.id) }}" class="block card bg-base-100 border hover:shadow">
+        <div class="card-body py-3">
+          <div class="flex flex-wrap items-center gap-2">
+            <span class="font-medium">{{ n.title }}</span>
+            <span class="badge badge-ghost">{{ n.updated }}</span>
+          </div>
+          {% if n.tags %}
+          <div class="flex gap-1 mt-1">
+            {% for t in n.tags %}
+              <span class="badge badge-outline">{{ t }}</span>
+            {% endfor %}
+          </div>
+          {% endif %}
+        </div>
+      </a>
+    {% endfor %}
+  </div>
+{% else %}
+  <div class="alert">
+    <span>No notes yet. Create your first one.</span>
+  </div>
+{% endif %}
+{% endblock %}

app/templates/notes/new.html

@@ -0,0 +1,41 @@
+{% extends "base.html" %}
+{% block title %}New Note — PKM{% endblock %}
+{% block content %}
+<div class="max-w-3xl mx-auto">
+  <h1 class="text-2xl font-semibold mb-4">New Note</h1>
+
+  {% if error %}
+  <div class="alert alert-error mb-4">
+    <span>{{ error }}</span>
+  </div>
+  {% endif %}
+
+  <form method="post" action="{{ url_for('notes.notes_create') }}" class="space-y-4">
+    <div class="form-control">
+      <label class="label">
+        <span class="label-text">Title</span>
+      </label>
+      <input name="title" value="{{ title or '' }}" class="input input-bordered" placeholder="Note title" required />
+    </div>
+
+    <div class="form-control">
+      <label class="label">
+        <span class="label-text">Body (Markdown)</span>
+      </label>
+      <textarea name="body" rows="10" class="textarea textarea-bordered" placeholder="# Heading...">{{ body or '' }}</textarea>
+    </div>
+
+    <div class="form-control">
+      <label class="label">
+        <span class="label-text">Tags (comma-separated)</span>
+      </label>
+      <input name="tags" value="{{ tags_raw or '' }}" class="input input-bordered" placeholder="tag1, tag2" />
+    </div>
+
+    <div class="flex gap-2">
+      <button class="btn btn-primary" type="submit">Create</button>
+      <a class="btn btn-ghost" href="{{ url_for('notes.notes_index') }}">Cancel</a>
+    </div>
+  </form>
+</div>
+{% endblock %}

app/templates/notes/view.html

@@ -0,0 +1,45 @@
+{% extends "base.html" %}
+{% block title %}{{ note.title }} — PKM{% endblock %}
+{% block content %}
+<div class="max-w-3xl mx-auto">
+  <div class="flex items-center justify-between">
+    <h1 class="text-3xl font-semibold">{{ note.title }}</h1>
+    <a class="btn btn-sm" href="{{ url_for('notes.notes_index') }}">All notes</a>
+  </div>
+
+  <div class="mt-2 flex flex-wrap items-center gap-2 text-sm opacity-80">
+    <span>ID: <code class="kbd kbd-sm">{{ note.id }}</code></span>
+    <span>Created: {{ note.created }}</span>
+    <span>Updated: {{ note.updated }}</span>
+    {% if note.status %}<span class="badge badge-outline">{{ note.status }}</span>{% endif %}
+    {% if note.tags %}
+      <span class="ml-2">Tags:</span>
+      <div class="flex gap-1">
+        {% for t in note.tags %}
+          <span class="badge badge-ghost">{{ t }}</span>
+        {% endfor %}
+      </div>
+    {% endif %}
+  </div>
+
+  <div class="mt-4">
+    <h2 class="text-lg font-medium mb-2">Body (raw Markdown)</h2>
+    <pre class="p-4 bg-base-200 rounded overflow-x-auto whitespace-pre-wrap">{{ note.body }}</pre>
+  </div>
+
+  <div class="mt-6">
+    <h3 class="font-medium mb-2">Quick edit</h3>
+    <form method="post" action="{{ url_for('notes.notes_update_body', note_id=note.id) }}">
+      <textarea name="body" rows="10" class="textarea textarea-bordered w-full">{{ note.body }}</textarea>
+      <div class="mt-2">
+        <button class="btn btn-primary btn-sm" type="submit">Save</button>
+      </div>
+    </form>
+  </div>
+
+  <div class="mt-6 opacity-70 text-sm">
+    <div>File: <code class="kbd kbd-sm">{{ note.rel_path }}</code></div>
+    <div>Slug: <code class="kbd kbd-sm">{{ note.slug }}</code></div>
+  </div>
+</div>
+{% endblock %}